JavaScript Flashcards

1
Q

What is the purpose of variables?

A

Variables store data

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
2
Q

How do you declare a variable?

A

Use the keyword var to create a variable and give it a name. Statement ends with a semicolon.

EX: var firstName;

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
3
Q

How do you initialize (assign a value to) a variable?

A

Use the var key word to initialize a new variable. Use the = assignment operator to give the variable a value.

EX: var firstName = ‘Rachel’

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
4
Q

What characters are allowed in variable names?

A

letters, numbers, dollar sign ($), or underscore (_).

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
5
Q

What does it mean to say that variable names are “case sensitive”?

A

Use of capital and lower cases are important in the variable name. score and Score would be 2 different variables, but it is bad practice to create two variables that have the same name using different cases.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
6
Q

What is the purpose of a string?

A

The strings data type consists of letters and other characters. Strings are useful when working with any kind of text.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
Q

What is the purpose of a number?

A

The numeric data type handles numbers.

For tasks that involve counting or calculating sums, you will use numbers 0-9.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
8
Q

What is the purpose of a boolean?

A

Boolean data types can have one of two values: true or false. Booleans are helpful when determining which part of a script should run.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
9
Q

what does the = operator mean in JavaScript?

A

the equals sign (=) is an assignment operator. It says that you are going to assign a value to the variable/ update the value given to a variable.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
10
Q

How do you update the value of a variable?

A

variableName = newValue

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
11
Q

What is the difference between null and undefined?

A

Null means nothing, undefined means the value has not been set/assigned yet.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
12
Q

Why is it a good habit to include “labels” when you log values to the browser console?

A

A console log “label” is a short string that describes the variable or value being logged.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
13
Q

Give 5 examples of JavaScript primitives.

A

String, number, boolean, undefined, null.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
14
Q

What data type is returned by and arithmetic operation?

A

Number

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
15
Q

What is string concatenation?

A

Joining of 2 or more strings by using + operator

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
16
Q

what purpose(s) does the + operator serve in JavaScript?

A

Arithmetic addition, concatenating strings

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
17
Q

what data type is returned by comparing two values ( < , > , = = = , etc)?

A

boolean - true or false

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
18
Q

What does the += “plus-equals” operator do?

A

addition assignment

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
19
Q

What are objects used for?

A

Objects are used to group together a set of variables and functions. Used to group related data together.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
20
Q

what are object properties?

A

Properties tell us about the object. Property is a key-value pair.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
21
Q

Describe object literal notation.

A

var objectName = {
property: value,
property: value,
};

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
22
Q

How do you remove a property from an object?

A

Using the delete operator followed by objectName.propertyName OR objectName[“propertyName”]

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
23
Q

What are the two ways to get or update the value of a property?

A

