JavaScript Flashcards

1
Q

What is the purpose of variables?

A

Store bits of 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

create a variable using

var(variable keyword) then providing it a name quantity(variable name): var quantity;

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

By using the =(assignment operator) sign followed by the data.

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

a-z, 0-9, $ and _

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

You can have two variables with different cases that refer to different variables but use the same word.

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

To store written text often times information about a user.

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

Used to count the items of things or doing mathematical equations.

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

Gives us the ability to make decisions.

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

It is the assignment operator.

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

use the variable name followed by = and the new value:

fullname = Kalen Cobb

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 = used by a developer to denote future use

undefined is usually accidental and the computer is telling you it is undefined.

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

So you can keep track of your output.

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

Give some examples of JavaScript primitives.

A

strings, numbers, booleans, null, undefined.

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

What datatype is returned by an 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

The conjoining of two or more strings together using the + operator.

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

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

A

Addition and Concatenation

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

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

adds whatever is on the right side to the value of the variable and then the result of that expression is assigned to the variable.

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

What are objects used for?

A

A box to keep related stuff together

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

What are object Properties?

A

Another way to store data, exclusive to the specific variable

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

Describe object literal notation.

A

Properties and values nested inside curly braces.

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

delete operator (although this is rare)

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 in JavaScript?

A

dot notation or bracket notation

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

What are arrays used for?

A

Storing lists of data

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

Describe array literal notation.

A

values nested inside square brackets.

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

Arrays are an ordered list with numeric indexes

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

What is the length property of an array?

A

A property that holds the number of items in an Array

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

How do you calculate the last index of an array?

A

array.length -1

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

Describe the parts of a function definition.

A
  1. Function keyword
  2. Function name (optional)
  3. Comma separated parameters surrounded by parenthesis ( ).
  4. Function code block starting with an opening curly brace {
  5. Optional return statement
  6. end of the functions code block indicated by a closing curly brace }
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 actions that are repeatable

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

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

A

The Definition is followed by the code block which holds the tasks, while the Call is followed by parentheses only.

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

What is the difference between a parameter and an argument?

A

A parameter is a placeholder for the argument that is passed to it.

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

The function keyword will not be present when being called.

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

A parameter is a variable placeholder for the argument that is passed to it.

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

Why are function parameters useful?

A

We can input data we didn’t previously have when writing the function.

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

To debug our work during the development phase.

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

It is being used ON an object (object.method())

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()

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()

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()

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

Use .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

No and look at the documentation.

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

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

A

Look at the Docs!

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

What three-letter acronym should you alwasy 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
49
Q

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

A

Not really.

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

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

A

look at the docs!

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

What data type do comparison expressions evaluate to?

A

Boolean

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

Is else required in order to use an if statement?

A

No

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

Describe the syntax (structure) of an if statement.

A

Keyword if (condition in parenthesis) opening curly brace
code
closing curly brace

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

What are 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
55
Q

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

A

Using && and/or ||

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

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

A

Using && and/or ||

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

What is the purpose of a loop?

A

Allow us to do a repeatable action.

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

What is the purpose of a condition expression in a loop?

A

To check whether or not the loop should stop.

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

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

A

The number of times we run the action.

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

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

A

Immediately and before every iteration.

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

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

A

Before anything else but only once.

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

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

A

After the initialization and with every iteration.

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

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

A

At the end of each iteration.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
64
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

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

What does the ++ increment operator do?

A

Increases by an increment of one after it is used.

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

How do you iterate through the keys of an object?

A

Use a for…in loop.

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

Why do we log things to the console?

A

To check our work and inspect our data.

Verification and inspecting data.

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

What is a “model”?

A

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

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

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

A

The HTML document

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

What is the word “object” referring to in the phrase Document Object Model?

A

JavaScript Objects

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

What is a DOM Tree?

A

A model of a webpage consisting of all of the elements and their nodes including the parent and any child and other descendents.

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

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

A

getElementById()

querySelector() (use this primarily)

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

Give examples of a document method that retrieves multiple elements from the DOM at once.

A

getElementsByClassName()
getElementsByTagName()
querySelectorAll() (use this primarily)

74
Q

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

A

For future use to help with browser search speed.

75
Q

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

A

console.dir()

76
Q

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

A

HTML needs to load completely before we access it through JavaScript

77
Q

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

