JavaScript Flashcards
1
Q
What is the purpose of variables?
A
Stores data
2
Q
How do you declare a variable?
A
Variable keyword + variable names = variable value;
Must give variable a name
3
Q
How do you initialize (assign a value to) a variable?
A
Assign the value using an assignment operator
= sign
4
Q
What characters are allowed in variable names?
A
$ or underscore
5
Q
What does it mean to say that variable names are “case sensitive”?
A
camelCase - first word lowercase, any additional words have first letter capitalized
6
Q
What is the purpose of a string?
A
Working with any kind of text to add new content to a page
Can contain HTML markup
7
Q
What is the purpose of a number?
A
Involves counting or calculating sums
Numeric values
8
Q
What is the purpose of a boolean?
A
Give values of true or false
Helps determine which part of the script should run
9
Q
What does the = operator mean in JavaScript?
A
Assignment operator
Assigns names to value
10
Q
How do you update the value of a variable?
A
Change the value
11
Q
What is the difference between null and undefined?
A
Null: intentional absence of the value. Undefined: It means the value does not exist in the compiler.
12
Q
Why is it a good habit to include “labels” when you log values to the browser console
A
Name of what is for
helps self and others to define what it is used for
13
Q
Give five examples of JavaScript primitives.
A
undefined, null, boolean, string, and number
14
Q
What data type is returned by an arithmetic operation?
A
Numeric
15
Q
What is string concatenation?
A
Process of joining two or more strings to create one new string
16
Q
What purpose(s) does the + plus operator serve in JavaScript?
A
Addition as well as concatenation
17
Q
What data type is returned by comparing two values (, ===, etc)?
A
Comparison operators
18
Q
What does the += “plus-equals” operator do?
A
adds the value of the right operand to a variable and assigns the result to the variable
19
Q
What are arrays used for?
A
Storing values as a list
20
Q
Describe array literal notation.
A
Values assigned to the array inside of a pair of square brackets, each value separated by a comma.
Don’t need to be same data type
21
Q
How are arrays different from “plain” objects?
A
Can combine arrays and objects to create a data structure
22
Q
What number represents the first index of an array?
A
0
23
Q
What is the length property of an array?
A
sets or returns the number of elements in an array
24
Q
How do you calculate the last index of an array?
A
Name.length - 1
25
Why do we log things to the console?
Making sure everything is working and running correctly
26
What is a method?
Function which is a property of an object
27
How is a method different from any other function?
method is associated with an object
28
How do you remove the last element from an array?
pop()
29
How do you round a number down to the nearest integer?
math.floor()
30
How do you generate a random number?
math.random()
31
How do you delete an element from an array?
splice()
32
How do you append an element to an array?
unshift()
| push()
33
How do you break a string up into an array?
Call the split() method
34
Do string methods change the original string? How would you check if you weren't sure?
No, immutable - log it to the console
35
Roughly how many string methods are there according to the MDN Web docs?
50+
| Allow work with strings after been created
36
Is the return value of a function or method useful in every situation?
no
37
Roughly how many array methods are there according to the MDN Web docs?
3
38
What three-letter acronym should you always include in your Google search about a JavaScript method or CSS property?
MDN
39
Give 6 examples of comparison operators.
< - less than, > - greater than, != - not equal to, || - logical or, === - strictly equal to, && - logical and
40
What data type do comparison expressions evaluate to?
boolean
41
What is the purpose of an if statement?
Evaluates (checks) a condition
42
Is else required in order to use an if statement?
no
43
Describe the syntax (structure) of an if statement.
Keyword, condition, opening curly brace, code to execute if value true, closing curly brace
44
What are the three logical operators?
&& - logical and, || logical or, ! logical not
45
How do you compare two different expressions in the same condition?
Using a logical and && - logical or ||
46
What is the purpose of a loop?
Check a condition that will run the code block
| Repeat a block of code
47
What is the purpose of a condition expression in a loop?
Is evaluated n gets tested every time the loop runs
| It determines if and when the loop stops.
48
What does "iteration" mean in the context of loops?
Means how many times the loop will loop.
49
When does the condition expression of a while loop get evaluated?
evaluated before each pass through the loop
| Before each iteration to decide whether we should stop or not
50
When does the initialization expression of a for loop get evaluated?
evaluated once before the loop begins
51
When does the condition expression of a for loop get evaluated?
evaluated before each loop iteration
52
When does the final expression of a for loop get evaluated?
evaluated at the end of each loop iteration
| After the code block runs
53
Besides a return statement, which exits its entire function block, which keyword exits a loop before its condition expression evaluates to false?
break
54
What does the ++ increment operator do?
Adds one to the operand.
55
How do you iterate through the keys of an object?
Using the for in loop.
56
Why do we log things to the console?
Checks to see if the code is running and working properly
57
What is a "model"?
Representation of something
58
Which "document" is being referred to in the phrase Document Object Model?
The elements of the page
59
What is the word "object" referring to in the phrase Document Object Model?
Each node is an object with methods and properties
60
What is a DOM Tree?
Model of the webpage
61
Give two examples of document methods that retrieve a single element from the DOM.
getElementById( )
| querySelector( )
62
Give one example of a document method that retrieves multiple elements from the DOM at once.
document.querySelectorAll()
63
Give one example of a document method that retrieves multiple elements from the DOM at once.
document.querySelectorAll()
64
Why might you want to assign the return value of a DOM query to a variable?
To avoid having the browser look for that location again.
65
What console method allows you to inspect the properties of a DOM element object?
console.dir()
66
Why would a tag need to be placed at the bottom of the HTML content instead of at the top?
browser needs to go through all the HTML elements before the JavaScript code can access it
67
What does document.querySelector() take as its argument and what does it return?
A css selector and it returns the first element in doc matching the specified set of CSS selectors
Or null if no matches
68
What does document.querySelectorAll() take as its argument and what does it return?
A css selector and it returns a Node List with all the properties of that selector.
69
What is the className property of element objects?
gets and sets the value of the class attribute of the specified element
70
How do you update the CSS class attribute of an element using JavaScript?
Query for element, get new value and assign using the className property.
71
What is the textContent property of element objects?
Property that gets and sets the text content of an element
| Holds parents and children elements - all text inside the element
72
How do you update the text within an element using JavaScript?
Query selector + new value onto textContent property
73
Is the event parameter of an event listener callback always useful?
not always
74
Would this assignment be simpler or more complicated if we didn't use a variable to keep track of the number of clicks?
More complicated
75
Why is storing information about a program in variables better than only storing it in the DOM?
storing DOM locations in a variable prevents the browser from looking for the information.
76
What event is fired when a user places their cursor in a form control?
focus
77
What event is fired when a user's cursor leaves a form control?
blur
78
What event is fired as a user changes the value of a form control?
input
79
What event is fired when a user clicks the "submit" button within a form?
submit
80
What does the event.preventDefault() method do?
tells the user that if the event does not get explicitly handled, its default action should not be taken as it normally would be
81
What does submitting a form without event.preventDefault() do?
Reloads the page
82
What property of a form element object contains all of the form's controls.
elements
83
What property of a form control object gets and sets its value?
value
84
What is one risk of writing a lot of code without checking to see if it works so far?
unchecked bugs, may not be running properly
85
What is an advantage of having your console open when writing a JavaScript program?
able to see where issues occur; debugging
86
What is a method?
A piece of code that is called by a name that is associated with an object
87
How can you tell the difference between a method definition and a method call?
```
Method call has ( ).
calculator.getAverage([23,423,4234])
getAvg method of the calculator obj
Method definition
Has the function keyword and function code block
Getting assigned to a property
```
88
Describe method definition syntax (structure).
1. Method name;
2. Function keyword;
3. Parameters (optional);
4. Opening curly brace;
5. Code;
6. Closing curly brace
89
Describe method call syntax (structure).
1. Object;
2. Method name;
3. Arguments inside parentheses (optional)
90
How is a method different from any other function?
function stored inside an object as a property
91
What is the defining characteristic of Object-Oriented Programming?
Objects can contain both data (as properties) and behavior (as methods)
92
What are the four "principles" of Object-Oriented Programming?
Abstraction
Encapsulation
Inheritance
polymorphism
93
What is "abstraction"?
being able to work with (possibly) complex things in simple ways
Document Object Model is a software example of an abstraction. It is not the original HTML text, but instead a tree of JavaScript objects with convenient methods and properties that allow you to manipulate the document as the user interacts with it.
94
What does API stand for?
application programming interface
95
What is the purpose of an API?
The connection between computers or computer programs
| Converting information from one application to another.
96
What is this in JavaScript?
Refers to an object
| can be recognized as "the object to the left of the dot" when the function is called (as a method).
97
What does it mean to say that this is an "implicit parameter"?
available in a function's code block even though it was never included in the function's parameter list or declared with var
Dont have to state it
98
When is the value of this determined in a function; call time or definition time?
the value of this is determined when the function is called, not when it is defined
when you call a function, it's this will be given the value of the global window object.
99
```
What does this refer to in the following code snippet?
var character = {
firstName: 'Mario',
greet: function () {
var message = 'It\'s-a-me, ' + this.firstName + '!';
console.log(message);
} };
```
Nothing - method is not being called
100
Given the above character object, what is the result of the following code snippet? Why?
character.greet();
The message including Mario’s name in message bc character name was called to the firstName with this
101
```
Given the above character object, what is the result of the following code snippet? Why?
var hello = character.greet;
hello();
```
undefined, nothing before hello - window
| this = window
102
How can you tell what the value of this will be for a particular function or method definition?
The value of "this" will be the object that is calling it
103
How can you tell what the value of this is for a particular function or method call?
The value of this will be in relation to who made the call
104
What kind of inheritance does the JavaScript programming language use?
Prototype-based inheritance
105
What is a prototype in JavaScript?
JavaScript prototype is an object that contains properties and methods that can be used by other objects.
106
How is it possible to call methods on strings, arrays, and numbers even though those methods don't actually exist on objects, arrays, and numbers?
Because those methods are inside a prototype object
107
If an object does not have it's own property or method by a given key, where does JavaScript look for it?
in the prototype object
108
What does the new operator do?
Lets developers create an instance of a user-defined object type or of one of the built-in object types that has a constructor function
109
What property of JavaScript functions can store shared behavior for instances created with new?
Prototype
110
What does the instanceof operator do?
It checks if a prototype property appears anywhere in the prototype chain of an object
Return value is boolean
111
What is a "callback" function?
is a function passed into another function as an argument, which is then invoked inside the outer function to complete some kind of routine or action.
112
Besides adding an event listener callback function to an element or the document, what is one way to delay the execution of a JavaScript function until some point in the future?
Using setTimeout( ) function
113
How can you set up a function to be called repeatedly without using a loop?
Using setInterval() function
114
What is the default time delay if you omit the delay parameter from setTimeout() or setInterval()?
0
115
What do setTimeout() and setInterval() return?
They return a timeoutID or intervalID, which are positive integer values.
116
What is AJAX?
Allows you to request data from a server and load it without having to refresh the entire page
117
What does the AJAX acronym stand for?
Asynchronous JavaScript And XML.
118
Which object is built into the browser for making HTTP requests in JavaScript?
XMLRequest object
119
What event is fired by XMLHttpRequest objects when they are finished loading the data from the server?
Load event
120
An XMLHttpRequest object has an addEventListener() method just like DOM elements. How is it possible that they both share this functionality?
Because both descend from the same class being EventTarget.
121
What is JSON?
Javascript object notation
common data interchange format used to send and store information in computer systems
Text-based data format following JavaScript object syntax, exists as a string
122
What are serialization and deserialization?
Serialization is the process of turning an object in memory into a stream of bytes
can do stuff like store it on disk or send it over the network.
Deserialization is the reverse process
turning a stream of bytes into an object in memory
123
Why are serialization and deserialization useful?
Transmit data across network
124
How do you serialize a data structure into a JSON string using JavaScript?
Using JSON.Stringify( ).
125
How do you deserialize a JSON string into a data structure using JavaScript?
Using JSON.parse()
126
What is a code block? What are some examples of a code block?
code blocks are denoted by curly braces { }
| ex: if, for, while
127
What does block scope mean?
the variable inside the block is a new variable and it shadows the variable declared at the top of the script
128
What is the scope of a variable declared with const or let?
Blocked scope variables
129
What is the difference between let and const?
const - denotes that a variable is a constant and can't be reassigned
let - can be reassigned
130
Why is it possible to .push() a new value into a const variable that points to an Array?
the actual value to which the const variable reference is not immutable
131
How should you decide on which type of declaration to use?
if the variable will be reassigned
| use let otherwise use const
132
What is the syntax for writing a template literal?
wrapping your text in backticks and writing expressions inside ${ }
133
What is "string interpolation"?
replacing placeholders with values in a string literal
134
What is destructuring, conceptually?
extracting data from arrays or objects into smaller parts
135
What is the syntax for Object destructuring?
let / const keyword { propertyOfObj: nameOfVariable} = object
136
What is the syntax for Array destructuring?
let / const keyword [varName1, varName2, etc] = array;
137
How can you tell the difference between destructuring and creating Object/Array literals?
creating - the name of the variable comes first
| destructuring - curly brace / square bracket comes first
138
What is the syntax for defining an arrow function?
(parameter) => {code block}
139
When an arrow function's body is left without curly braces, what changes in its functionality?
without curly braces, it can only be a single expression, with curly braces, it needs a return keyword
140
How is the value of this determined within an arrow function?
an arrow function doesn't have it's own this value and captures the this value of the lexical scope (the outer function)
141
What is the JavaScript Event Loop?
runtime model based on an event loop, which is responsible for executing the code, collecting and processing events, and executing queued sub-task
142
What is the difference between "blocking" and "non-blocking" with respect to how code is executed?
A blocking assignment takes effect immediately when it is processed.
Stuff that’s blocking is on the stack , nothing else can happen until it pops off the stack
A nonblocking assignment takes place at the end of processing the current "time delta" - can move on to another task, asynchronous
143
What is a client?
piece of computer hardware or software that accesses a service made available by a server as part of the client–server model of computer networks.
Server requesters
144
What is a server?
Service provider
| provides functionality for other programs or devices - clients
145
Which HTTP method does a browser issue to a web server when you visit a URL?
GET request
146
What is on the first line of an HTTP request message?
HTTP method, request target and HTTP version
147
What is on the first line of an HTTP response message?
The protocol version, status code and status text.
148
What are HTTP headers?
HTTP headers let the client and the server pass additional information with an HTTP request or response.
Metadata about request or response
149
Is a body required for a valid HTTP message?
no
150
What are the three states a Promise can be in?
pending
| fulfilled OR rejected
151
How do you handle the fulfillment of a Promise?
promise.then( )
152
How do you handle the rejection of a Promise?
then() and a final catch() statement
153
What is Array.prototype.filter useful for?
It's useful for getting just the values you need out of an array and ignoring the rest.
154
What is Array.prototype.map useful for?
Creating a new array containing the transformed elements of another.
useful for calling a function on every element of an array and assigning the results to a new array, without modifying the original.
155
What is Array.prototype.reduce useful for?
It's useful for calling a function on every element of an array and storing the combined result in a single output value
Combining elements of an array into a single value
156
What is "syntactic sugar"?
Designed to make things/language easier to read or to express
157
What is the typeof an ES6 class?
function
158
What is "refactoring"?
the process of changing a software system in such a way that it does not alter the function of the code yet improves its internal structure.
159
Describe ES6 class syntax.
```
Class declaration keyword, curly brace for the class body
Prototype methods
Closing curly brace for class body
```
