Javascript Flashcards
1
Q
What is the purpose of a variable?
A
to provide a place to store data to access
in the future
2
Q
How do you declare a variable?
A
var variable = value
3
Q
How do you initialize (assign a value to) a variable?
A
by using =, with variable on left side and value on right
4
Q
What characters are allowed in variable names?
A
letters, dollar sign, underscore, numbers(but cannot start with number)
5
Q
What does it mean to say that variable names are “case sensitive”?
A
that uppercase and lowercase are entirely separate entities
6
Q
What is the purpose of a string?
A
to store non-numerical values + data
7
Q
What is the purpose of a number?
A
to store mathematical operations + numerics
8
Q
What is the purpose of a boolean?
A
to store the true/false values and make decisions
9
Q
What does the = operator mean in JavaScript?
A
to assign
10
Q
How do you update the value of a variable?
A
by changing value after the = sign
11
Q
What is the difference between null and undefined?
A
null = purposefully put by human programmer undefined = organic javascript
12
Q
Why is it a good habit to include “labels” when you log values to the browser console?
A
to make it easier to debug
ALWAYS label
13
Q
Give five examples of JavaScript primitives.
A
string, number, boolean, null, undefined
14
Q
What data type is returned by an arithmetic operation?
A
numeric
15
Q
What is string concatenation?
A
combining two string using concatenation operator (+)
16
Q
What purpose(s) does the + (plus) operator serve in JavaScript?
A
- to concatenate
2. to add
17
Q
What data type is returned by comparing two values (, ===, etc)?
A
boolean
18
Q
What does the += “plus-equals” operator do?
A
takes current value of variable and adds new value to variable and returns value of it
19
Q
What are objects used for?
A
useful for storing multiple pieces of data that are related to each other
20
Q
What are object properties?
A
names of the related pieces of objects
21
Q
Describe object literal notation.
A
a set of curly braces, with keys and values within them
22
Q
How do you remove a property from an object?
A
the delete operator
23
Q
What are the two ways to get or update the value of a property?
A
dot notation and square bracket notation
ALWAYS use dot notation
24
Q
What are arrays used for?
A
making lists of related data of the same type
25
Describe array literal notation
brackets [ } with commas separating values
26
How are arrays different from "plain" objects?
Arrays have numbered indexes,
| objects have alpha numerical indexes
27
What number represents the first index of an array?
0
28
What is the length property of an array?
how long the array is /
| how many pieces of data are in it
29
How do you calculate the last index of an array?
the length property of an array - 1
30
What is a function in JavaScript?
an expression that gives repeatability to a code block
31
Describe the parts of a function definition.
function keyword, optional name, parameters, function code block, optional return statement
32
Describe the parts of a function call.
function name, parenthesis, data in parenthesis
33
When comparing them side-by-side, what are the differences between a function call and a function definition?
function call = no keyword, and no code block
34
What is the difference between a parameter and an argument?
parameters exist when defining a function,
| arguments happen when calling a function
35
Why are function parameters useful?
they provide re-usability
36
What two effects does a return statement have on the behavior of a function?
1. It stops the function
| 2. spits out the return value of the function
37
Why do we log things to the console?
to spit out the current value of things
38
What is a method?
a function stored as a property on an object
39
How is a method different from any other function?
methods always need dot (.) before they're called,
| functions can be called by themselves
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() method
42
How do you generate a random number?
.math.random() method
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?
No, and you can check with console log/MDN
47
Roughly how many string methods are there according to the MDN Web docs?
Around fifty, A lot
48
Is the return value of a function or method useful in every situation?
Not always
49
Roughly how many array methods are there according to the MDN Web docs?
A lot
50
What three-letter acronym should you always include in your Google search about a JavaScript method or CSS property?
MDN
51
Give 6 examples of comparison operators.
strictly equal, less than or equal to, more than, more than or equal to, not equal
52
What data type do comparison expressions evaluate to?
boolean true/false
53
What is the purpose of an if statement?
let functions make decisions based on conditions
54
Is else required in order to use an if statement?
No
55
Describe the syntax (structure) of an if statement.
keyword if, condition in parenthesis, conditional code block
56
What are the three logical operators?
&& - and
|| - or
! - not
57
How do you compare two different expressions in the same condition?
using && - and or || - or
58
What is the purpose of a loop?
to keep repeating a chunk of code until a certain condition is met
59
What is the purpose of a condition expression in a loop?
to help stop the loop
60
What does "iteration" mean in the context of loops?
each time the code block runs
61
When does the condition expression of a while loop get evaluated?
before each iteration
62
When does the initialization expression of a for loop get evaluated?
in the beginning, once
63
When does the condition expression of a for loop get evaluated?
after the final expression, and right before the code block
64
When does the final expression of a for loop get evaluated?
right after each iteration
65
Besides a return statement, which exits its entire function block, which keyword exits a loop before its condition expression evaluates to false?
break statement
66
What does the ++ increment operator do?
adds one to whatever the value is
67
How do you iterate through the keys of an object?
for ..in loops
68
Why do we log things to the console?
To inspect their value and make sure it’s up to par
69
What is a "model"?
A representation of something
70
Which "document" is being referred to in the phrase Document Object Model?
The HTML document
71
What is the word "object" referring to in the phrase Document Object Model?
An object model of the HTML document
72
What is a DOM tree?
A JavaScript object for an HTML element that holds all of its children and children’s contents, values, text content and attributes
73
Give two examples of document methods that retrieve a single element from the DOM.
GetElementByID, querySelector
74
Give one example of a document method that retrieves multiple elements from the DOM at once.
QuerySelectorALL
75
Why might you want to assign the return value of a DOM query to a variable?
To go back and adjust it later
76
What console method allows you to inspect the properties of a DOM element object?
Console.dir
77
Why would a tag need to be placed at the bottom of the HTML content instead of at the top?
The HTML needs to load before the script
78
What does document.querySelector() take as its argument and what does it return?
Returns the first element it finds and takes css selectors as arguments as strings
79
What does document.querySelectorAll() take as its argument and what does it return?
Arguments = string of css selector
Returns node list (array type of data)
80
Why do we log things to the console?
To check if the right value is returned
81
What is the purpose of events and event handling?
To create a reaction in response to something happening
82
Are all possible parameters required to use a JavaScript method or function?
No
83
What method of element objects lets you set up a function to be called when a specific type of event occurs?
AddEventListener
84
What is a callback function?
A function definition being passed to another function as a value
85
What object is passed into an event listener callback when the event fires?
An object with a huge amount of properties with data explaining event
86
What is the event.target? If you weren't sure, how would you check? Where could you get more information about it?
Where the event EXACTLY occurs, more information available through console.log
87
What is the difference between these two snippets of code?
element. addEventListener('click', handleClick)
element. addEventListener('click', handleClick())
One of the functions is being called and returns the return
The other one uses function DEFINITION
88
What is the className property of element objects?
a property stored on a DOM Element object that stores the class attributes of that object
89
How do you update the CSS class attribute of an element using JavaScript?
the className property with a value assigned to it
90
What is the textContent property of element objects?
allows to set or update text content of HTML element
91
How do you update the text within an element using JavaScript?
using .textContent and new string in parenthesis
92
Is the event parameter of an event listener callback always useful?
No
93
Would a DOM assignment be simpler or more complicated if a variable wasn't used to keep track of the number of clicks?
would be simpler with variable
94
Why is storing information about a program in variables better than only storing it in the DOM?
so that you can use it later and to not mix languages with each other
95
What event is fired when a user places their cursor in a form control?
“Focus”
96
What event is fired when a user's cursor leaves a form control?
“Blur”
97
What event is fired as a user changes the value of a form control?
“Input”
98
What event is fired when a user clicks the "submit" button within a ?
“Submit”
99
What does the event.preventDefault() method do?
Prevents default browser behavior for the element for that event
100
What does submitting a form without event.preventDefault() do?
It Acts as it normally would
101
What property of a form element object contains all of the form's controls.
The .elements property
102
What property of a form control object gets and sets its value?
The value property
103
What is one risk of writing a lot of code without checking to see if it works so far?
If it doesn’t work, you don’t know where it’s broken
104
What is an advantage of having your console open when writing a JavaScript program?
So you know what goes right, wrong and in general so you know what goes on
105
Does the document.createElement() method insert a new element into the page?
No, it just creates one
106
How do you add an element as a child to another element?
.appendChild
107
What do you pass as the arguments to the element.setAttribute() method?
First string with the name of attribute, then second string as the value of the attribute
108
What steps do you need to take in order to insert a new element into the page?
.CreateElement method and append method on another element
109
What is the textContent property of an element object for?
It stores the text content of an HTML element to make new, or retrieve
110
Name two ways to set the class attribute of a DOM element.
className property and setAttribute method
111
What are two advantages of defining a function to do create something (like the work of creating a DOM tree)?
Easier to test, and easier to re-use
112
What is the event.target?
The element where the event occurred
113
Why is it possible to listen for events on one element that actually happen its descendent elements?
Event bubbling
114
What DOM element property tells you what type of element it is?
tagName
115
What does the element.closest() method take as its argument and what does it return?
Takes a CSS selector string as an argument, and returns the ancestor of the element being called
116
How can you remove an element from the DOM?
.remove() method
117
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 an eventListener to the parent
118
What is the event.target?
The element on which the event took place
119
What is the affect of setting an element to display: none?
It hides and removes the element from the document flow completely, yielding it’s space to visible elements
120
What does the element.matches() method take as an argument and what does it return?
$element.matches() takes a string containing a CSS selector as its argument and returns a Boolean indicating whether or not it matched the selector
121
How can you retrieve the value of an element's attribute?
$element.getAttribute(‘attribute name’)
122
At what steps of the solution would it be helpful to log things to the console?
Every step!
123
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?
You would have to add an event listener to each of the tab elements individually
124
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?
You would have to write out the code to hide and reveal views based on the condition of which tab was clicked
125
What is JSON?
JSON is a format for converting JavaScript objects into strings of text.
126
What are serialization and deserialization?
Serialization is the process of converting an object in memory into a stream of bytes.
Deserialization is converting the bytes to an object in memory
127
Why are serialization and deserialization useful?
They’re useful for transmitting JavaScript objects and the data they contain to other platforms that may not support JavaScript, but can read JSON strings.
128
How do you serialize a data structure into a JSON string using JavaScript?
JSON.stringify(object)
129
How do you deserialize a JSON string into a data structure using JavaScript?
JSON.parse(JSONstring)
130
How do you store data in localStorage?
localStorage.setItem(‘name’, ‘value’)
131
How do you retrieve data from localStorage?
localStorage.getItem(‘name’)
132
What data type can localStorage save in the browser?
Strings. Other data types are converted to Strings, and Objects must be stringified first.
133
When does the 'beforeunload' event fire on the window object?
Before the page get unloaded
ie:
closed, refreshed, or clicked away from
134
What is a method?
A function stored as a value for a property of an object
135
How can you tell the difference between a method definition and a method call?
Call would include object.method()
Definition includes property with function
Ie:
Property: function()
136
Describe method definition syntax (structure).
Function definition that is being stored as property of an object
137
Describe method call syntax (structure).
Object.method(argument)
138
How is a method different from any other function?
A method NEEDS an object.
Functions are independent.
139
What is the defining characteristic of Object-Oriented Programming?
That an object can contain both data and methods to work together
140
What are the four "principles" of Object-Oriented Programming?
Abstraction, inheritance, polymorphism, incapsulation
141
What is "abstraction"?
Taking complex problems and making them accessible
142
What does API stand for?
Application Programming Interface
143
What is the purpose of an API?
To communicate between different pieces of software
144
What is this in JavaScript?
“This” is an implicit parameter that returns the value of the object from which the function was called
145
What does it mean to say that this is an "implicit parameter"?
That it’s given to the function even if you don’t see the parameter listed
146
When is the value of this determined in a function; call time or definition time?
Call time
147
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
148
```
var character = {
firstName: 'Mario',
greet: function () {
var message = 'It\'s-a-me, ' + this.firstName + '!';
console.log(message);
}
};
```
Given the above character object, what is the result of the following code snippet? Why?
character.greet();
It’s a me mario
149
```
var character = {
firstName: 'Mario',
greet: function () {
var message = 'It\'s-a-me, ' + this.firstName + '!';
console.log(message);
}
};
```
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
150
How can you tell what the value of this will be for a particular function or method definition?
You can’t.
151
How can you tell what the value of this is for a particular function or method call?
By the object to the left of the dot
152
What kind of inheritance does the JavaScript programming language use?
Prototypal Inheritance
153
What is a prototype in JavaScript?
An object that a bunch of objects can build off of
154
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 they’re grabbing it from the prototype
155
If an object does not have it's own property or method by a given key, where does JavaScript look for it?
On the prototypes
156
What does the new operator do?
1. Lets you create an object
2. Adds property to new object _proto_
3. Binds new object as this
4. Returns “this” if function doesn’t return object
157
What property of JavaScript functions can store shared behavior for instances created with new?
Prototype property
158
What does the instanceof operator do?
Checks whether or not an object is in the same prototypal chain
159
What is a "callback" function?
Functions being passed around as values
160
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?
Applying a delay with setTimeout()
161
How can you set up a function to be called repeatedly without using a loop?
setInterval()
162
What is the default time delay if you omit the delay parameter from setTimeout() or setInterval()?
0
163
What do setTimeout() and setInterval() return?
A number id to represent the interval
164
What is a code block? What are some examples of a code block?
A codeblock is code between two curly braces
Ie:
Function codeblocks, conditional codeblocks
165
What does block scope mean?
Located within codeblock
166
What is the scope of a variable declared with const or let?
What the written code is applicable to
167
What is the difference between let and const?
Let can be reassigned, const cannot
168
Why is it possible to .push() a new value into a const variable that points to an Array?
Because you’re changing the contents, not reassigning the variable itself
169
How should you decide on which type of declaration to use?
If you need to reassign the variable, use let
Otherwise use const
170
What is the syntax for writing a template literal?
High quotation marks to initiate and close: ‘ ‘
| Along with ${variable} to reference any variables within template literal
171
What is "string interpolation"?
Ability to embed variables within strings
172
What is destructuring, conceptually?
Assigning properties to individual variables
173
What is the syntax for Object destructuring?
Variable declaration, curly braces, property names, right side of = would be object being destructured.
174
What is the syntax for Array destructuring?
Variable declaration, square brackets, variables for elements at indexes, commas to separate and array being destructured on right side of =
175
How can you tell the difference between destructuring and creating Object/Array literals?
Placement of brackets in respect to assignment operator (left or right of object/array)
176
What is the syntax for defining an arrow function?
Variable name, assignment operator, parameter(more than one needs parenthesis), => operator and codeblock
177
When an arrow function's body is left without curly braces, what changes in its functionality?
It will return expression without curly braces but needs curly braces for multiple lines of code
178
How is the value of this determined within an arrow function?
Based on surrounding scope that arrow function was defined in
179
What are the three states a Promise can be in?
Pending, fulfilled, rejected
180
How do you handle the fulfillment of a Promise?
Then() method
181
How do you handle the rejection of a Promise?
Catch() method
182
What is Array.prototype.filter useful for?
Returning a list of the filter criteria
183
What is Array.prototype.map useful for?
To apply something to every element in the array, and receive a new array with changes values for the whole original array
184
What is Array.prototype.reduce useful for?
Combining elements of an array into a single value
185
What is "syntactic sugar"?
Syntax that makes things easier to read, write, and understand
186
What is the typeof an ES6 class?
Function
187
Describe ES6 class syntax.
Class declaration, class body, class name, optional constructor function
188
What is "refactoring"?
Rewriting the same code with different syntax that accomplishes the same actions
189
How are ES Modules different from CommonJS modules?
1. ES modules are built into JS
2. Syntactically different
3. No need for variable assignments in ES6
