JavaScript Flashcards

1
Q

What is the purpose of variables?

A

store and manipulate data in the future

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

How do you declare a variable?

A

var, const, or let

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 = (assignment operator) after declaring the variable

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, dollar sign, underscore, numbers (not first character)

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

uppercase and lowercase letters are considered different by the engine

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

store/manipulate text content

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

store/manipulate numbers with math

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

logic with binary states, decision making

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

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 assignment operator (variable = value)

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 is intentional emptiness (can’t exist unless assigned to variable), undefined is default value of variables

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

understand what the log’s content contains

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

Give five examples of JavaScript primitives.

A

string, number, boolean, null, undefined

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

What data type 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

attach one string to another to create a new string

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

arithmetic addition, string concatenation if string is present

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

add/concatenate a value onto stated variable, then assign the result 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

storing related data within a single variable

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

What are object properties?

A

the “variables” contained within the object, key and value pair

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

Describe object literal notation.

A

curly braces containing properties, 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

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

dot notation ( object.property ) / bracket notation ( object[‘property’] )

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

What are arrays used for?

A

storing related values within a single variable

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

Describe array literal notation.

A

values in brackets, separated by commas

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

there is no “key”, but rather an index for each value. it’s an ordered list.

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

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 amount of values 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

array 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 set of code that can be called in the future with arguments that can affect the outcome of the code.

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

○ keyword, name, parameters, code block

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, arguments

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 has a code block, keyword, and parameters rather than arguments

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

○ parameter is a placeholder, argument is the data sent to function

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

• Why are function parameters useful?

A

○ placeholder. allows data to influence the return

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

○ exits and gets back the value

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

Development debugging tool

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

What is a method?

A

A function defined as a property within 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

not much, just in an object

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

array.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.round(x)

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() (gives a percentage value)

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 (at any index)?

A

array.splice

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

array.push

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

string.split(seperator as string)

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

they don’t. check via console log

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

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

A

no

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

• Give 6 examples of comparison operators.

A

equal, strictly equal, not equal, strictly not equal, greater, greater and equal, less than, less than and equal

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

• What is the purpose of an if statement?

A

○ to allow for decision based on whether or not something is true or false

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

• Describe the syntax (structure) of an if statement.

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

• What are the three logical operators?

A

○ AND &&, OR ||, 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

○ use logic operators

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

• What is the purpose of a loop

A

○ to allow for repeated tasks

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

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

A

○ determine whether to continue the loop

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

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

A

○ a single cycle of a loop

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

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

A

○ before the code block

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

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

A

○ before the first condition, at the beginning ONCE

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

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

A

○ before each iteration of the code block

62
Q

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

A

○ at the end of each iteration

63
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

64
Q

• What does the ++ increment operator do?

A

○ increments value by 1

65
Q

• How do you iterate through the keys of an object?

A

○ “for in” loop

66
Q

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

A

○ HTML document that script has been linked to

67
Q

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

A

○ JavaScript Objects

68
Q

• What is a DOM Tree?

A

○ The a chunk of HTML represented as a JavaScript object, including its children and all details

69
Q

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

A

○ document.querySelector(css selector) or ○ document.getElementById(id attribute)

70
Q

• Give one example of a document method that retrieves multiple elements from the DOM at once.

A

○ document.querySelectorAll(css selector)

71
Q

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

A

○ cache the location of the DOM element to refer back to later without having to rewrite the same query and waste performance

72
Q

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

A

○ console.dir

73
Q

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

A

○ the DOM only forms when the script is called. the browser reads HTML in a straight order.

74
Q

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

A

○ Class selector as an argument, returns the first node that matches the selector

75
Q

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

A

○ Class selector as an argument, returns NodeList (array-like object) of matching nodes

76
Q

• What is the purpose of events and event handling?

A

○ create reactive code
○ handler: function made as response to effect occuring
○ listener: watches for the event to trigger handler

77
Q

• Are all possible parameters required to use a JavaScript method or function?

A

○ no

78
Q

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

A

○ addEventListener

79
Q

• What is a callback function?

A

○ a function definition passed as an argument via name without () for another function

80
Q

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

A

○ the “event” object as an argument

81
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 element where the event originated from in the DOM. use console logging to check

82
Q

• What is the difference between these two snippets of code?

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

A

○ first is passing a callback function, second is calling the function for a return to be passed

83
Q

• What is the className property of element objects?

A

○ the value of the class attribute of the element in the DOM

84
Q

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

A

○ assign a value to the className property of the element’s DOM object

85
Q

• What is the textContent property of element objects?

A

○ all text within the element, ignoring any markup

86
Q

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

A

○ assign a value to the textContent property of the element’s DOM object

87
Q

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

A

○ not all the time

88
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, as it would result in variables being handled by the HTML content rather than the JS code itself

89
Q

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

A

○ easier manipulation by developer in JS, harder for users to try and break the program.

90
Q

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

A

○ focus

91
Q

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

A

○ blur

92
Q

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

A

○ input

93
Q

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

A

○ submit

94
Q

• What does the event.preventDefault() method do?

A

○ prevent the default behavior of an event

95
Q

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

A

○ refresh the page

96
Q

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

A

○ .elements

97
Q

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

