JavaScript Flashcards
1
Q
What is the purpose of variables?
A
variables give us permanents (store data to use later)
2
Q
How do you declare a variable?
A
type the keyword var, let, const
3
Q
How do you initialize (assign a value to) a variable?
A
use a single =
4
Q
What characters are allowed in variable names?
A
letter, dollar sign, underscore, and numbers
5
Q
What does it mean to say that variable names are “case sensitive”?
A
lowercase & uppercase matters in JS
6
Q
What is the purpose of a string?
A
characters (store texts)
7
Q
What is the purpose of a number?
A
calculations, any math related value
8
Q
What is the purpose of a boolean?
A
potential to have logic (binary statement)
9
Q
What does the = operator mean in JavaScript?
A
assignment operator (to put a value)
10
Q
How do you update the value of a variable?
A
only write the variable name (without rewriting var)
11
Q
What is the difference between null and undefined?
A
null is an assigned value. (made to be empty on purpose)
undefined means a variable has been declared but not defined yet.
12
Q
Why is it a good habit to include “labels” when you log values to the browser console?
A
makes it easier to debug
13
Q
Give five examples of JavaScript primitives.
A
string, number, boolean, null, undefined, objects
14
Q
What data type is returned by an arithmetic operation?
A
number
15
Q
What is string concatenation?
A
addition for strings
16
Q
What purpose(s) does the + plus operator serve in JavaScript?
A
add values or concatenate strings
17
Q
What data type is returned by comparing two values (, ===, etc)?
A
boolean
18
Q
What does the += “plus-equals” operator do?
A
allows you to add numbers or strings to an existing variable
19
Q
What are objects used for?
A
grouping of data
20
Q
What are object properties?
A
variables within a certain boundaries
21
Q
Describe object literal notation.
A
variable = {
property: value }
22
Q
How do you remove a property from an object?
A
delete operator
23
Q
What are the two ways to get or update the value of a property?
A
dot notation, bracket notation
24
Q
What are arrays used for?
A
store set of orders
25
Describe array literal notation.
[ set of values stored, separated by comma ]
26
How are arrays different from "plain" objects?
they have orders, square brackets, not individually named
27
What number represents the first index of an array?
0
28
What is the length property of an array?
total number of items inside an array
29
How do you calculate the last index of an array?
subtract one from length
30
What is a function in JavaScript?
reusable statement for tasks
31
Describe the parts of a function definition.
parameter, function keyword, function code block
32
Describe the parts of a function call.
name of the function, parenthesis, and arguments
33
When comparing them side-by-side, what are the differences between a function call and a function definition?
definitions: keyword, code block, parameters
call: arguments
34
What is the difference between a parameter and an argument?
parameter: placeholder for argument
argument: actual value for function to be called
35
Why are function parameters useful?
without it, the function's end result is always the same
36
What two effects does a return statement have on the behavior of a function?
1. exits the code block
| 2. gives a value
37
Why do we log things to the console?
debugging tool
38
What is a method?
methods are functions stored into the property of an object.
39
How is a method different from any other function?
stored into the property of an object.
40
How do you remove the last element from an array?
pop method
41
How do you round a number down to the nearest integer?
math.floor
42
How do you generate a random number?
math.random
43
How do you delete an element from an array?
splice method
44
How do you append an element to an array?
push method
45
How do you break a string up into an array?
split method
46
Do string methods change the original string? How would you check if you weren't sure?
they do not change the original. Check by using console.log()
47
Is the return value of a function or method useful in every situation?
no
48
Roughly how many array methods are there according to the MDN Web docs?
25
49
What three-letter acronym should you always include in your Google search about a JavaScript method or CSS property?
MDN
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?
add conditions to the code
53
Is else required in order to use an if statement?
no
54
Describe the syntax (structure) of an if statement.
if, condition, {}
55
What are the three logical operators?
and, or, not
56
How do you compare two different expressions in the same condition?
use logical and or logical or
57
What is the purpose of a loop?
to perform repeated task
58
What is the purpose of a condition expression in a loop?
if it s true, it continues, if it s false, it stops
59
What does "iteration" mean in the context of loops?
one repetition of the code block loop
60
When does the condition expression of a while loop get evaluated?
before the code block runs
61
When does the initialization expression of a for loop get evaluated?
very beginning (before anything)
62
When does the condition expression of a for loop get evaluated?
before each iteration
63
When does the final expression of a for loop get evaluated?
after each iteration
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?
increments variable by 1
66
How do you iterate through the keys of an object?
use a for in loop
67
Why do we log things to the console?
to check if the code is working, to make debugging easier
68
What is a "model"?
representation of something
69
Which "document" is being referred to in the phrase Document Object Model?
HTML doc
70
What is the word "object" referring to in the phrase Document Object Model?
data type in javascript
71
What is a DOM Tree?
model of the page when a browser loads a web page.
72
Give two examples of document methods that retrieve a single element from the DOM.
document.getElementById(), document.querySelector()
73
Give one example of a document method that retrieves multiple elements from the DOM at once.
document.querySelectorAll()
74
Why might you want to assign the return value of a DOM query to a variable?
if you want to access it multiple times
75
What console method allows you to inspect the properties of a DOM element object?
dir method
| directory
76
Why would a tag need to be placed at the bottom of the HTML content instead of at the top?
so that it runs after all the information on HTML document
77
What does document.querySelector() take as its argument and what does it return?
css selector as an argument (String)
| first element in HTML doc that matches
78
What does document.querySelectorAll() take as its argument and what does it return?
css selector as argument
| returns nodelist
79
Why do we log things to the console?
To check the process and values. Verifying if something actually happened.
80
What is the purpose of events and event handling?
event handling = creating code the handle the event
| event = things that happen
81
Are all possible parameters required to use a JavaScript method or function?
No.
82
What method of element objects lets you set up a function to be called when a specific type of event occurs?
addEventListener
83
What is a callback function?
function definition being passed in as an argument
84
What object is passed into an event listener callback when the event fires?
Event object
85
What is the event.target? If you weren't sure, how would you check? Where could you get more information about it?
property on event object whose value is whatever element that event originated at.
86
What is the difference between these two snippets of code?
element. addEventListener('click', handleClick)
element. addEventListener('click', handleClick())
top: handleClick is being referenced
bottom: handleClick is being called (never use)
87
What is the className property of element objects?
gets and sets the value of the class attribute of the specified element.
88
How do you update the CSS class attribute of an element using JavaScript?
use queryselector and class name property
89
What is the textContent property of element objects?
get the value of the current text element and update
90
How do you update the text within an element using JavaScript?
queryselect the element and get whatever the new value is and assign it to textcontent property
91
Is the event parameter of an event listener callback always useful?
no
92
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
93
Why is storing information about a program in variables better than only storing it in the DOM?
it makes it easier to make sense.
94
What event is fired when a user places their cursor in a form control?
focus event
95
What event is fired when a user's cursor leaves a form control?
blur event
96
What event is fired as a user changes the value of a form control?
input event
97
What event is fired when a user clicks the "submit" button within a form?
submit event
98
What does the event.preventDefault() method do?
Prevents default behavior
99
What does submitting a form without event.preventDefault() do?
reloads/refreshes the page
100
What property of a form element object contains all of the form's controls.
elements property
101
What property of a form control object gets and sets its value?
value property
102
What is one risk of writing a lot of code without checking to see if it works so far?
hard to see where the code went wrong
103
What is an advantage of having your console open when writing a JavaScript program?
to see if your code is working, check variable values, etc.
104
Does the document.createElement() method insert a new element into the page?
no, it just makes them. does not inset until appendchild method is used.
105
How do you add an element as a child to another element?
appendchild method or append method
106
What do you pass as the arguments to the element.setAttribute( ) method?
name and value
107
What steps do you need to take in order to insert a new element into the page?
createElement and appendChild()
108
What is the textContent property of an element object for?
To get text content or to set the text content of an element
109
Name two ways to set the class attribute of a DOM element.
Element.setAttribute( )
| Element.className
110
What are two advantages of defining a function to do create something (like the work of creating a DOM tree)?
Defining a function allows for reusability so you don't have to write the function over and over. Defined functions are also easy to test.
111
What is the event.target?
Object that the event is working on
112
Why is it possible to listen for events on one element that actually happen its descendent elements?
event bubbles all the way up to the parent element (the document and then the window).
113
What DOM element property tells you what type of element it is?
The tagName property
114
What does the element.closest() method take as its argument and what does it return?
It takes in a css selector as an argument and returns the closest parent
115
How can you remove an element from the DOM?
remove( ) method
116
If you wanted to insert new clickable DOM elements into the page using JavaScript, how could you avoid adding an event listener to every new element individually?
Add the event listener to parent
117
What is the event.target?
property on event object whose value is whatever element that event originated at.
118
What is the affect of setting an element to display: none?
The element won’t be displayed because it won’t get rendered. The document will treat it as if it didn't exist along with child elements.
119
What does the element.matches() method take as an argument and what does it return?
Takes a css selector as a string for an argument and returns a Boolean value
120
How can you retrieve the value of an element's attribute?
getAttributes( ) method
121
At what steps of the solution would it be helpful to log things to the console?
Anytime you want to verify a value or to verify if the code is working correctly.
122
If you were to add another tab and view to your HTML, but you didn't use event delegation, how would your JavaScript code be written instead?
The code would have to have multiple conditions for each tab.
(event handler for every single tab)
123
If you didn't use a loop to conditionally show or hide the views in the page, how would your JavaScript code be written instead?
It would be written by adding new event listener and possibly new event handler function for each tab.
124
What is JSON?
JavaScript Object Notation (JSON) is a standard text-based format for representing structured data based on JavaScript object syntax.
125
What are serialization and deserialization?
Serialization: converting complex data (like an object) to string
Deserialization: converting string to object
126
Why are serialization and deserialization useful?
Serialization allows from data to be stored in memory. Also makes it easier to transfer data across a network.
Deserialization makes it so that data is easier to interact with.
127
How do you serialize a data structure into a JSON string using JavaScript?
JSON.stringify( )
128
How do you deserialize a JSON string into a data structure using JavaScript?
JSON.parse( )
129
How to you store data in localStorage?
localStorage.setItem( ) method
130
How to you retrieve data from localStorage?
localStorage.getItem( ) method
131
What data type can localStorage save in the browser?
‘String’ type data (local storage needs serialized data )
132
When does the 'beforeunload' event fire on the window object?
Before the page unloads
133
What is a method?
A method is a function that is a property of an object.
134
How can you tell the difference between a method definition and a method call?
A method definition would have the keyword function and { } for the function code block.
A method call would have the object followed by dot notation, name of method and then ( ).
135
Describe method definition syntax (structure).
{ property: function methodName ( [optional parameters] ) {code block }, }
136
Describe method call syntax (structure).
object.methodName( )
137
How is a method different from any other function?
Needs dot notation or bracket notation. Also a method belongs to an object as a property of the object.
138
What is the defining characteristic of Object-Oriented Programming?
Objects can contain BOTH data (as properties) and behavior (as methods)
139
What are the four "principles" of Object-Oriented Programming?
Abstraction, encapsulation, inheritance , polymorphism
140
What is "abstraction"?
It is a process that enables a user to work with (possibly) complex things in simply ways.
141
What does API stand for?
Application Programming Interface
142
What is the purpose of an API?
Selection of tools (set of code features such as methods, properties, events, and URLS) to make it easier for developers to interact with a software.
143
What is this in JavaScript?
‘this’ is an implicit parameter of all JavaScript functions.
144
What does it mean to say that this is an "implicit parameter"?
It is available in a function’s code block even though it was never included in the function’s parameters list or declared with ‘var’.
145
When is the value of this determined in a function; call time or definition time?
call time
146
```
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. The value of 'this' can only be determined during call time (not during a function definition).
147
Given the above character object, what is the result of the following code snippet? Why?
character.greet();
Result = “It’s-a-me, Mario!” because ‘this’ refers to the object being called. The object firstName property has the value of Mario.
148
```
Given the above character object, what is the result of the following code snippet? Why?
var hello = character.greet;
hello();
```
Result = “It’s-a-me, undefined!” because 'this' refers to the window (hello is not a property of an object, therefore default object would be the window object). Window object does not have the property firstName so therefore, 'this.firstName" has the value of undefined.
149
How can you tell what the value of this will be for a particular function or method definition?
You can’t. Value of ‘this’ is determined at call time.
150
How can you tell what the value of this is for a particular function or method call?
By looking to the left of the dot (the object).
151
What kind of inheritance does the JavaScript programming language use?
prototype-based (or prototypal) inheritance
152
What is a prototype in JavaScript?
move properties and methods that we'd like to reuse into a "prototype" object and then tell other objects to simply delegate (verb) to that "prototype" object when they aren't able to perform the required tasks themselves.
153
How is it possible to call methods on strings, arrays, and numbers even though those methods don't actually exist on strings, arrays, and numbers?
Due to JS prototypes; models that was created that contain these methods.
154
If an object does not have it's own property or method by a given key, where does JavaScript look for it?
From the object’s prototype, if it's not there then object’s object’s prototype
155
What does the new operator do?
Creates a blank, plain JavaScript object
Links (sets the constructor of) the newly created object to another object by setting the other object as its parent prototype;
Passes the newly created object from Step 1 as the this context;
Returns this if the function doesn't return an object.
156
What property of JavaScript functions can store shared behavior for instances created with new?
Prototype property
157
What does the instanceof operator do?
It tests to see if the prototype property of a constructor appears anywhere in the prototype chain of an object. Returns a boolean.
158
What is a "callback" function?
It is a function passed in through another function as an argument
159
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() function
160
How can you set up a function to be called repeatedly without using a loop?
setInterval() function
161
What is the default time delay if you omit the delay parameter from setTimeout() or setInterval()?
0
162
What do setTimeout() and setInterval() return?
setTimeout( ): The returned timeoutID is a positive integer value which identifies the timer created by the call to setTimeout( )
setInterval( ): The returned intervalID is a numeric, non-zero value which identifies the timer created by the call to setInterval( )
163
What is AJAX?
Is a technique for loading data into part of a page without having to refresh the entire page.
164
What does the AJAX acronym stand for?
Asynchronous JavaScript And XML
165
Which object is built into the browser for making HTTP requests in JavaScript?
XMLHttpRequest
166
What event is fired by XMLHttpRequest objects when they are finished loading the data from the server?
load event
167
An XMLHttpRequest object has an addEventListener() method just like DOM elements. How is it possible that they both share this functionality?
They share a prototype. Both are chained to the EventTarget Prototype
168
What is a code block? What are some examples of a code block?
A block of code within curly braces { };
| Examples: if else, for, do while, while; function code block;
169
What does block scope mean?
An area within the block where variables can be referenced
170
What is the scope of a variable declared with const or let?
```
Let = block-scoped;
Const = block-scoped
```
171
What is the difference between let and const?
Const can’t be reassigned while let can. Both cannot be redeclared.
172
Why is it possible to .push() a new value into a const variable that points to an Array?
The value within the array is mutable
173
How should you decide on which type of declaration to use?
If the variable is not going to be reassigned, use ‘const’. If it will be reassigned, then use ‘let’
174
What is the syntax for writing a template literal?
Template literals use `backticks` rather than single or double quotes and the javascript expression is as follows: ${variable}
175
What is "string interpolation"?
A process where variables and expressions is embedded in a string. The variable/expression has to be placed in a space block as follows:
${variable_name}
176
What is destructuring, conceptually?
Taking the values within the object and assign it to a variable
177
What is the syntax for Object destructuring?
let {
property1: variable1,
property2: variable2
} = object;
178
What is the syntax for Array destructuring?
let [index1, index 2] = array
179
How can you tell the difference between destructuring and creating Object/Array literals?
Destructuring: variable name goes on the right of the assign operator ( let/const { } or [ ] = variable )
Creating: variable name goes on the left of the assign operator ( variable = { } or [ ])
180
What is the syntax for defining an arrow function?
(parameters separated by commas) => { code block };
If there is only 1 parameter, the parentheses are not needed. If return is a simple expression, brackets and return keyword can be omitted. Brackets and return keyword are needed for code block if it's multiline statements.
181
When an arrow function's body is left without curly braces, what changes in its functionality?
Body becomes a return.
182
How is the value of this determined within an arrow function?
Arrow functions: value of `this` is determined at definition time
Regular functions: value of `this` is determined at call time
183
What is the JavaScript Event Loop?
The Event Loop is a queue of callback functions. Takes the first thing on the callback queue and puts it back on the stack if the stack is empty
184
What is different between "blocking" and "non-blocking" with respect to how code is executed?
Blocking is when the execution of additional JavaScript in the Node.js process must wait until a non-JavaScript operation completes.
Non-blocking methods execute asynchronously.
185
How do you mount a middleware with an Express application?
By app.use()
186
Which objects does an Express application pass to your middleware to manage the request/response lifecycle of the server?
Request object, response object
187
What are the three states a Promise can be in?
* pending: initial state, neither fulfilled nor rejected.
* fulfilled: meaning that the operation was completed successfully.
* rejected: meaning that the operation failed.
188
How do you handle the fulfillment of a Promise?
Use then( ) method
189
How do you handle the rejection of a Promise?
Use then( ) method or catch( ) method
190
What is Array.prototype.filter useful for?
The filter() method creates a new array with all elements that pass the test implemented by the provided function.
191
What is "syntactic sugar"?
Is syntax within a programming language that is designed to make things easier to read or to express.
It makes the language "sweeter" for human use: things can be expressed more clearly, more concisely, or in an alternative style that some may prefer.
192
What is the typeof an 'ES6 class'?
function
193
Describe ES6 class syntax.
```
Class keyword followed by curly braces for the class declaration
constructor (parameter)
```
194
What is "refactoring"?
Code refactoring is the process of restructuring existing computer code—changing the factoring—without changing its external behavior; preserve functionality
195
How are ES Modules different from CommonJS modules?
ES modules are the standard for JavaScript, while CommonJS is the default in Node. js.
196
What does fetch() return?
returns a promise containing the response (a Response object).
197
What is the default request method used by fetch()?
GET
198
How do you specify the request method (GET, POST, etc.) when calling fetch?
use method:
