JavaScript Flashcards
1
Q
What is the purpose of variables?
A
to store data to use later on
2
Q
How do youdeclarea variable?
A
keyword like var let or const
3
Q
How do you initialize (assign a value to) a variable?
A
With the assignment operator =
4
Q
What characters are allowed in variable names?
A
underscore, $, letters (upper/lower) numbers
5
Q
What does it mean to say that variable names are “case sensitive”?
A
Having an uppercase letter will declare a different variable
6
Q
What is the purpose of a string?
A
To represent text, that is not code
7
Q
What is the purpose of a number?
A
to perform calculations
8
Q
What is the purpose of a boolean?
A
how we make decisions in code
to identify data as either true or false
9
Q
What does the=operator mean in JavaScript?
A
that you are assigning a value to a variable
10
Q
How do you update the value of a variable?
A
assign another value to it
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
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
13
Q
Give five examples of JavaScript primitives.
A
String, boolean, number, null, undefined
14
Q
What data type is returned by an arithmetic operation?
A
number
15
Q
What is string concatenation?
A
addition for strings
16
Q
What purpose(s) does the+plus operator serve in JavaScript?
A
addition (numbers) or concatenation (strings)
17
Q
What data type is returned by comparing two values (,===, etc)?
A
boolean
18
Q
What does the+=”plus-equals” operator do?
A
adds the assigned value to the variable
19
Q
What are objects used for?
A
Store data that are related
20
Q
What are object properties?
A
Variables within a group
21
Q
Describe object literal notation.
A
curly brackets properties and values
22
Q
How do you remove a property from an object?
A
Delete operator
23
Q
What are the two ways to get or update the value of a property?
A
dot notation and/or bracket notation
24
Q
what are arrays used for?
A
Store related content in a list
25
Describe array literal notation.
Square brackets, values separated by comma
26
How are arrays different from "plain" objects?
The way the data is accessed (arrays have index numbers)
numeric indexes, objects have alphanumeric indexes
Order: Arrays have order, objects do not
Brackets
27
What number represents the first index of an array?
0
28
What is the length property of an array?
array.length
| property that contains a true count of each piece of data
29
How do you calculate the last index of an array?
array.length - 1
30
What is a function in JavaScript?
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.
31
Describe the parts of a function definition.
```
the function keyword
an optional name
zero or more parameters
a code block
an optional return statement
```
32
Describe the parts of a function call.
name of the function, parenthesis, arguments (if any)
33
When comparing them side-by-side, what are the differences between a function call and a function definition?
function definition has a code block, parameters, and a possible return statement
34
What is the difference between a parameter and an argument?
A parameter is a place holder for the argument within a function. An argument represents the values being passed into the function.
35
Why are function parameters useful?
The are the placeholders for values passed into the function through arguments
36
What two effects does a return statement have on the behavior of a function?
The return statement ends function execution and specifies a value to be returned to the function caller.
37
What is a method?
A method is a function which is a property of an object
38
How is a method different from any other function?
no difference
39
How do you remove the last element from an array?
the pop method .pop()
40
How do you round a number down to the nearest integer?
Math.floor() rounds a number down
| Math.trunc() chops decimal
41
How do you generate a random number?
Math.random()
42
How do you delete an element from an array?
.splice(start, deleteCount)
43
How do you append an element to an array?
.push()
44
How do you break a string up into an array?
.split()
45
Do string methods change the original string? How would you check if you weren't sure?
No. console.log(originalString)
46
Is the return value of a function or method useful in every situation?
No (insert and example)
47
Give 6 examples of comparison operators.
=== !== > < >= <=
48
What data type do comparison expressions evaluate to?
Boolean
49
What is the purpose of an if statement?
So the code can perform actions or make decisions
50
Is else required in order to use an if statement?
No
51
Describe the syntax (structure) of an if statement.
if keyword followed by a condition followed { wrap a code block } and execute if that condition is true.
52
What are the three logical operators?
&& || !
53
How do you compare two different expressions in the same condition?
logical and or logical or && ||
54
What is the purpose of a loop?
a repeated block of code happening under some condition
55
What is the purpose of a condition expression in a loop?
testing whether a condition is true or false, condition is the brakes. True it keeps going, false it stops.
56
What does "iteration" mean in the context of loops?
how many times it will run, one iteration of the code at a time.
57
When does the condition expression of a while loop get evaluated?
Before the code block runs
58
When does the initialization expression of a for loop get evaluated?
1st
59
When does the condition expression of a for loop get evaluated?
Before each iteration
60
When does the final expression of a for loop get evaluated?
After each iteration and before the condition
61
Besides a return statement, which exits its entire function block, which keyword exits a loop before its condition expression evaluates to false?
Break
62
What does the ++ increment operator do?
it adds 1 to the variable
63
How do you iterate through the keys of an object?
for in loop
64
why do we log things to the console?
As a debugger / to label and to create check marks
65
Which "document" is being referred to in the phrase Document Object Model?
HTML
66
What is the word "object" referring to in the phrase Document Object Model?
a data type object within javascript that we are using to access html
67
What is a DOM Tree?
hierarchical representation an element and its children
68
Give two examples of document methods that retrieve a single element from the DOM.
getElementById (never use), querySelector()
69
Give one example of a document method that retrieves multiple elements from the DOM at once.
.querySelectorAll()
70
Why might you want to assign the return value of a DOM query to a variable?
to access it multiple times
71
What console method allows you to inspect the properties of a DOM element object?
console.dir()
72
Why would a script tag need to be placed at the bottom of the HTML content instead of at the top?
the html need to load on to the page first before accessing them via the DOM
73
What does document.querySelector() take as its argument and what does it return?
Argument is a string CSS selector, returns only the first of the matching elements in the DOM
74
What does document.querySelectorAll() take as its argument and what does it return?
Argument string css selector and returns a nodelist all of the elements that match
75
What is the purpose of events and event handling?
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
Are all possible parameters required to use a JavaScript method or function?
No (ex there is 4 possible parameters in addEventListener and some are optional)
77
What method of element objects lets you set up a function to be called when a specific type of event occurs?
addEventListener()
78
What is a callback function?
it is a function being passed into another function as an argument
79
What object is passed into an event listener callback when the event fires?
the event parameter
80
What is the event.target? If you weren't sure, how would you check? Where could you get more information about it?
property on that event object whose value is where that element occurred in the DOM
81
What is the difference between these two snippets of code?
1. element.addEventListener('click', handleClick)
2. element.addEventListener('click', handleClick())
1. Handle click is being referenced to call it when the event is triggered.
2. Handle Click function is being called immediately
82
What is the className property of element objects?
sets or gets the value of the class attribute of an element
83
How do you update the CSS class attribute of an element using JavaScript?
class name property
84
What is the textContent property of element objects?
the text data of the element
85
How do you update the text within an element using JavaScript?
the text content property
| object.textContent
86
Is the event parameter of an event listener callback always useful?
No, not necessary but indicates we are using an event handler.
87
Why is storing information about a program in variables better than only storing it in the DOM?
Easier to keep it local than to seek it out in the DOM every time you need that information
88
What event is fired when a user places their cursor in a form control?
Focus
89
What event is fired when a user's cursor leaves a form control?
Blur
90
What event is fired as a user changes the value of a form control?
Input
91
What event is fired when a user clicks the "submit" button within a form?
Submit
92
What does the event.preventDefault() method do?
prevents the default behavior for that event
93
What does submitting a form without event.preventDefault() do?
Refreshes the page
94
What property of a form element object contains all of the form's controls?
Elements property
95
What property of a form control object gets and sets its value?
Value
96
What is one risk of writing a lot of code without checking to see if it works so far?
Harder to figure out with what went wrong
97
What is an advantage of having your console open when writing a JavaScript program?
If anything goes wrong console will throw an error
98
Does the document.createElement() method insert a new element into the page?
Nopers
99
how do you add an element as a child to another element?
appendChild() or append() to pass multiple items at once
100
What do you pass as the arguments to the element.setAttribute() method?
attribute name and value
101
What steps do you need to take in order to insert a new element into the page?
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
What is the textContent property of an element object for?
adding text to an element, or checking see what the current text is
103
Name two ways to set the class attribute of a DOM element.
using the className properly or the setAttribute() method
104
What are two advantages of defining a function to do create something (like the work of creating a DOM tree)?
give a name to a process and you can reuse it.
105
What is the event.target?
a Dom element object representing the element where the event occurred
106
Why is it possible to listen for events on one element that actually happen its descendent elements?
Event Bubbling:
| Event bubbling and capture are terms that describe phases in how the browser handles events targeted at nested elements.
107
What DOM element property tells you what type of element it is?
tagName (value is always all caps)
108
What does the element.closest() method take as its argument and what does it return?
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
How can you remove an element from the DOM?
remove() method
110
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?
Add the listener to the parent
111
What is the affect of setting an element to display: none?
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
What does the element.matches() method take as an argument and what does it return?
Takes a css selector as a string and returns a boolean
113
How can you retrieve the value of an element's attribute?
getAttribute( attribute name) method
114
At what steps of the solution would it be helpful to log things to the console?
Every step
115
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?
Make a new event handler for every tab. Document.querySelector for each specific tab
116
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?
Separate conditional blocks for each view
117
How do you serialize a data structure into a JSON string using JavaScript?
JSON.stringify()
118
How do you deserialize a JSON string into a data structure using JavaScript?
JSON.parse()
119
What is JSON?
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
What are serialization and deserialization?
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
Why are serialization and deserialization useful?
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
How do you serialize a data structure into a JSON string using JavaScript?
JSON.stringify()
123
How do you deserialize a JSON string into a data structure using JavaScript?
JSON.parse()
124
How to you store data in localStorage?
localStorage.setItem()
125
How to you retrieve data from localStorage?
localStorage.getItem()
126
What data type can localStorage save in the browser?
keys and values
127
When does the 'beforeunload' event fire on the window object?
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
What is the defining characteristic of Object-Oriented Programming?
objects can contain both data (as properties) and behavior (as methods).
129
What are the four "principles" of Object-Oriented Programming?
Abstraction
Encapsulation
Inheritance
Polymorphism
130
What is “abstraction”?
being able to work with (possibly) complex things in simple ways. (Simplifying a complex process)
131
What does API stand for?
Application Programming Interface: the application is whatever you are building and there is a program that allows you to access data
132
What is the purpose of an API?
a device or program enabling use to communicate with a computer.
133
What is this in JavaScript?
this refers to the object that the method is being called upon
134
What does it mean to say that this is an "implicit parameter”?
its a parameter that we do not need to specify ourself
135
When is the value of this determined in a function; call time or definition time?
call time
136
What does this refer to in the following code snippet?
```
var character = {
firstName: 'Mario',
greet: function () {
var message = 'It\'s-a-me, ' + this.firstName + '!';
console.log(message);
}
};
```
nothing!
137
```
var character = {
firstName: 'Mario',
greet: function () {
var message = 'It\'s-a-me, ' + this.firstName + '!';
console.log(message);
}
};
```
Given the above character object, what is the result of the following code snippet? Why?
character.greet();
It’s a me Mario. Because the method is being called
138
```
var character = {
firstName: 'Mario',
greet: function () {
var message = 'It\'s-a-me, ' + this.firstName + '!';
console.log(message);
}
};
```
```
Given the above character object, what is the result of the following code snippet? Why?
var hello = character.greet;
hello();
```
It’s a me, undefined. [ask Cody for better answer]
139
How can you tell what the value of this will be for a particular function or method definition?
You can’t, this is nothing. This can only be defined when the function or method is called
140
How can you tell what the value of this is for a particular function or method call?
The object to the left of the . if there is no dot its window.
141
What kind of inheritance does the JavaScript programming language use?
Prototype-based inheritance
142
What is a prototype in JavaScript?
its a mechanism built into javaScript which a is a generalized object can be cloned or extended
143
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?
Because those methods are pulled from the prototype object
144
If an object does not have it's own property or method by a given key, where does JavaScript look for it?
In the prototype object
145
What does the new operator do?
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 the this context (i.e. all references to this in the constructor function now refer
to the object created in the first step).
4. Returns this if the function doesn't return an object
146
What property of JavaScript functions can store shared behavior for instances created with new?
prototype
147
What does the instanceof operator do?
checks to see if the prototype property object is a creation of a constructor
148
What is a "callback" function?
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
Besides adding an event listener callback function to an element or the document, what is one way to delay the execution of a JavaScript function until some point in the future?
setTimeout()
150
How can you set up a function to be called repeatedly without using a loop?
setInterval()
151
What is the default time delay if you omit the delay parameter from setTimeout() or setInterval()?
0ms
152
What do setTimeout() and setInterval() return?
returns the timeoutID which is a positive integer value which identifies the timer created by the call to setTimeout() or setInterval()
153
What is a client?
A service requester
154
What is a server?
A provider of a resource or service
155
Which HTTP method does a browser issue to a web server when you visit a URL?
GET
156
What three things are on the start-line of an HTTP request message?
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
What three things are on the start-line of an HTTP response message?
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
hat are HTTP headers?
HTTP headers let 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
Is a body required for a valid HTTP request or response message?
Its optional
160
What is AJAX?
Ajax allows you to request data from a server and load it without having to refresh the entire page.
161
What does the AJAX acronym stand for?
Asynchronous JavaScript And XML.
162
Which object is built into the browser for making HTTP requests in JavaScript?
XMLHttpRequest (XHR object)
163
What event is fired by XMLHttpRequest objects when they are finished loading the data from the server?
Load Event
164
An XMLHttpRequest object has an addEventListener() method just like DOM elements. How is it possible that they both share this functionality?
They both share the same prototype
