JavaScript Flashcards
(201 cards)
1
Q
What is the purpose of variables?
A
Let you store data in your program for later use or for modification
2
Q
How do you declare a variable?
A
var variableName;
3
Q
How do you initialize (assign a value to) a variable?
A
Equals sign
4
Q
What characters are allowed in variable names?
A
First character: Letter, _, $
Other characters: Letter, _, $, Number
5
Q
What does it mean to say that variable names are “case sensitive”?
A
Capital letters are different from lowercase letters
6
Q
What is the purpose of a string?
A
A literal representation of characters (holds letters)
7
Q
What is the purpose of a number?
A
Contains numerical data
8
Q
What is the purpose of a boolean?
A
True/false logic
9
Q
What does the = operator mean in JavaScript?
A
Assigns a value to a variable
10
Q
How do you update the value of a variable?
A
Equals sign without var
11
Q
What is the difference between null and undefined?
A
Undefined: the variable is declared but doesn’t have a value/hasn’t been assigned
Null indicates the variable has an empty or non-existent value, must be assigned
12
Q
Why is it a good habit to include “labels” when you log values to the browser console?
A
Makes it easier and clearer to keep track of your variables
13
Q
Give five examples of JavaScript primitives.
A
String, Number, Boolean, Null, Undefined
14
Q
What is string concatenation?
A
Combining strings into a new string
15
Q
What purpose(s) does the + plus operator serve in JavaScript?
A
Add numbers together or concatenate strings
16
Q
What data type is returned by comparing two values (, ===, etc)?
A
Boolean
17
Q
What does the += “plus-equals” operator do?
A
Adds the value on the right side to the variable and assigns the result to the variable
18
Q
What are objects used for?
A
Storing multiple values in a single collection
Consolidating like data and modeling real world objects
19
Q
What are object properties?
A
Essentially variables attached to an object
20
Q
Describe object literal notation.
A
Object name {property name: value…}
21
Q
How do you remove a property from an object?
A
Delete operator
22
Q
What are the two ways to get or update the value of a property?
A
Dot notation or bracket notation
23
Q
What are arrays used for?
A
Storing a list of values with a particular order
24
Q
Describe array literal notation.
A
var newArrayName = [];
25
How are arrays different from "plain" objects?
Arrays are organized into numeric lists
26
What number represents the first index of an array?
0
27
What is the length property of an array?
The number of values the array contains
28
How do you calculate the last index of an array?
The length of the array minus one
29
What is a function in JavaScript?
A code block that does a particular task and can be reused
30
Describe the parts of a function definition.
```
function functionName (parameter(s)names){
code block
}
```
31
Describe the parts of a function call.
functionName(parater(s)youWantToPass)
32
When comparing them side-by-side, what are the differences between a function call and a function definition?
Function definition is writing the code for the function
| Function call is telling the function and all of it’s to run in that instance
33
What is the difference between a parameter and an argument?
Parameter is the thing that gets passed within the function definition.
Argument is the thing that gets passed when the function is called.
34
Why are function parameters useful?
Allow us to give data to functions for functions to perform operations on them
35
What two effects does a return statement have on the behavior of a function?
Return statement determines the value the function returns
| It ends the execution of a function
36
Why do we log things to the console?
Helps to verify that our code is working as intended and to help debug
For development only
37
What is a method?
A function on an object
38
How is a method different from any other function?
A function is a set of instructions that perform a task and a method is a set of instructions that are associated with an object
39
How do you remove the last element from an array?
Pop()
40
How do you round a number down to the nearest integer?
Floor method of the math object
| Math.floor()
41
How do you generate a random number?
Random method of the math object
42
How do you delete an element from an array?
Splice
43
How do you append an element to an array?
Push method
44
How do you break a string up into an array?
Use the split method and pass in an empty space (‘ ‘)
45
Do string methods change the original string? How would you check if you weren't sure?
No. String are immutable
| Console log the strings.
46
Roughly how many string methods are there according to the MDN Web docs?
Around 50
47
Is the return value of a function or method useful in every situation?
Not always
48
Roughly how many array methods are there according to the MDN Web docs?
Around 30-40. (38)
49
What three-letter acronym should you always include in your Google search about a JavaScript method or CSS property?
MDN (the OFFICIAL source of truth)
50
Give 6 examples of comparison operators.
>,
51
What data type do comparison expressions evaluate to?
Boolean
52
What is the purpose of an if statement?
Make decisions, compare values, make branching logic
53
Is else required in order to use an if statement?
No
54
Describe the syntax (structure) of an if statement.
If (condition to check{
Code block
}
55
What are the three logical operators?
! (not), ||(or), &&(and)
56
How do you compare two different expressions in the same condition?
Using a logical operator
57
What is the purpose of a loop?
Lets you repeat code over and over
58
What is the purpose of a condition expression in a loop?
Check to see if the loop should run again
| Needs to eventually stop the loop
59
What does "iteration" mean in the context of loops?
One full pass/run of the code block inside of the loop
60
When does the condition expression of a while loop get evaluated?
Before each iteration
61
When does the initialization expression of a for loop get evaluated?
Before each iteration
62
When does the condition expression of a for loop get evaluated?
At the beginning of each subsequent iteration
63
When does the final expression of a for loop get evaluated?
The end of each loop iteration and before the next evaluation of condition.
64
Besides a return statement, which exits its entire function block, which keyword exits a loop before its condition expression evaluates to false?
Break
65
What does the ++ increment operator do?
Adds one to the variable
66
How do you iterate through the keys of an object?
For in loop
67
Give two examples of document methods that retrieve a single element from the DOM.
QuerySelector and GetElementById
68
Give one example of a document method that retrieves multiple elements from the DOM at once.
GetElementsByTagName
69
Why might you want to assign the return value of a DOM query to a variable?
So we don’t have to consciously query the dom
70
What console method allows you to inspect the properties of a DOM element object?
.dir
71
What does document.querySelector() take as its argument and what does it return?
Takes an element, id, class (any valid css selector)
| Returns the first instance of that selector
72
What does document.querySelectorAll() take as its argument and what does it return?
Take a css selectors
| Returns a NodeList
73
Why do we log things to the console?
To confirm the data as we write the code
74
What is the purpose of events and event handling?
Have code run based on when things happen
75
What method of element objects lets you set up a function to be called when a specific type of event occurs?
Add event listener
76
What is a callback function?
Any function that we do not call directly
77
What object is passed into an event listener callback when the event fires?
Event object
| It gets named event or e but technically can have any name
78
What is the event.target? If you weren't sure, how would you check? Where could you get more information about it?
Point of origin for the event
| Check MDN
79
What is the difference between these two snippets of code?
element. addEventListener('click', handleClick)
element. addEventListener('click', handleClick())
1st one just has a function for the handle click
| 2nd has a callback function for the handle click
80
What is the className property of element objects?
Class Attribute value
81
How do you update the CSS class attribute of an element using JavaScript?
Classname.property
82
What is the textContent property of element objects?
Represents the Content of the node and it’s descendants
83
How do you update the text within an element using JavaScript?
Query the dom and then use .textContent
84
Is the event parameter of an event listener callback always useful?
No, if the function doesn’t need the callback
85
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
86
Why is storing information about a program in variables better than only storing it in the DOM?
Calling dom over and over is taxing on the browser
| And we don’t want to rely on text content
87
What event is fired when a user places their cursor in a form control?
Focus
88
What event is fired when a user's cursor leaves a form control?
Blur
89
What event is fired as a user changes the value of a form control?
Input
90
What event is fired when a user clicks the "submit" button within a ?
Submit event
91
What does the event.preventDefault() method do?
Prevents the browser from automatically reloading with the submitted content
92
What does submitting a form without event.preventDefault() do?
The list events will remain on the html page
93
What property of a form element object contains all of the form's controls.
.elements
94
What property of form a control object gets and sets its value?
.value
95
What is one risk of writing a lot of code without checking to see if it works so far?
The errors can compound and it gets even harder to fix later
96
What is an advantage of having your console open when writing a JavaScript program?
To quickly see and test what you’re coding and find errors
97
Does the document.createElement() method insert a new element into the page?
No, it creates a new element, but doesn’t put it into the page
98
How do you add an element as a child to another element?
parentName.appendChild(childName)
99
What do you pass as the arguments to the element.setAttribute() method?
element.setAttribute(name, attribute)
100
What steps do you need to take in order to insert a new element into the page?
Use document.createElement(), specify the type of child element you want to make and assign it to a variable. Choose a parent element that the variable will be appended to. Use quereySelector and assign it to a variable. Then use .appendChild to append the child variable to the parent variable.
101
What is the textContent property of an element object for?
To get the text content an html element has
102
Name two ways to set the class attribute of a DOM element.
.className and .setAttribute
103
What are two advantages of defining a function to do create something (like the work of creating a DOM tree)?
Readability
| Repeat a process over and over
104
Give two examples of media features that you can query in an @media rule.
Width, resolution, hover, height
105
What is a method?
A function which is a property of an object
106
How can you tell the difference between a method definition and a method call?
Definitions include a code block and call is just the object dot method name.
107
Describe method definition syntax (structure).
Define a variable
Assign it with an object literal
Add properties with functions
108
Describe method call syntax (structure).
ObjectName.methodName()
109
How is a method different from any other function?
A method is part of an object
110
What is the defining characteristic of Object-Oriented Programming?
Creating objects that both store data and functionality.
111
What are the four "principles" of Object-Oriented Programming?
Abstraction, encapsulation, inheritance, polymorphism
112
What is "abstraction"?
Simplifying complex concepts/ideas
| Hiding complex functionality behind simple functionality
113
What does API stand for?
Application Programming Interface
114
What is the purpose of an API?
Allows users to use abstraction of software
| To share functionality of an application to other users
115
What is this in JavaScript?
An implicit parameter that refers to the object that exists at call time
116
What does it mean to say that this is an "implicit parameter"?
A parameter that is available in a function’s code block even though it was never explicitly declared
117
When is the value of this determined in a function; call time or definition time?
Call time
118
```
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);
}
};
```
Character object
119
```
Given the above character object, what is the result of the following code snippet? Why?
var hello = character.greet;
hello();
```
It’s a me undefined
| because it’s referring to the window object and the window object doesn’t have a firstName property
120
How can you tell what the value of this will be for a particular function or method definition?
The object containing this
121
How can you tell what the value of this is for a particular function or method call?
Left of the dot at the method call.
122
What kind of inheritance does the JavaScript programming language use?
Prototypal inheritance
123
What is a prototype in JavaScript?
An object that contains properties and methods that can be used by other objects.
124
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?
The prototype has the methods and the strings and arrays can use the methods
125
If an object does not have it's own property or method by a given key, where does JavaScript look for it?
The prototype chain
126
What does the new operator do?
1. Creates a new blank JS object
2. Adds a property of _proto_ to it
3. All the passed in parameters are bound to the new object with the this keyword
4. Returns the object
127
What property of JavaScript functions can store shared behavior for instances created with new?
Inheritance
128
What does the instanceof operator do?
Checks if the passed in created object comes from the passed in constructor
129
What is a "callback" function?
A function that is passed to another function as an argument
130
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?
setTimeout
131
How can you set up a function to be called repeatedly without using a loop?
setInterval
132
What is the default time delay if you omit the delay parameter from setTimeout() or setInterval()?
0 seconds
133
What do setTimeout() and setInterval() return?
timeoutId
134
What is a client?
The one that makes the request to get info/services from a server
135
What is a server?
Wait for requests to come in and answer requests/provide services
136
Which HTTP method does a browser issue to a web server when you visit a URL?
GET request
137
What three things are on the start-line of an HTTP request message?
Method, request type, version that is coming in
138
What three things are on the start-line of an HTTP response message?
Protocol version, status code, text
139
What are HTTP headers?
Let’s you pass additional information related to the request
140
Where would you go if you wanted to learn more about a specific HTTP Header?
MDN documentation
141
Is a body required for a valid HTTP request or response message?
No
142
What is AJAX?
JQuerey libaray that lets you make asynchronous HTTP requests to make a scynchronous functionality for your webpages
143
What does the AJAX acronym stand for?
Asynchonous Javascript and XML
144
Which object is built into the browser for making HTTP requests in JavaScript?
XHR
145
What event is fired by XMLHttpRequest objects when they are finished loading the data from the server?
Load event
146
Bonus Question: An XMLHttpRequest object has an addEventListener() method just like DOM elements. How is it possible that they both share this functionality?
By using Prototype
147
What is a code block? What are some examples of a code block?
A local scope of code, where variables declared inside only can work inside (anything inside curly braces
If statements, while loops
148
What does block scope mean?
Whatever is defined inside of the block, only exists inside of the block
149
What is the scope of a variable declared with const or let?
Block-scoped
150
What is the difference between let and const?
Let can be reassigned a value but const is immutable and cannot be changed
151
Why is it possible to .push() a new value into a const variable that points to an Array?
The memory address of the array is the same, changing the array values, doesn’t alter this
152
How should you decide on which type of declaration to use?
If you’re gonna have a changing variable, use let, otherwise const (default to const)
153
What is destructuring, conceptually?
A way to create variables from object properties or indexes in the array immediately in one line
154
What is the syntax for Object destructuring?
Const {propertyVariable} = objectName;
155
What is the syntax for Array destructuring?
Const [indexVariable] = arrayName;
156
How can you tell the difference between destructuring and creating Object/Array literals?
{} on the right of the = is creating
| {} on the left of the = is destructuring
157
What is the syntax for writing a template literal?
Back tick, string content, ${variableName}, back tick
158
What is "string interpolation"?
When you can directly bring the value of a variable into a string
159
What is the syntax for defining an arrow function?
Parameter(s) => arguments
160
When an arrow function's body is left without curly braces, what changes in its functionality?
It has an implicit return statement
| Having curly brackets makes it work like a standard function block
161
How is the value of this determined within an arrow function?
They treat this as it is when it is defined
162
What kind of inheritance does the JavaScript programming language use?
Prototypal inheritance
163
What is a prototype in JavaScript?
An object that contains properties and methods that can be used by other objects.
164
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?
The prototype has the methods and the strings and arrays can use the methods
165
If an object does not have it's own property or method by a given key, where does JavaScript look for it?
The prototype chain
166
What does the new operator do?
1. Creates a new blank JS object
2. Adds a property of _proto_ to it
3. All the passed in parameters are bound to the new object with the this keyword
4. Returns the object
167
What property of JavaScript functions can store shared behavior for instances created with new?
Inheritance
168
What does the instanceof operator do?
Checks if the passed in created object comes from the passed in constructor
169
What is a "callback" function?
A function that is passed to another function as an argument
170
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?
setTimeout
171
How can you set up a function to be called repeatedly without using a loop?
setInterval
172
What is the default time delay if you omit the delay parameter from setTimeout() or setInterval()?
0 seconds
173
What do setTimeout() and setInterval() return?
timeoutId
174
What is a client?
The one that makes the request to get info/services from a server
175
What is a server?
Wait for requests to come in and answer requests/provide services
176
Which HTTP method does a browser issue to a web server when you visit a URL?
GET request
177
What three things are on the start-line of an HTTP request message?
Method, request type, version that is coming in
178
What three things are on the start-line of an HTTP response message?
Protocol version, status code, text
179
What are HTTP headers?
Let’s you pass additional information related to the request
180
Where would you go if you wanted to learn more about a specific HTTP Header?
MDN documentation
181
Is a body required for a valid HTTP request or response message?
No
182
What is AJAX?
JQuerey libaray that lets you make asynchronous HTTP requests to make asynchronous functionality for your webpages
183
What does the AJAX acronym stand for?
Asynchonous Javascript and XML
184
Which object is built into the browser for making HTTP requests in JavaScript?
XHR
185
What event is fired by XMLHttpRequest objects when they are finished loading the data from the server?
Load event
186
Bonus Question: An XMLHttpRequest object has an addEventListener() method just like DOM elements. How is it possible that they both share this functionality?
By using Prototype
187
What is a code block? What are some examples of a code block?
A local scope of code, where variables declared inside only can work inside (anything inside curly braces
If statements, while loops
188
What does block scope mean?
Whatever is defined inside of the block, only exists inside of the block
189
What is the scope of a variable declared with const or let?
Block-scoped
190
What is the difference between let and const?
Let can be reassigned a value but const is immutable and cannot be changed
191
Why is it possible to .push() a new value into a const variable that points to an Array?
The memory address of the array is the same, changing the array values, doesn’t alter this
192
How should you decide on which type of declaration to use?
If you’re gonna have a changing variable, use let, otherwise const (default to const)
193
What is destructuring, conceptually?
A way to create variables from object properties or indexes in the array immediately in one line
194
What is the syntax for Object destructuring?
Const {propertyVariable} = objectName;
195
What is the syntax for Array destructuring?
Const [indexVariable] = arrayName;
196
How can you tell the difference between destructuring and creating Object/Array literals?
{} on the right of the = is creating
| {} on the left of the = is destructuring
197
What is the syntax for writing a template literal?
Back tick, string content, ${variableName}, back tick
198
What is "string interpolation"?
When you can directly bring the value of a variable into a string
199
What is the syntax for defining an arrow function?
Parameter(s) => arguments
200
When an arrow function's body is left without curly braces, what changes in its functionality?
It has an implicit return statement
| Having curly brackets makes it work like a standard function block
201
How is the value of this determined within an arrow function?
They treat this as it is when it is defined