A

A css selector in the form of a string.

It returns the first HTML element object.

78
Q

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

A

A css selector in the form of a string.

It returns a node list of all HTML elements.

79
Q

Why do we log things to the console?

A

To confirm our assumptions about our data.

80
Q

What is the purpose of events and event handling?

A

To make the webpage more interactive.

81
Q

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

A

That the content in that portion is optional.

82
Q

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

A

addEventListener()

83
Q

What is a callback function?

A

A function to be used at some point in the future.

84
Q

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

A

event

85
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 property which holds a reference to the HTML element that triggered the event.

Look up the documents on MDN.

86
Q

What is the difference between these two snippets of code?

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

A

The handleClick() is calling the function whereas handleClick is being passed to the method.

87
Q

What is the className property of element objects?

A

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

88
Q

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

A

.className

89
Q

What is the textContent property of element objects?

A

A string containing the value of the text content of an element.

90
Q

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

A

.textContent = value

91
Q

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

A

No.

92
Q

Would this assignment be simpler or more complicated if we didn’t use a variable to keep track of the number of clicks?

A

More complicated

93
Q

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

A

Easier access for later use.

94
Q

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

A

focus event

95
Q

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

A

blur event

96
Q

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

A

submit event

97
Q

What does the event.preventDefault() method do?

A

prevents the browser from reloading the page

98
Q

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

A

the elements property

99
Q

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

A

the value

100
Q

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

A

You don’t know where things are failing.

101
Q

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

A

Ability to check if things are working.

102
Q

what event is fired when a user changes the value of a form control?

A

input event

103
Q

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

A

The page will be reloaded.

104
Q

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

A

No

105
Q

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

A

.appendChild()

106
Q

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

A

name of the attribute you want to set

and the value you want that attribute to have

107
Q

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

A

create element then append to the element you want it to be attached to

108
Q

What is the textContent property of an element object for?

A

setting or getting text of an element

109
Q

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

A

.setAttribute

.className

110
Q

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

A

You don’t have to write the same code over and over.

Easier to test because you’re putting data in and getting data out.

111
Q

What is the event.target?

A

The element most directly interacted with by an event.

112
Q

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

A

event bubbling

113
Q

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

A

.tagName

114
Q

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

A

A selector containing a selector list, and it returns the element which is the closest ancestor of the element.

115
Q

How can you remove an element from the DOM?

A

.remove()

116
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

event-delegation

Add the event listener to the parent item that will contain the new item(s).

117
Q

What is the event.target?

A

The element that originated the event

118
Q

What is the affect of setting an element to display: none?

A

Turns off the display of an element so that it has no effect on layout.

119
Q

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

A

It takes a selector in the form of a string and returns a boolean.

120
Q

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

A

.getAttribute() method

121
Q

At what steps of the solution would it be helpful to log things to the console?

A

Every.

122
Q

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?

A

Add new event listeners, queries, etc to make up for the new tab/view.

123
Q

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?

A

It would have more code to check every tab.

124
Q

What is a Method?

A

A function which is a property of an object.

Instance Methods: built in tasks performed by an object instance.

Static Methods: Tasks that are called directly on an object constructor.

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 the code block.

Method call is being called using parentheses and dot notation.

126
Q

Describe method definition syntax (structure).

A

Property: function (parameters) {
code block
};

127
Q

Describe method call syntax (structure).

A

object.methodName()

128
Q

How is a method different from any other function?

A

Dot or bracket notation must be used to be called.

129
Q

What is the defining characteristic of Object-Oriented Programming?

A

Objects can contain both data and properties as methods.

130
Q

What are the four “principles” of Object-Oriented Programming?

A

Abstraction
Encapsulation
Inheritance
Polymorphism

131
Q

What is “abstraction”?

A

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

132
Q

What does API stand for?

A

Application Programming Interface

133
Q

What is the purpose of an API?

A

Give programmers a way to interact with a system in a simplified, consistent fashion.

134
Q

What is This in JavaScript?

A

An implicit parameter that allows us to see the object that ‘this’ is being invoked upon.

135
Q

What does it mean to say that THIS is an “implicit parameter”?

A

It is available in a functions code block even though it was never included in the function’s parameter list or declared with var.

136
Q

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

A

Function is called.

137
Q

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);
  }
};
A

There is no ‘this’ yet.