.notation OR
[“bracket notation”]. .notation is preferable for objects.
Bracket notation is used when the property name is not actually known (it’s in a variable or i needs o be calculated. Bracket notation is also required when the property key is not a valid identifier (variable name)

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
24
Q

What are arrays used for?

A

To store a list or set of values that are related to each other in one variable.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
25
Q

Describe array literal notation.

A

var arrayName = [‘item 1’ , ‘item 2’ , ‘item 3’];

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
26
Q

How are arrays different from ‘plain’ objects?

A

Items in an array are in a numbered list. Each item in the array is automatically given a number called and index. Objects can have named properties for the values but arrays are numbered.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
27
Q

What number represents the first index of an array?

A

0 - computers start counting from 0, 1, 2, 3 etc.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
28
Q

What is the length property of an array?

A

The length property holds the number of items in the array.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
29
Q

How do you calculate the last index of an array?

A

lastIndex = arrayName.length - 1

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
30
Q

What is a function in Javascript?

A

A group of steps/actions that are stored.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
31
Q

Describe the parts of a function definition.

A

function keyword, optional function name, optional parameters, opening curly brace, block of code to be executed when function is called. within the code block should be a return statement - closing curly brace.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
32
Q

Describe the parts of a function call.

A

Name of the function followed by ( ) with any arguments (if any) passed included in the parenthesis. Ending with semicolon.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
33
Q

When comparing them side-by-side, what are the differences between a function call and a function definition?

A

Function definition contains curly braces indicating a block of code to be executed. Function definition will also include the function keyword where the call does not.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
34
Q

What is the difference between a parameter and an argument?

A

Parameters variables without a value, the arguments is the value for that parameter.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
35
Q

Why are function parameters useful?

A

Parameters give us the ability to add in variance (mutability). Result can now vary based on the information thats passed in.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
36
Q

What two effects does a return statement have on the behavior of a function?

A
  1. Causes the function to produce a value we can use in our program.
  2. Prevents any more code in the function’s code block from being run.
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
37
Q

Why do we log things to the console?

A

console.log is a debugging tool geared towards development To check the output of your code and see if any errors occur

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
38
Q

What is a method?

A

A method is a function which is a property of an object.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
39
Q

How is a method different from any other function?

A

Methods are called on a variable/object. Syntax is the main difference.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
40
Q

How do you remove the last element from an array?

A

pop( ) method.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
41
Q

How do you round a number down to the nearest integer?

A

Math.floor ( ) - floor method of the Math object.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
42
Q

How do you generate a random number?

A

Math.random ( ) - random method of the Math object. Range is between 0-1 not inclusive of 1. Then you can multiply that decimal by the maximum or minimum value you need to get a the range you want.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
43
Q

How do you delete an element from an array?

A

splice( ) method.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
44
Q

How do you append an element to an array?

A

push ( ) method.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
45
Q

How do you break a string up into an array?

A

split ( ) method.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
46
Q

Do string methods change the original string? How would you check if you weren’t sure?

A

Strings are not mutable so the original string can’t be changed. You can check by looking at documentation @ MDN / you can try it yourself in the console to see the outcome.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
47
Q

Roughly how many string methods are there according to the MDN Web docs?

A

Roughly 50 different methods / check for them on MDN

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
48
Q

Is the return value of a function or method useful in every situation?

A

Sometimes the return is not necessary - but a return is always there if you need it. If you need the return later you can save the return in a variable

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
49
Q

Roughly how many array methods are there according to the MDN Web docs?

A

Roughly 40 different methods / check for them on MDN

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
50
Q

What three-letter acronym should you always include in your Google search about a JavaScript method or CSS property?

A

MDN

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
51
Q

Give 6 examples of comparison operators.

A

< , > , >= , <= , === , !==

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
52
Q

What data type do comparison expressions evaluate to?

A

Boolean - true or false

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
53
Q

What is the purpose of an if statement?

A

the if statement evaluates (or checks) a condition. if the condition evaluates to be truthy, any statements in the subsequent code block are executed.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
54
Q

Is else required in order to use an if statement?

A

An else statement is not required to use an if statement. Else is a fallback statement.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
55
Q

Describe the syntax (structure) of an if statement.

A

if (condition) { //code to be executed if condition is truthy}

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
56
Q

What are the three logical operators?

A

& & ; - logical and, | | - logical or, ! - logical not

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
57
Q

How do you compare two different expressions in the same condition?

A

wrap each individual expression in parenthesis and wrap the whole condition in a set of parenthesis.
EX. if ( (score1 + score2) > (highScore1 + highScore2) ) { //code to execute }

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
58
Q

What is the purpose of a loop?

A

To execute/repeat a code block any number of times.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
59
Q

What is the purpose of a condition? (in reference to loops)

A

A condition specifies the amount of times a code block should execute. If the condition is truthy the code block will run. When the condition is false the loop ends.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
60
Q

What does “iteration” mean in the context of loops?

A

round - or pass through the loop.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
61
Q

When does the condition expression of a while loop get evaluated?

A

Before each pass through the loop.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
62
Q

When does the initialization expression of a for loop get evaluated?

A

Initialization expression is evaluated once before the loop begins.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
63
Q

When does the condition expression of a for loop get evaluated?

A

Condition expression is evaluated after initialization is evaluated and before each loop iteration (round).

64
Q

When does the final expression of a for loop get evaluated?

A

The final expression is evaluated at the end of each loop iteration (round).

65
Q

Besides a return statement, which exits its entire function block, which keyword exits a loop before its condition expression evaluates to false?

A

Break keyword

66
Q

What does the ++ increment operator do?

A

The increment operator (++) increments (adds one to) its operand AND returns a value.

67
Q

How do you iterate through the keys of an object?

A

Using a for . . . in loop

68
Q

What is a “model”?

A

A system or thing used as an example to follow or imitate

69
Q

Which “document” is being referred to in the phrase Document Object Model

A

The browsers interpretation of the HTML document. Object refers to JavaScript objects

70
Q

What is a DOM Tree?

A

A model of a web page (or portion of the page) consisting of all elements and their nodes from the most parental element downwards.

71
Q

Give 2 examples of document methods that retrieve a single element from the DOM?

A

.getElementById( );

.querySelector( );

72
Q

Give 1 example of a document method that retrieves multiple elements from the DOM.

A

.querySelectorAll( );
.getElementByClassName( );
.getElementByTagName( );

73
Q

When might you want to assign the return value of a DOM query to a variable?

A

If your script needs to use the same element(s) more than once, you can store the location of the element(s) in a variable.

74
Q

What console method allows you to inspect the properties of a DOM element object?

A

console.dir( );

75
Q

Why would a < script > tag need to be placed at the bottom of the HTML content instead of at the top?

A

Because the browser needs to parse all the of the elements in the HTML page before the JavaScript code can access them.

76
Q

What does document.querySelector( ) take as its argument and what does it return?

A

Takes a CSS selector string as an argument and returns the first matching HTML element object.

77
Q

What does document.querySelectorAll( ) take as its argument and what does it return?

A

Takes a CSS selector string as an argument and returns all matching elements in the form of a NodeList

78
Q

What is the purpose of events and event handling?

A

Events occur when users interact with a web page. When an event occurs or fires, it can be used to trigger a particular function in response to that event.

79
Q

What do [ ] square brackets mean in function and method syntax documentation?

A

square brackets mean optional

80
Q

What method of element objects lets you set up a function to be called when a specific type of event occurs?

A

an addEventListener method

81
Q

What is a callback function?

A

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.

82
Q

What object is passed into an event listener callback when the event fires?

A

object about the event

83
Q

What is the event.target? If you weren’t sure, how would you check? Where could you get more information about it?

A

The target property of the Event interface – the object onto which the event was dispatched. Check MDN for more info.

84
Q

What is the difference between these two snippets of code?

element. addEventListener(‘click’, handleClick)
element. addEventListener(‘click’, handleClick( ) )

A

the first ‘handleClick’ is referring to a function definition. The second is referring to the return value of the ‘handleClick’ function.

85
Q

What is the className property of element objects?

A

A string containing the value of the class on that element.

86
Q

How do you update the CSS class attribute of an element using JavaScript

A

Use the ClassName property ElementVariable.ClassName = ‘newValue’;

87
Q

What is the textContent property of element objects

A

A string containing the text content of the element & any child elements.

88
Q

How do you update the text within an element using JavaScript?

A

Use the textContent property

ElementVariable.textContent = ‘newValue’

89
Q

Is the event parameter of an event listener callback always useful?

A

The Event parameter is not always used and therefor not always necessary.

90
Q

Why is storing information about a program in variables better than only storing it in the DOM?

A

So you can access that information more easily. If you don’t store in a variable - you’ll have to query the DOM again if you need that info again

91
Q

What event is fired when a user places their cursor in a form control?

A

‘focus’ event

92
Q

What event is fired when a user’s cursor leaves a form control?

A

‘blur’ event

93
Q

What event is fired as a user changes the value of a form control?

A

‘input’ event

94
Q

What event is fired when a user clicks the “submit” button within a ?

A

‘submit’ event

95
Q

What does the event.preventDefault( ) method do?

A

Prevents the browser from automatically reloading the page

96
Q

What does submitting a form without event.preventDefault( ) do?

A

The browser will reload the page

97
Q

What property of a form element object contains all of the form’s controls.

A

Elements property

98
Q

What property of form a control object gets and sets its value?

A

Value property

99
Q

What is one risk of writing a lot of code without checking to see if it works so far?

A

You’ll need to look through all the code to find the bug.

100
Q

What is an advantage of having your console open when writing a JavaScript program?

A

So you can check the outputs are as expected and see any errors/bugs in your code.

101
Q

Does the document.createElement( ) method insert a new element to the page?

A

No - you need to append that new element to an existing one to add it to the page.

102
Q

How do you add an element as a child to another element?

A
appendChild( ) method
or append( ) method
103
Q

What do you pass as the arguments to the element.setAttribute( ) method?

A

the attribute name and value

EX: element.setAttribute(“class”, “header”)

104
Q

What steps do you need to take in order to insert a new element into the page?

A
  1. Create the element - createElement( )
  2. Give it content - createTextNode( ) you can skip this step if you don’t want to add content.
  3. Add it to the DOM -
    The appendChild( ) method allows you to specify which existing element you want this node added to, as a child of it.
105
Q

What is the textContent property of an element object for?

A

textContent property can be used to get or set the text content of an element object

106
Q

Name two ways to set the class attribute of a DOM element

A

element.className = ‘class-name’
OR
.setAttribute( ) method

107
Q

What are two advantages of defining a function to do create something (like the work of creating a DOM tree)?

A

Having a function that takes in data and returns data

makes it easy to test (in the console)

108
Q

What is the event.target?

A

the target property of the Event interface is a reference to the object onto which the event was dispatched.

109
Q

Why is it possible to listen for events on one element that actually happen its descendent elements?

A

Because the event starts at the most specific node and flows outwards (bubbles) to the least specific one by default.

110
Q

What DOM element property tells you what type of element it is?

A

.tagName property

111
Q

What does the element.closest( ) method take as its argument and what does it return?

A

Takes in a CSS selector as its argument and returns the Element which is the closest ancestor of the selected element.

112
Q

How can you remove an element from the DOM?

A

Using the remove( ) method.

EX: element.remove( );

113
Q

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?

A

By adding the event listener to the parent element aka. event delegation

114
Q

What does the element.matches( ) method take as an argument and what does it return?

A

It takes a string representing a CSS selector as it’s argument. and returns a boolean.

115
Q

How can you retrieve the value of an element’s attribute?

A

element.getAttribute( ) method

116
Q

What is JSON?

A

Text-based data format following JavaScript object syntax

117
Q

What are serialization and deserialization?

A

Serialization is the process of turning an object in memory into a stream of bytes (taking some complex data format and converting it into a string).
Deserialization is the reverse process: turning a stream of bytes into an object in memory.

118
Q

Why are serialization and deserialization useful?

A

Serialization is useful so you can send data over a network or store things in memory.

Deserialized data is easier to work with.

119
Q

How do you serialize a data structure into a JSON string using JavaScript?

A

JSON.stringify( ) method

120
Q

How do you deserialize a JSON string into a data structure using JavaScript?

A

JSON.parse( ) method

121
Q

How do you store data in localStorage?

A

localStorage.setItem( ) method

122
Q

How do you retrieve data from localStorage?

A

localStorage.getItem( ) method

123
Q

What data type can localStorage save in the browser?

A

String

124
Q

When does the ‘beforeunload’ event fire on the window object?

A

The beforeunload event is fired when the page is about to be unloaded.

125
Q

How can you tell the difference between a method definition and a method call?

A

Method definition starts with a function keyword and is followed by code block.
Method call has ( ) with any arguments inside

126
Q

Describe method definition syntax (structure).

A
propertyName: function (any parameters) {
//code block
}
127
Q

Describe method call syntax (structure).

A

objectName.methodName (any arguments);

128
Q

How is a method different from any other function?

A

A method is a property of an object

129
Q

What does API stand for?

A

Application Programming Interface

130
Q

What is “abstraction”?

A

Being able to work with (possibly) complex things in simple ways.

The process of removing physical, spatial, or temporal details or attributes in the study of objects or systems to focus attention on details of greater importance.

131
Q

What is the purpose of an API?

A

is to give programmers a way to interact with a system in a simplified, consistent fashion: aka, an abstraction.

Allows users to use the interface independently of the implementation.

132
Q

What is ‘this’ in JavaScript?

A

An implicit parameter that points to the object that we are inside of.

133
Q

When is the value of this determined in a function; call time or definition time?

A

The value of this is determined when the function is called, not when it is defined.

134
Q

How can you tell what the value of ‘this’ will be for a particular function or method definition?

A

If you can’t see where the function (or method) is called, then you cannot say for sure what the value of this is.

135
Q

What kind of inheritance does the JavaScript programming language use?

A

Prototype-based (or prototypal) inheritance

136
Q

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?

A

Those methods are defined on a “prototype” object and arrays/strings/objects simply borrow those methods when they’re needed.

137
Q

If an object does not have its own property or method by a given key, where does JavaScript look for it?

A

In the prototype object

138
Q

What does the ‘new’ operator do?

A
  1. Creates a blank, plain JavaScript object
  2. Links (sets the constructor of) the newly created object to another object by setting the other object as its parent prototype
  3. Passes the newly created object from Step 1 as the ‘this’ context
  4. Returns ‘this’ if the function doesn’t return an object.
139
Q

What property of JavaScript functions can store shared behavior for instances created with new?

A

Prototype property

140
Q

What does the instanceOf operator do?

A

The instanceOf operator tests to see if the prototype property of a constructor appears anywhere in the prototype chain of an object. The return value is a boolean value.

141
Q

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?

A

setTimeout( ) method

142
Q

How can you set up a function to be called repeatedly without using a loop?

A

setInterval( ) method

143
Q

What is the default time delay if you omit the delay parameter from setTimeout( ) or setInterval( )?

A

The default time delay is 0 -execute immediately

144
Q

What do setTimeout( ) and setInterval( ) return?

A

The returned intervalID for setInterval( ) is a numeric non-0 value which identifies the timer created by the call to setInterval( );

The returned timeoutID is a positive integer value which identifies the timer created by the call to setTimeout( );

145
Q

What does the AJAX acronym stand for?

A

Asynchronous JavaScript And XML

146
Q

What is AJAX?

A

Ajax is an asynchronous processing model that allows you to request data from a server and load it without having to refresh the entire page.

Ajax is a technique for loading data into part of a page without having to refresh the entire page.

Ajax is a programming practice of building complex, dynamic webpages using a technology known as XMLHttpRequest.

147
Q

Which object is built into the browser for making HTTP requests in JavaScript?

A

XMLHttpRequest

148
Q

What event is fired by XMLHttpRequest objects when they are finished loading the data from the server?

A

Load event

149
Q

An XMLHttpRequest object has an addEventListener() method just like DOM elements. How is it possible that they both share this functionality?

A

Document element objects and HMLHttpRequest objects are both chained off of the EventTarget prototype

150
Q

What is Array.prototype.filter useful for?

A

The filter( ) method creates a new array with all elements that pass the test implemented by the provided callback function. Useful for filtering out any items that don’t meet the functions requirements.

151
Q

What is Array.prototype.map useful for?

A

The map( ) method creates a new array populated with the results of calling a provided function on every element in the calling array.

152
Q

What is Array.prototype.reduce useful for?

A

The reduce( ) method executes a reducer function (that you provide) on each element of the array, resulting in single output value.

Your reducer function’s returned value is assigned to the accumulator, whose value is remembered across each iteration throughout the array, and ultimately becomes the final, single resulting value.

153
Q

What must the return value of myFunction be if the following expression is possible?
myFunction( )( );

A

The return value of MyFunction would have to be a function.

154
Q
What does this code do?
const wrap = value => ( ) => value;
A

Wrap is assigned a function that returns a function

155
Q

In JavaScript, when is a function’s scope determined; when it is called or when it is defined?

A

A functions scope is determined when it is defined.

156
Q

What allows JavaScript functions to “remember” values from their surroundings?

A

Closures allow you to store values to be used in inner functions. A closure is the inner function(s) plus it’s environment. the environment is where values are remembered