JavaScript Flashcards

1
Q

What is the purpose of variables?

A

to store data to use later on

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

How do youdeclarea variable?

A

keyword like var let or const

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

With the assignment operator =

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

underscore, $, letters (upper/lower) numbers

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

Having an uppercase letter will declare a different variable

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 represent text, that is not code

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

to perform calculations

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

how we make decisions in code

to identify data as either true or false

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

that you are assigning a value 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

assign another value to it

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

What is the difference betweennullandundefined?

A

Null is used intentionally, null can only be assigned. Either it’s empty because you are going to update it later or to signify nothing will be there.

undefined is used by the computer to signify an error

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

For debugging, but also to organize your data so you know what you are looking at

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, boolean, number, 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

addition for strings

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 (numbers) or concatenation (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

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

adds the assigned value 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

Store data that are related

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

What are object properties?

A

Variables within a group

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

Describe object literal notation.

A

curly brackets properties and values

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

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 and/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

Store related content in a list

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

Describe array literal notation.

A

Square brackets, values separated by comma

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

The way the data is accessed (arrays have index numbers)
numeric indexes, objects have alphanumeric indexes
Order: Arrays have order, objects do not
Brackets

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 thelengthproperty of an array?

A

array.length

property that contains a true count of each piece of data

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 repeatable block of code with the potential to receive and return different values. Functions allow you to package up code for use later on.

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

Describe the parts of a functiondefinition.

A
thefunctionkeyword
anoptionalname
zero or moreparameters
acode block
anoptionalreturnstatement
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
32
Q

Describe the parts of a functioncall.

A

name of the function, parenthesis, arguments (if any)

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 functioncalland a functiondefinition?

A

function definition has a code block, parameters, and a possible return statement

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

What is the difference between aparameterand anargument?

A

A parameter is a place holder for the argument within a function. An argument represents the values being passed into the function.

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

Why are functionparametersuseful?

A

The are the placeholders for values passed into the function through arguments

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

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

A

The return statement ends function execution and specifies a value to be returned to the function caller.

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

What is a method?

A

Amethodis afunction which is apropertyof anobject

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

How is a method different from any other function?

A

no difference

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

How do you remove the last element from an array?

A

the pop method .pop()

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

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

A

Math.floor() rounds a number down

Math.trunc() chops decimal

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

How do you delete an element from an array?

A

.splice(start, deleteCount)

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

How do you append an element to an array?

A

.push()

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

How do you break a string up into an array?

A

.split()

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

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

A

No. console.log(originalString)

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

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

A

No (insert and example)

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

Give 6 examples of comparison operators.

A

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

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

What is the purpose of anifstatement?

A

So the code can perform actions or make decisions

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

Iselserequired in order to use anifstatement?

A

No

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

Describe the syntax (structure) of anifstatement.

A

if keyword followed by a condition followed { wrap a code block } and execute if that condition is true.

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

What are the three logical operators?

A

&& || !

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

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

A

logical and or logical or && ||

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

What is the purpose of a loop?

A

a repeated block of code happening under some condition

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

What is the purpose of aconditionexpression in a loop?

A

testing whether a condition is true or false, condition is the brakes. True it keeps going, false it stops.

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

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

A

how many times it will run, one iteration of the code at a time.

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

Whendoes theconditionexpression of awhileloop get evaluated?

A

Before the code block runs

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

Whendoes theinitializationexpression of aforloop get evaluated?

A

1st

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

Whendoes theconditionexpression of aforloop get evaluated?

A

Before each iteration

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

Whendoes thefinalexpression of aforloop get evaluated?

A

After each iteration and before the condition

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

Besides areturnstatement, which exits its entire function block, which keyword exits a loop before itsconditionexpression evaluates tofalse?

A

Break

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

What does the++increment operator do?

A

it adds 1 to the variable

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

How do you iterate through the keys of an object?

A

for in loop

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

why do we log things to the console?

A

As a debugger / to label and to create check marks

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

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

A

HTML

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

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

A

a data type object within javascript that we are using to access html

67
Q

What is a DOM Tree?

A

hierarchical representation an element and its children

68
Q

Give two examples ofdocumentmethods that retrieve a single element from the DOM.

A

getElementById (never use), querySelector()

69
Q

Give one example of adocumentmethod that retrieves multiple elements from the DOM at once.

A

.querySelectorAll()

70
Q

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

A

to access it multiple times

71
Q

Whatconsolemethod allows you to inspect the properties of a DOM element object?

A

console.dir()

72
Q

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

A

the html need to load on to the page first before accessing them via the DOM

73
Q

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

A

Argument is a string CSS selector, returns only the first of the matching elements in the DOM

74
Q

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

A

Argument string css selector and returns a nodelist all of the elements that match

75
Q

What is the purpose of events and event handling?

A

Event handling is creating code to respond to an event
Events are actions or occurrences that happen in the system you are programming, which the system tells you about so your code can react to them.

76
Q

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

A

No (ex there is 4 possible parameters in addEventListener and some are optional)

77
Q

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

A

addEventListener()

78
Q

What is a callback function?

A

it is a function being passed into another function as an argument

79
Q

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

A

the event parameter

80
Q

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

A

property on that event object whose value is where that element occurred in the DOM

81
Q

What is the difference between these two snippets of code?

  1. element.addEventListener(‘click’, handleClick)
  2. element.addEventListener(‘click’, handleClick())
A
  1. Handle click is being referenced to call it when the event is triggered.
  2. Handle Click function is being called immediately
82
Q

What is theclassNameproperty of element objects?

A

sets or gets the value of the class attribute of an element

83
Q

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

A

class name property

84
Q

What is thetextContentproperty of element objects?

A

the text data of the element

85
Q

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

A

the text content property

object.textContent

86
Q

Is theeventparameter of an event listener callback always useful?

A

No, not necessary but indicates we are using an event handler.

87
Q

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

A

Easier to keep it local than to seek it out in the DOM every time you need that information

88
Q

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

A

Focus

89
Q

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

A

Blur

90
Q

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

A

Input

91
Q

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

A

Submit

92
Q

What does theevent.preventDefault()method do?

A

prevents the default behavior for that event

93
Q

What does submitting a form withoutevent.preventDefault()do?

A

Refreshes the page

94
Q

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

A

Elements property

95
Q

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

A

Value

96
Q

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

A

Harder to figure out with what went wrong

97
Q

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

A

If anything goes wrong console will throw an error

98
Q

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

A

Nopers

99
Q

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

A

appendChild() or append() to pass multiple items at once

100
Q

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

A

attribute name and value

101
Q

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

A

query for parent element
create element new element, add attribute optional, append child
(call the method on the parent and the argument is the child)

102
Q

What is thetextContentproperty of an element object for?

A

adding text to an element, or checking see what the current text is

103
Q

Name two ways to set theclassattribute of a DOM element.

A

using the className properly or the setAttribute() method

104
Q

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

A

give a name to a process and you can reuse it.

105
Q

What is theevent.target?

A

a Dom element object representing the element where the event occurred

106
Q

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

A

Event Bubbling:

Event bubbling and capture are terms that describe phases in how the browser handles events targeted at nested elements.

107
Q

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

A

tagName (value is always all caps)

108
Q

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

A

A css selector as a string and traverses the Element and its parents (heading toward the document root) until it finds a node that matches the provided selector string. Will return itself or the matching ancestor. If no such element exists, it returns null.

109
Q

How can you remove an element from the DOM?

A

remove() method

110
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

Add the listener to the parent

111
Q

What is the affect of setting an element todisplay: none?

A

Turns off the display of an element so that it has no effect on layout (the document is rendered as though the element did not exist). All descendant elements also have their display turned off.

112
Q

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

A

Takes a css selector as a string and returns a boolean

113
Q

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

A

getAttribute( attribute name) method

114
Q

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

A

Every step

115
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

Make a new event handler for every tab. Document.querySelector for each specific tab

116
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

Separate conditional blocks for each view

117
Q

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

A

JSON.stringify()

118
Q

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

A

JSON.parse()

119
Q

What is JSON?

A

is a standard text-based format for representing structured data based on JavaScript object syntax

It is commonly used for transmitting data in web applications (e.g., sending some data from the server to the client, so it can be displayed on a web page, or vice versa).

120
Q

What are serialization and deserialization?

A

Serialization is a process of converting a javascript object into a stream of bytes so that it can be transferred over a network or stored. Deserialization is the opposite of that: extracting a data structure from a series of bytes.

Converting a string to a native object is called deserialization, while converting a native object to a string so it can be transmitted across the network is called serialization.

121
Q

Why are serialization and deserialization useful?

A

If you didn’t serialize the object into JSON, then the object would not be in a format that the consumer (the system who did the request) would understand. The purpose of serializing it into JSON is so that the message will be a format that can be understood and from there, deserialize it into an object type that makes sense for the consumer.

(e.g., sending some data from the server to the client, so it can be displayed on a web page, or vice versa).

122
Q

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

A

JSON.stringify()

123
Q

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

A

JSON.parse()

124
Q

How to you store data inlocalStorage?

A

localStorage.setItem()

125
Q

How to you retrieve data fromlocalStorage?

A

localStorage.getItem()

126
Q

What data type canlocalStoragesave in the browser?

A

keys and values

127
Q

When does the’beforeunload’event fire on thewindowobject?

A

Before the page unloads
This event enables a web page to trigger a confirmation dialog asking the user if they really want to leave the page. If the user confirms, the browser navigates to the new page, otherwise it cancels the navigation.

128
Q

What is thedefining characteristicof Object-Oriented Programming?

A

objects can contain both data (as properties) and behavior (as methods).

129
Q

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

A

Abstraction
Encapsulation
Inheritance
Polymorphism

130
Q

What is “abstraction”?

A

being able to work with (possibly) complex things in simple ways. (Simplifying a complex process)

131
Q

What does API stand for?

A

Application Programming Interface: the application is whatever you are building and there is a program that allows you to access data

132
Q

What is the purpose of an API?

A

a device or program enabling use to communicate with a computer.

133
Q

What isthisin JavaScript?

A

this refers to the object that the method is being called upon

134
Q

What does it mean to say thatthisis an “implicit parameter”?

A

its a parameter that we do not need to specify ourself

135
Q

Whenis the value ofthisdetermined in a function;call timeordefinition time?

A

call time

136
Q

What doesthisrefer 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!

137
Q
var character = {
  firstName: 'Mario',
  greet: function () {
    var message = 'It\'s-a-me, ' + this.firstName + '!';
    console.log(message);
  }
};

Given the abovecharacterobject, what is the result of the following code snippet? Why?

character.greet();

A

It’s a me Mario. Because the method is being called

138
Q
var character = {
  firstName: 'Mario',
  greet: function () {
    var message = 'It\'s-a-me, ' + this.firstName + '!';
    console.log(message);
  }
};
Given the abovecharacterobject, what is the result of the following code snippet? Why?
var hello = character.greet;
hello();
A

It’s a me, undefined. [ask Cody for better answer]

139
Q

How can you tell what the value ofthiswill be for a particular function or methoddefinition?

A

You can’t, this is nothing. This can only be defined when the function or method is called

140
Q

How can you tell what the value ofthisis for a particular function or methodcall?

A

The object to the left of the . if there is no dot its window.

141
Q

What kind of inheritance does the JavaScript programming language use?

A

Prototype-based inheritance

142
Q

What is a prototype in JavaScript?

A

its a mechanism built into javaScript which a is a generalized object can be cloned or extended

143
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

Because those methods are pulled from the prototype object

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 prototype object

145
Q

What does thenewoperator do?

A
  1. Creates a blank, plain JavaScript object.
  2. Adds a property to the new object (__proto__) that links to the constructor function’s prototype object
  3. Binds the newly created object instance as thethiscontext (i.e. all references tothisin the constructor function now refer
    to the object created in the first step).
  4. Returnsthisif the function doesn’t return an object
146
Q

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

A

prototype

147
Q

What does theinstanceofoperator do?

A

checks to see if the prototype property object is a creation of a constructor

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 thedocument, 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 thedelayparameter fromsetTimeout()orsetInterval()?

A

0ms

152
Q

What dosetTimeout()andsetInterval()return?

A

returns the timeoutID which is a positive integer value which identifies the timer created by the call to setTimeout() or setInterval()

153
Q

What is a client?

A

A service requester

154
Q

What is a server?

A

A provider of a resource or service

155
Q

Which HTTP method does a browser issue to a web server when you visit a URL?

A

GET

156
Q

What three things are on the start-line of an HTTPrequestmessage?

A
  1. An HTTP Method (GET, PUT or POST, etc) or a noun like (HEAD or Options) that describes the action to be preformed
  2. The request target, usually a URL
  3. The HTTP version, which defines the structure of the remaining message, acting as an indicator of the expected version to use for the response.
157
Q

What three things are on the start-line of an HTTPresponsemessage?

A
  1. Protocol version, usually HTTP/1.1
  2. A status code indicating success of failure of the request
  3. A status text a brief, purely informational, textual description of the status code to help a human understand the http message.
158
Q

hat are HTTP headers?

A

HTTP headerslet the client and the server pass additional information with an HTTP request or response.
(Meta data about an individual HTTP message)
Similar concept to the Head element in HTML

159
Q

Is a body required for a valid HTTP request or response message?

A

Its optional

160
Q

What is AJAX?

A

Ajax allows you to request data from a server and load it without having to refresh the entire page.

161
Q

What does the AJAX acronym stand for?

A

Asynchronous JavaScript And XML.

162
Q

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

A

XMLHttpRequest (XHR object)

163
Q

What event is fired byXMLHttpRequestobjects when they are finished loading the data from the server?

A

Load Event

164
Q

An XMLHttpRequestobject has anaddEventListener()method just like DOM elements. How is it possible that they both share this functionality?

A

They both share the same prototype