138
Q

Given the above character object, what is the result of the following code snippet? why?

character.greet();

A

‘It’s-a-me, Mario!’

because this is referring to the object character as defined in the calling of greet().

139
Q

Given the above character object, what is the result of the following code snippet? why?

var hello = character.greet;
hello();
A

undefined because hello is not a method of the character function?

140
Q

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

A

You cannot know what it will be.

141
Q

How can you tell what the value of this is for a particular function or method call?

A

This is defined when the function/method is called. If it is part being called as a property of an object it will return from that object, otherwise it is the global window object.

142
Q

What kind of inheritance does the JavaScript programming language use?

A

Prototype-based (or prototypal)

143
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

Prototypal Inheritance

144
Q

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

A

in the prototypes?

145
Q

What does the NEW operator do?

A

Creates a new instance of an object.

146
Q

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

A

prototype

147
Q

What does the INSTANCEOF operator do?

A

Check whether the instance we are checking is an instance of something else and it returns a boolean.

148
Q

What is a “callback” function?

A

A callback function is 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.

149
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()

150
Q

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

A

setInterval()

151
Q

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

A

0

152
Q

What do setTimeout() and setInterval() return?

A

A timeout ID and an interval ID.

153
Q

What is AJAX?

A

A technique for loading data into part of a page without having to refresh the entire page. The data is often sent in a format called JavaScript Object Notation (JSON).

154
Q

What does AJAX acronym stand for?

A

Asynchronous JavaScript And XML.

155
Q

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

A

XMLHttpRequest.

156
Q

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

A

Load

157
Q

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

A

They share the proto event target.

158
Q

What is a code block? what are some examples of code block?

A

A piece of code inside curly braces
Function code block
conditional code block
loops

159
Q

What does block scope mean?

A

The variable is only used within the code block in which it is initialized.

160
Q

What is the scope of a variable declared with const or let?

A

Block-Scope

161
Q

What is the difference between let and const?

A

Let is mutable while const is immutable, mostly.

162
Q

Why is it possible to .push() a new value into a const variable that points to an array?

A

You are not assigning the variable to a new value, you are assigning it A new property.

163
Q

How should you decide on which type of declaration (const or let) to use?

A

If you need a variable to be modifiable you should use let otherwise use const.

164
Q

What is destructuring, conceptually?

A

The destructuring assignment syntax is a JavaScript expression that makes it possible to unpack values from arrays or properties from objects into distinct variables

165
Q

What is the syntax for Object destructuring?

A

Let/const keyword

Opening { for property list

Comma separated property keys

Closing } for property list

Assignment operator followed by object name.

166
Q

What is the syntax for Array destructuring?

A

Let/const keyword

Opening square bracket

Comma separated variables.

Closing square bracket

Assignment operator followed by name of array.

167
Q

How can you tell the difference between destructuring and creating Object/Array literals?

A

The syntax.

168
Q

What is the syntax for writing a template literal

A

Surround the string in backticks instead of quotes. Within the string you can use JavaScript Expressions (${}).

169
Q

What is “string interpolation”?

A

String formatting: The ability to substitute part of the string for the values of variables or expressions.

170
Q

What is this: ${data}?

A

A JavaScript expression.

171
Q

What is the syntax for defining an arrow function?

A

let/const keyword

parameters (a, b) if theres more than one you need parenthesis.

arrow =>

code

(If you use the block syntax you need to use the return keyword {return a + b}

If you use an expression you do not need curly braces, but if you use a statement curly braces are required.

172
Q

When an arrow function’s body is left without curly braces, what changes in its functionality?

A

It expects an expression and it will return a value.

173
Q

How is the value of this determined within an arrow function?

A

It captures the “this” value of the enclosing context instead of creating its own “this” context.

174
Q

What is Array.prototype.filter useful for?

A

Finding a specific variety of data in an array.

175
Q

What is Array.prototype.map useful for?

A

Manipulating each piece of data from an array individually.

176
Q

What is Array.prototype.reduce useful for?

A

Manipulating the data from an array using the other data in the array.

177
Q

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

myFunction()();

A

It returns a function.

178
Q

What does this code do?

const wrap = value =>()=>value;

A

Creates a variable named wrap that returns a function that takes no arguments and returns a value.

179
Q

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

A

When it is defined.

180
Q

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

A

Lexical Scope