JavaScript Flashcards
1
Q
What is the purpose of variables?
A
To store bits of data that the computer needs in order to do its tasks
2
Q
How do you declare a variable?
A
with the keyword “var” followed by the identifier or variable name
3
Q
How do you initialize (assign a value) to a variable?
A
with the assignment operator (=)
4
Q
What characters are allowed in variable names?
A
letters of the alphabet, dollar sign ($), underscore, numbers (can’t start with number)
5
Q
What does it mean to say that variable names are “case sensitive”?
A
e.g. the variables “test” and “Test” are different.
6
Q
What is the purpose of a string?
A
sequence of characters that represent text
7
Q
What is the purpose of a number?
A
represents a numeric data type that allows us to perform mathematical operations on it
8
Q
What is the purpose of a boolean?
A
logical data type that only returns true or false. Useful for conditionals. Lets the computers ultimately decide what to do or not do.
9
Q
What does the = operator mean in JavaScript
A
assignment operator. Assigns the value of the right to whatever is on the left.
10
Q
How do you update the value of a variable?
A
the assignment operator can update the value of a variable. var keyword not necessary to update value
11
Q
What is the difference between null and undefined?
A
undefined: JavaScript’s method of saying “empty”
null: developer’s way of saying “empty”; assigned intentionally
12
Q
Why is it a good habit to include “labels” when you log values to the browser console?
A
Shows the user which logs represent which values. Logs without labels can cause confusion
13
Q
Give five examples of JavaScript primitives
A
string, number, bigint, boolean, undefined, symbol, null
primitive: data that is not an object and has no methods. primitives can NOT be altered
14
Q
What data type is returned by an arithmetic operation?
A
number
15
Q
What is string concatenation?
A
using + to join together multiple things into a single string
16
Q
What purposes does the plus (+) operator serve in JavaScript?
A
- addition
- string concatenation
17
Q
What data type is returned by comparing two values (< , > , ===, etc)?
A
boolean
18
Q
What does the += “plus-equals” operator do?
A
adds/concatenates the value on the right with the value on the left and then assigns it to the variable on the left.
19
Q
What are objects used for?
A
to group relevant data together
20
Q
What are object properties?
A
variables that live within an object
21
Q
Describe object literal notation
A
declare a variable and assign it a value of a curly brace block. The contents of the curly brace block can be empty or consist of key, value pairs
22
Q
How do you remove a property from an object?
A
Using the delete operator
delete object.property
23
Q
What are the two ways to get or update the value of a property?
A
dot notation (object.property = value)
bracket notation (object[‘property’] = value)
24
Q
What are arrays used for?
A
Useful when working with lists or groups of similar data
25
Describe array literal notation
var varName = [list contents (separated by comma)]
26
How are arrays different from "plain" objects?
values assigned to index numbers rather than keys
order is preserved in arrays
27
What number represents the first index of an array?
0
28
What is the length property of an array?
returns how many things are stored in the list
29
How do you calculate the last index of an array?
array.length - 1
30
What is a function in JavaScript?
A block of code that has a specific purpose and can be reused as many times as needed
31
Describe the parts of a function definition
keyword 'function' followed by optional name, zero to however many parameters, code block, optional return statement
```
function name(parameters,..) {
return (optional)
}
```
32
Describe the parts of a function call
functionName(arguments);
33
When comparing them side-by-side, what are the differences between a function call and a function definition?
a function call doesn't need the code block, just function name followed by any arguments
function definition needs the initial code block and has parameters
34
What is the difference between a parameter and an argument?
Parameter is for function definition
| argument is for function calls
35
Why are function parameters useful?
Allows the function to be dynamic
Can achieve different results depending on the data passed in
36
What two effects does a return statement have on the behavior of a function?
exits the code block immediately after executing a return line. (ends the function)
causes function to produce a value we can use in the program
37
Why do we log things to console?
In order to reduce confusion by keeping track of variables and making sure the data output is what we expected
38
What is a method?
function that is a property of an object
39
How is a method different from any other function?
They are properties of an object so they must be accessed as if they were a property (dot notation)
40
How do you remove the last element from an array?
array.pop( ); returns the removed element from the array
41
How do you round a number down to the nearest integer?
Math.floor( )
42
How do you generate a random number?
Math.random( ); Returns a number from 0 (inclusive) to 1 (not inclusive)
43
How do you delete an element from an array?
array.splice(n, x, y,...);
n: starting index
x: number of elements to remove (optional)
y: elements to add to the array (optional)
returns an array of the deleted elements
44
How do you append an element to an array?
array. unshift( ); adds to beginning of array
| array. push( ); adds to end of an array
45
How do you break a string up into an array?
string.split(separator);
| separator describes where the split should occur
46
Do string methods change the original string?
| How to check if not sure?
No, can test in console by trying to change a string then console log the original string
47
Roughly how many string methods are there according to MDN Web docs?
37
48
Is the return value of a function or method useful in every situation?
No
49
Roughly how many array methods are there according to the MDN Web docs?
34
50
What 3 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
, <=, >=, ===, !==
52
What data type do comparison expressions evaluate to?
boolean
53
What is the purpose of an if statement
Lets us choose what to do
54
Is else required in order to use an if statement?
no
55
Describe the syntax of if statement
if (conditional) {
code block
}
56
What are the three logical operators?
&& (and)
|| (or)
! (Logical not; inverts boolean)
57
How do you compare two different expressions in the same condition?
with logical operators (&& or ||)
58
What is the purpose of a loop?
When you want to repeat a chunk of code while certain conditions aren't met
59
What is the purpose of a condition expression in a loop?
It makes it so loops have an exit point (not infinite loop)
60
What does "iteration" mean in the context of loops?
Each time the computer passes through the loop's code block
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?
before everything (first thing that happens in a for loop)
63
When does the condition expression of a for loop get evaluated?
before each iteration
64
When does the final expression of a for loop get evaluated?
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
66
What does the ++ increment operator do?
increments the variable by 1
67
How do you iterate through the keys of an object
with the for.. in loop
| for key in object { }
68
What is the event.target?
The element that the user directly interacted with
69
What is the affect of setting an element to display: none?
It is taken out of the document flow
70
What does the element.matches( ) method take as an argument and what does it return?
element.matches(selector)
returns boolean
71
How can you retrieve the value of an element's attribute?
element.getAttribute(attributeName)
72
At what steps of the solution would it be helpful to log things to the console?
Every step
73
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?
Would have to add an event listener for each tab/view element.
74
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?
have to query each element and set their className manually
75
What is JSON?
JavaScript Object Notation
Takes an object/array/data and converts it into a string which can then be easily transmitted through network and later deserialized in order to access the data in its original state
76
What are serialization and deserialization?
serialization: take data and turn it into a stream of bytes which can be easily transferred
deserialization: take a stream of bytes and turn it into a data (allows us to use data)
77
Why are serialization and deserialization useful?
Can easily transfer data through network
Data is stored in memory locations so can't easily transfer data from system to system.
78
How do you serialize a data structure into a JSON string using JavaScript?
using JSON.stringify(data)
79
How do you deserialize a JSON string into a data structure using JavaScript?
JSON.parse(JSON-string)
80
How do you store data in localStorage?
with storage.setItem('key', 'value')
81
How do you retrieve data from localStorage?
storage.getItem('key')
| Returns value of key
82
What data type can localStorage save in the browser?
Strings
83
When does the 'beforeunload' event fire on the window object?
Right before the page is refreshed/closed
84
How can you tell the difference between a method definition and a method call?
method definition: inside an object, name is listed as a normal property, but the value being assigned to it is an anonymous function definition
method call: called as the property of an object, but with parentheses
85
Describe method definition syntax
defined inside an object as a normal property, but value assigned is an anonymous function definition
86
Describe method call syntax
similar to property of an object, but with parentheses containing any arguments
87
How is a method different from any other function?
They can only be called on an object which contains the method
88
What is the defining characteristic of Object-Oriented Programming?
It relies on the procedures and methods within an object to modify the properties and data within itself.
groups data and behavior (methods) together
89
What are the four "principles" of Object-Oriented Programming?
Abstraction
Encapsulation
Inheritance
Polymorphism
90
What is "abstraction"?
simplifying a complex thing
91
What does API stand for?
Application Programming Interface
92
What is the purpose of an API?
Used as tools that do specific things which simplify the process
93
What is "this" in JavaScript?
an implicit parameter whose value is determined by whenever the function is called
94
What does it mean to say that "this" is an implicit parameter?
It is available in a function's code block as a parameter despite not being explicitly given
95
When is the value of "this" determined in a function?
whenever the function is called
96
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 at the moment
97
Given the above character object, what is the result of the following code snippet? Why?
character.greet();
"It's-a-me, Mario!"
this refers to the character object and it will get the firstName property of the character object
98
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!"
hello stores the character.greet method, but when it is called, 'this' refers to the window object as there is no dot to the left of hello. Since there is no firstName property of window, it is undefined.
99
How can you tell what the value of 'this' will be for a particular function or method definition?
It is unknown on function definition
100
How can you tell what the value of 'this' is for a particular function or method call?
this refers to whatever object or function calls it
101
What kind of inheritance does the JavaScript programming language use?
prototype-based
102
What is a prototype in JavaScript?
an object that contains the methods which we can use through inheritance
103
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?
They all acquire their methods through the prototype object via inheritance
104
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
105
What does the new operator do?
lets developers create an instance of a user-defined object type or one of the built-in types that has a constructor function
1) Creates a blank, plain JS Object
2) Adds __proto__ property that points to constructor function's prototype object
3) all references to 'this' refer to the newly created object
4) returns this if function doesn't return an object
106
What property of JavaScript functions can store shared behavior for instances created with new?
an object's prototype property
107
What does the instanceof operator do?
tests to see if the prototype property of a constructor appears anywhere in the prototype chain of an object.
object instanceof constructor
AKA was this object created by this constructor function
108
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( )
| setInterval( )
109
How can you set up a function to be called repeatedly without using a loop?
setInterval( )
110
What is the default time delay if you omit the delay parameter from setTimeout( ) or setInterval( )?
default time delay is 0
111
What do setTimeout( ) and setInterval( ) return?
a positive integer ID which identifies the setTimeout( ) or setInterval( ) call
112
What is AJAX?
Asynchronous JavaScript and XML
Tools for making network requests in code.
Allows us to update parts of the page without having to refresh the entire page.
113
What does AJAX acronym stand for?
Asynchronous JavaScript and XML
114
Which object is built into the browser for making HTTP requests in JavaScript?
XMLHttpRequest object
115
Which event is fired by XMLHttpRequest objects when they are finished loading the data from the server?
'load' event
116
An XMLHttpRequest object has an addEventListener( ) method just like DOM elements. How is it possible that they both share this functionality?
They are both event target objects so they both get the method through inheritance
117
What is a code block? What are some examples of a code block?
chunks of code within curly braces
| if, for, function, while, etc
118
What does block scope mean?
data within a block can only be accessed within the same block
119
What is the scope of a variable declared with const or let?
block-scope
120
What is the difference between let and const?
let is mutable, const is immutable
| const requires a value to be assigned to it during initialization
121
Why is it possible to .push( ) a new value into a const variable that points to an array?
The const variable just holds a reference to the array so you are able to change the array itself, but not assign a new array to the variable
122
How should you decide on which type of declaration to use?
var: if it needs to be global
let: if can be defined within a block and needs to be mutable
const: defined within a block and needs to be immutable
Try to use const, unless you can't
123
What is the syntax for writing a template literal?
text surrounded by backticks
variables to be substituted are ${variable_name} within the backticks
124
What is "string interpolation"?
ability to substitute parts of a string with values of variables or expressions
125
What is destructuring, conceptually?
Taking the values/properties of an array/object and assigning them to variables in a shorthand expression
126
What is the syntax for object destructuring?
const/let { property: alias,... } = objectName;
alias is optional, if not included, property name will be the variable name
can also set default values with assignment
127
What is the syntax for Array destructuring?
const/let [ varName1, varName2,... ] = arrayName
can also set default values
128
How can you tell the difference between destructuring and creating Object/Array literals?
destructuring will have the object or array literal syntax on the left side of the assignment operator
129
What is the syntax for defining an arrow function?
(parameters) => expression
| (parameters) => {statement}
130
When an arrow function's body is left without curly braces, what changes in its functionality?
It will automatically return the expression
131
How is the value of this determined within an arrow function?
arrow function captures the this value of the enclosing context (parent blocks) instead of creating its own this context
DEFINITION TIME
132
What is the JavaScript Event loop?
Its purpose is to take processes in the task queue and place them into the stack only if the stack is clear.
133
What is different between "blocking" and "non-blocking" with respect to how code is executed?
blocking code: code that occupies the stack (synchronous)
non-blocking: taken out of the stack and placed into the task queue (asynchronous)
134
What are the three states a Promise can be in?
pending,
fulfilled,
rejected
135
How do you handle the fulfillment of a Promise?
then( )
136
How do you handle the rejection of a Promise?
catch( )
| .then( ) but with 2 arguments (fulfilled, rejected) callback functions
137
What is Array.prototype.filter( ) useful for?
Taking an array and getting a new array with only the elements that satisfy the given condition
138
What is Array.prototype.map( ) useful for?
Take a given array and create a new one containing all the elements from the previous array with a transformation applied to it
139
What is Array.prototype.reduce( ) useful for?
Collapse/combine a bunch of data into one
140
What is "syntactic sugar"?
syntax within a programming language that is designed to make things easier to read or express.
141
What is the typeof an ES6 class?
function
142
Describe ES6 class syntax
```
class ClassName {
constructor(params) {
this.whatever = params
}
```
methods
}
143
What is "refactoring"?
restructuring existing code (usually in order to make it easier to read, improve efficiency, reduce complexity) without changing the behavior
144
How are ES modules different from CommonJS modules?
CommonJS: require( )
module.exports = ...;
Part of Node
ES Modules: import { } from 'path'
attach export keyword to anything you want to export
Official JS
145
What kind of modules can Webpack support?
CommonJS, ES Modules, AMD modules, Assets, WebAssembly modules
146
What does fetch( ) return?
A promise resolving to the response received from the server
147
What is the default request method used by fetch( )?
GET
148
How do you specify the request method (GET, POST, etc) when calling fetch?
By providing an optional object containing the method property as the second argument
149
What must the return value of myFunction be if the following expression is possible?
myFunction( )( );
another function
150
What does this code do?
const wrap = value => ( ) => value;
if you call wrap(value) it will return a function that if called on will return value.
151
What allows JavaScript functions to "remember" values from their surroundings?
closures;
| In JS, functions remember their lexical environment