A

○ .value

98
Q

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

A

○ you might fuck yourself over later and build upon a non-working foundation

99
Q

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

A

○ it’s a playground that allows for checking values and testing functions without having to reload the webapp

100
Q

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

A

○ no

101
Q

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

A

○ appendChild or append

102
Q

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

A

○ attribute: string, value: string

103
Q

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

A

○ create element, modify element (optional), append element onto target (parent)java

104
Q

• What is the textContent property of an element object for?

A

○ the text of the node and its decendants

105
Q

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

A

○ className property, setAttribute() method

106
Q

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

A

○ to be able to repeat the task without having to write it again

107
Q

• What is the event.target?

A

○ the origin element that triggered the event

108
Q

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

A

○ event bubbling flow (goes outwards from most specific node)

109
Q

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

A

○ .tagName

110
Q

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

A

○ takes a CSS selector as argument, returns node element of nearest parent matching provided selector

111
Q

• How can you remove an element from the DOM?

A

○ remove() method of node element

112
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

○ use event delegation and attach a listener to the element containing the clickable DOM elements.

113
Q

• What is JSON?

A

○ Java Script Object Notation. a way to send and store data in and between computers, even outside of JavaScript

114
Q

• What are serialization and deserialization

A

○ serialization: converting a native object into a universal format (like JSON)
○ deserialization: converting a universal format (like JSON) to a native object

115
Q

• Why are serialization and deserialization useful?

A

○ to allow for data to be sent between different systems and parsed in different languages under one common data type

116
Q

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

A

○ JSON.stringify(json string)

117
Q

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

A

○ JSON.parse(object)

118
Q

• How to you store data in localStorage?

A

○ localStorage.setItem(key, value), strings

119
Q

• How to you retrieve data from localStorage?

A

○ localStorage.getItem(key)

120
Q

• What data type can localStorage save in the browser?

A

○ strings, mainly for JSON

121
Q

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

A

○ before the page unloads via closing the tab

122
Q

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

A

○ hides the content and removes it and its descendants from document flow as if it was never there

123
Q

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

A

○ takes CSS Selector, gives back a bool if CSS Selector matches the element

124
Q

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

A

○ getAttribute()

125
Q

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

A

○ when calling getAttribute

126
Q
  • What is amethod?
A
  • A function that is a property of an object.
127
Q
  • How can you tell the difference between a methoddefinitionand a methodcall?
A

Method Definition: defined in the object as a property with the value of an anonymous function
Method Call: Has path to method from object and has parenthesis for calling functions.

128
Q

Describe methoddefinitionsyntax (structure).

A
object = { 
property: function (parameter, parameter, ...) {
	Code Block
	} 
}
129
Q

Describe method call syntax (structure)

A

Object.method(parameter);

130
Q

How is a method different from any other function?

A

It is a parameter of the object it is attached to, rather than a standalone variable function.

131
Q

What is the defining characteristic of Object-Oriented Programming?

A

Objects can contain both data and behavior (properties and methods)

132
Q

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

A

Abstraction
Encapsulation
Inheritance
Polymorphism

133
Q

What is “Abstraction”?

A

A complex process that is accessible in a simplified manner.

A facade that hides a bunch of complex shit behind the scenes.

134
Q

What does API stand for?

A

Application Programming Interface.
A way for software to interact with another software.
A set of code features that allow other devs to make use of it, rather than humans

135
Q

What is the purpose of an API?

A

To enable devs to allow for software to interact with each other

136
Q

What is “this” in JavaScript?

A
  • An implicit parameter of all JavaScript functions that takes the value of a reference of the object it is being called from.
137
Q

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

A

An available parameter of a function even if it wasn’t included in the parameter list.

138
Q

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

A

Call Time

139
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

Nothing (not being called yet)

140
Q

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

A

You can’t. It doesn’t have a value yet.

141
Q

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

A

Check the object that is being used to access the method. If there’s none, then it’ll be window global object.

142
Q

What kind of inheritance does the JavaScript programming language use?

A

prototype-based (prototypal) inheritance

143
Q

What is a prototype in JavaScript?

A

The structure/defaults that new objects are built off of when newly created. Behaviors and data are passed to the inheritors.

144
Q

How is it possible to call methods on strings, arrays, and numbers even though those methods don’t actually exist on strings, arrays, and numbers?

A

Strings, arrays, and numbers are objects themselves that inherit from their respective prototypes.

145
Q

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

A

The object that it inherits from. (prototype)

146
Q

What does the new operator do?

A

Creates a blank object
Assigns value of prototype property of constructor function to __proto__ property of the new object
Calls the provided constructor function with “this” bound to the new object.
Constructor function returns an object, which becomes the value of the “new” expression.

147
Q

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

A

prototype property

148
Q

What does the instanceof operator do?

A

Checks if an object inherits from a certain prototype in its prototype chain.
Returns a boolean.

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(), or setInterval() (if the code should be ran repeatedly)

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

delay defaults to 0 (instant within the queue)

152
Q

What do setTimeout() and setInterval() return?

A

An ID, timeoutID or intervalID, which allows you to cancel the action and prevent the function from actually being called via clearTimeout() or setTimeout() . It’s like an ID for the specific action.