JavaScript Flashcards
1
Q
What is the purpose of variables?
A
to store information
2
Q
How do you declare a variable?
A
var name
3
Q
How do you initialize (assign a value to) a variable?
A
=
4
Q
What characters are allowed in variable names?
A
letters number _ $
cannot start with a number
5
Q
What does it mean to say that variable names are “case sensitive”?
A
letters have to match so the comp understands
6
Q
What is the purpose of a string?
A
to store word or sentences
7
Q
What is the purpose of a number?
A
to store numbers
8
Q
What is the purpose of a boolean?
A
true or false
9
Q
What does the = operator mean in JavaScript?
A
assigned
10
Q
How do you update the value of a variable?
A
the var name and assignment op then the new value
11
Q
What is the difference between null and undefined?
A
null means nothing. undefined means a variable has been declared but not defined yet.
12
Q
Why is it a good habit to include “labels” when you log values to the browser console?
A
to help with debugging and to see what your console is logging
13
Q
Give five examples of JavaScript primitives.
A
undefined , null , boolean , string and number
14
Q
What data type is returned by an arithmetic operation?
A
a number
15
Q
What is string concatenation?
A
to combine strings together
16
Q
What purpose(s) does the + plus operator serve in JavaScript?
A
adds values together
17
Q
What data type is returned by comparing two values (, ===, etc)?
A
a Boolean
18
Q
What does the += “plus-equals” operator do?
A
adds the value on the right, to the variable on the left, and then assigns that value back into the variable on the left.
19
Q
What are objects used for?
A
to holds multiple values..
they are used to model real world objects
20
Q
What are object properties?
A
a property is an association between a name (or key) and a value. A property’s value can be a function, in which case the property is known as a method
21
Q
Describe object literal notation.
A
var example = {
}
22
Q
How do you remove a property from an object?
A
delete keyword
23
Q
What are the two ways to get or update the value of a property?
A
bracket or dot notation
24
Q
What are arrays used for?
A
lets you store multiple values in a single variable.
25
Describe array literal notation.
var example = []
26
How are arrays different from "plain" objects?
arrays stores list
27
What number represents the first index of an array?
0
28
What is the length property of an array?
to see how many items are in the array
29
How do you calculate the last index of an array?
array.length - 1
30
What is a function in JavaScript?
a set of statements that performs a task or calculates a value
31
Describe the parts of a function definition
```
function functionName(parameter) {
}
```
32
Describe the parts of a function call.
function name(argument)
33
When comparing them side-by-side, what are the differences between a function call and a function definition?
function definition has to have the keyword and { }
call is just name and ()
34
Why are function parameters useful?
allows us to store data in it
35
What two effects does a return statement have on the behavior of a function?
ends function execution and specifies a value to be returned
36
Why do we log things to the console?
to see if its working proper, debugging
37
What is a method?
methods are actions that can be performed on objects.
a function on a obj
38
How is a method different from any other function?
a method is associated with an object
39
How do you remove the last element from an array?
array.pop()
40
How do you round a number down to the nearest integer?
floor() Method of math obj
41
How do you generate a random number?
random() of math obj
42
How do you delete an element from an array?
array.splice()
43
How do you append an element to an array?
push() and unshift() Method
44
How do you break a string up into an array?
split() method
45
Do string methods change the original string? How would you check if you weren't sure?
no return a new string. to check console.log()
46
Roughly how many string methods are there according to the MDN Web docs?
30
47
Is the return value of a function or method useful in every situation?
no
48
What three-letter acronym should you always include in your Google search about a JavaScript method or CSS property?
MDN
49
Give 6 examples of comparison operators.
=== , !==, > , < , <= , >=
Strictly equal, Strictly unequal, less than, greater than, less than or equal to , greater than or equal to
50
What data type do comparison expressions evaluate to?
booleans
51
What is the purpose of an if statement?
to evaluate or check a condition, to make a decision
52
Is else required in order to use an if statement?
no
53
Describe the syntax (structure) of an if statement.
if () {
| }
54
What are the three logical operators?
&& ,||, !
and , or , NOT
55
How do you compare two different expressions in the same condition?
with a logical operator
56
What is the purpose of a loop?
to do something repeatedly and as quickly as possible
57
What is the purpose of a condition expression in a loop?
to see if the code should run again
58
What does "iteration" mean in the context of loops?
the number of times it iterates
59
When does the initialization expression of a for loop get evaluated?
Runs before the first execution on the loop
60
When does the initialization expression of a for loop get evaluated?
it is the first thing ran
61
When does the final expression of a for loop get evaluated?
Expression that is run after every iteration
62
What does the ++ increment operator do?
adds 1
63
Besides a return statement, which exits its entire function block, which keyword exits a loop before its condition expression evaluates to false?
break keyword
64
What does the ++ increment operator do?
adds 1, assigns the new value to the original
65
How do you iterate through the keys of an object?
for in loop
66
Why do we log things to the console?
seeing the data and for debugging
67
What is a "model"?
a representation of something
68
Which "document" is being referred to in the phrase Document Object Model?
document node
69
What is the word "object" referring to in the phrase Document Object Model?
different parts of the page loaded in the browser
70
What is a DOM Tree?
all the pieces of the dom
71
Give two examples of document methods that retrieve a single element from the DOM.
getElementById , querySelector
72
Give one example of a document method that retrieves multiple elements from the DOM at once.
getElementByClassName
73
Why might you want to assign the return value of a DOM query to a variable?
reduces the amount of times to query the dom
74
What console method allows you to inspect the properties of a DOM element object?
console.dir()
75
Why would a tag need to be placed at the bottom of the HTML content instead of at the top?
because the broswer needs to analyze all the html before the js
76
What does document.querySelector() take as its argument and what does it return?
takes a vaild css selector
its returns An HTML Element object representing the first element in the document that matches the specified set of CSS selectors,
77
What does document.querySelectorAll() take as its argument and what does it return?
takes a vaild css selector
its returns a static (not live) NodeList representing a list of the document's elements that match the specified group of selectors.
78
Why do we log things to the console?
seeing the data and for debugging
79
What is the purpose of events and event handling?
to have different interactions
80
What do [] square brackets mean in function and method syntax documentation?
that its optional
81
What method of element objects lets you set up a function to be called when a specific type of event occurs?
addEventListener
82
What is a callback function?
a function passed into another function as an argument
83
What object is passed into an event listener callback when the event fires?
the event object
84
What is the event.target? If you weren't sure, how would you check? Where could you get more information about it?
event.target tells where the event started. check in the console.log, more info in mdn web docs
85
What is the difference between these two snippets of code?
with the parentheses the function would run as the
| page loads, instead of when the event fires
86
What is the className property of element objects?
sets the value of the class attribute of the specified element.
87
How do you update the CSS class attribute of an element using JavaScript?
example.className =
88
What is the textContent property of element objects?
allows us to get or set the text content
89
How do you update the text within an element using JavaScript?
example.textContent =
90
Is the event parameter of an event listener callback always useful?
no
91
Would this assignment be simpler or more complicated if we didn't use a variable to keep track of the number of clicks?
more complicated!
92
Why is storing information about a program in variables better than only storing it in the DOM?
alot more control in variables
93
What is the event.target?
to target of the element that you interacted with
94
Why is it possible to listen for events on one element that actually happen its descendent elements?
event bubbling
95
What DOM element property tells you what type of element it is?
tagName
96
What does the element.closest() method take as its argument and what does it return?
takes selectors as the argument and returns the closest ancestor of the selected element
97
How can you remove an element from the DOM?
node.remove();
98
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?
put the listener on the parent
99
What is the event.target?
to target of the element that you interacted with
100
What is the affect of setting an element to display: none?
its hides that element
101
What does the element.matches() method take as an argument and what does it return?
takes a selector and returns a boolean
102
How can you retrieve the value of an element's attribute?
getAttribute()
103
At what steps of the solution would it be helpful to log things to the console?
all the time
104
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?
event listeners for each tab and callback functions for those
105
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?
would have to manually do the checks
106
What is JSON?
json is a text-based data format following JavaScript object syntax. it allows different systems to exchange data
107
What are serialization and deserialization?
Serialization is turning an object into a stream of bytes so you can send it over the network.
Deserialization getting a stream of bytes and turning it into a obj
108
Why are serialization and deserialization useful?
allows us to commutate from different clients
109
How do you serialize a data structure into a JSON string using JavaScript?
JSON.stringify()
110
How do you deserialize a JSON string into a data structure using JavaScript?
JSON.parse()
111
How to you store data in localStorage?
localStorage.setItem
112
How to you retrieve data from localStorage?
localStorage.getItem
113
What data type can localStorage save in the browser?
JSON string data
114
When does the 'beforeunload' event fire on the window object?
before everything is unloaded
115
What is a code block? What are some examples of a code block?
a group of instructions. example if and for statements
116
What does block scope mean?
variables exist only within the corresponding block.
117
What is the scope of a variable declared with const or let?
block scope
118
What is the difference between let and const?
const cant change and let you can have a new value
119
Why is it possible to .push() a new value into a const variable that points to an Array?
you're not re-assigning or re-declaring
120
How should you decide on which type of declaration to use?
use const for everything if you cant use let
121
What is destructuring, conceptually?
short hand for accessing values quickly
122
What is the syntax for Object destructuring?
const { } = object
123
What is the syntax for Array destructuring?
const [ ] = array
124
How can you tell the difference between destructuring and creating Object/Array literals?
the location of the assignment operator
125
What is the syntax for writing a template literal?
let or const name = backtick ${variable} backtick;
126
What is "string interpolation"?
is replacing placeholders with values in a string literal
127
What is a method?
A method is a function which is a property of an object
128
How can you tell the difference between a method definition and a method call?
definition write outs the code block and the call actual uses it.
129
Describe method definition syntax (structure).
```
{
example: function(param1, param2, …) {
// function body
}
};
```
130
Describe method call syntax (structure).
object.example(arg1, arg2, ...)
| object['example'](arg1, arg2, ...)
131
How is a method different from any other function?
it is a property of a object
132
What is the defining characteristic of Object-Oriented Programming?
encapsulation, grouping everything together in one place
133
What are the four "principles" of Object-Oriented Programming?
Abstraction, Encapsulation, Inheritance, Polymorphism
134
What is "abstraction"?
simplifying complicated things
135
What does API stand for?
application programming interface
136
What is the purpose of an API?
allows developers to create complex functionality more easily. allows apps to interact with eachother
137
What is this in JavaScript?
represents the scope of the object or whatever its in
138
What does it mean to say that this is an "implicit parameter"?
meaning that it is available in a function's code block even though it was never included in the function's parameter list or declared with var
139
When is the value of this determined in a function; call time or definition time?
call time
140
What does this refer to in the following code snippet?
character object
141
Given the above character object, what is the result of the following code snippet? Why?
It's-a-me, mario!
142
Given the above character object, what is the result of the following code snippet? Why?
It's-a-me, undefined !,
143
How can you tell what the value of this will be for a particular function or method definition?
you cant tell what its going to be
144
How can you tell what the value of this is for a particular function or method call?
you dont know forsure because it can be changed
145
What kind of inheritance does the JavaScript programming language use?
In JavaScript, inheritance is supported by using prototype object.
prototypal inheritance
146
What is a prototype in JavaScript?
The prototype is an object that is associated with every functions and objects by default in JavaScript
147
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?
it inherited the method to the prototype
148
If an object does not have it's own property or method by a given key, where does JavaScript look for it?
it looks at it prototype
149
What is a client?
a computer or a program that relies on sending a request to another program, hardware or software that accesses a service made available by a server
150
What is a server?
a hardware or software that provides functionality for other programs or devices
151
Which HTTP method does a browser issue to a web server when you visit a URL?
GET
152
What three things are on the start-line of an HTTP request message?
HTTP method, the request target and HTTP version
153
What three things are on the start-line of an HTTP response message?
The protocol version, A status code, and a status text
154
What are HTTP headers?
HTTP headers let the client and the server pass additional information with an HTTP request or response
155
Where would you go if you wanted to learn more about a specific HTTP Header?
MDN web docs
156
Is a body required for a valid HTTP request or response message?
no
157
What is AJAX?
Ajax allows you to request
data from a server and
load it without having to
refresh the entire page
it is the use of the XMLHttpRequest object to communicate with servers. It can send and receive information in various formats, including JSON, XML, HTML, and text files
158
What does the AJAX acronym stand for?
Asynchronous JavaScript And XML
159
Which object is built into the browser for making HTTP requests in JavaScript?
XMLHttpRequest
160
What event is fired by XMLHttpRequest objects when they are finished loading the data from the server?
load
161
An XMLHttpRequest object has an addEventListener() method just like DOM elements. How is it possible that they both share this functionality?
they both inherent from event target
162
What is Node.js?
Node.js is a program that allows JavaScript to be run outside of a web browser. Node.js is an open-source, cross-platform, back-end JavaScript runtime environment that runs on the V8 engine and executes JavaScript code outside a web browser.
163
What can Node.js be used for?
It is commonly used to build back ends for Web applications, command-line programs, or any kind of automation that developers wish to perform
164
What is a REPL?
Read–eval–print loop
165
When was Node.js created?
May 27, 2009
166
What back end languages have you heard of?
php , python, java
167
What is a JavaScript module?
a single .js file
168
What values are passed into a Node.js module's local scope?
its pulls the raw files and puts into a file
169
Give two examples of truly global variables in a Node.js program.
class abortcontrol , setTimeout , setInterval
170
What is the purpose of module.exports in a Node.js module?
it tells Node.js which code to “export” from a file so other files are allowed to access the exported code.
171
How do you import functionality into a Node.js module from another Node.js module?
require()
172
What is the JavaScript Event Loop?
its responsible for executing the code, collecting and processing events, and executing queued sub-tasks
173
What is different between "blocking" and "non-blocking" with respect to how code is executed?
Blocking block operations until that operation finishes and non-blocking doesn't prevent other things from happening.
174
What is a computer process?
computer program that is being executed by one or many threads
175
Roughly how many computer processes are running on your host operating system
155
176
Why should a full stack Web developer know that computer processes exist?
to see if the server is still running and to kill the process
177
What is the process object in a Node.js program?
a global that provides information about, and control over, the current Node.js process
178
How do you access the process object in a Node.js program?
console.log
179
What is the data type of process.argv in Node.js?
array
180
What is NPM?
packaging manager, share library code
developers use npm to share and borrow packages, and many organizations use npm to manage private development as well.
181
What is a package?
Node modules, or contain Node modules
to store a bunch of code into one chunk
182
How can you create a package.json with npm?
npm init
183
What is a dependency and how to you add one to a package?
source code you didn't write but it depends on it
Packages required by your application in production.
npm install
184
What happens when you add a dependency to a package with npm?
that package gets installed into node_modules
185
How do you add express to your package dependencies?
npm install express
186
What Express application method starts the server and binds it to a network PORT?
listen()
187
How do you mount a middleware with an Express application?
.use()
188
Which objects does an Express application pass to your middleware to manage the request/response lifecycle of the server?
application/json
application/javascript
text/html
text/css
189
What event is fired when a user places their cursor in a form control?
'focus'
190
What event is fired when a user's cursor leaves a form control?
'blur'
191
What event is fired as a user changes the value of a form control?
'input'
192
What event is fired when a user clicks the "submit" button within a ?
submit
193
What does the event.preventDefault() method do?
method cancels the event if it is cancelable, meaning that the default action that belongs to the event will not occur.
194
What does submitting a form without event.preventDefault() do?
it doesnt save
195
What property of a form element object contains all of the form's controls.
elements property
196
What property of form a control object gets and sets its value?
value property
197
What is one risk of writing a lot of code without checking to see if it works so far?
you dont know if it works
198
What is an advantage of having your console open when writing a JavaScript program?
you can see if theres any error
199
Does the document.createElement() method insert a new element into the page?
no
200
How do you add an element as a child to another element?
appendchild()
201
What do you pass as the arguments to the element.setAttribute() method?
first the attribute then the value
202
What steps do you need to take in order to insert a new element into the page?
createElement
textNode
appendChild
203
What is the textContent property of an element object for?
to set the element's text content
204
Name two ways to set the class attribute of a DOM element.
setAttribute and .className
205
What are two advantages of defining a function to do create something (like the work of creating a DOM tree)?
its reusable
206
What does the new operator do?
Creates a blank, plain JavaScript object.
Adds a property to the new object (__proto__) that links to the constructor function's prototype object
Binds the newly created object instance as the this context
Returns this if the function doesn't return an object.
207
What property of JavaScript functions can store shared behavior for instances created with new?
prototype property
208
What does the instanceof operator do?
tests to see if the prototype property of a constructor appears anywhere in the prototype chain of an object. The return value is a boolean value.
209
What is a "callback" function?
a function passed into another function as an argument to perform a action
210
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()
211
How can you set up a function to be called repeatedly without using a loop?
setInterval()
212
What is the default time delay if you omit the delay parameter from setTimeout() or setInterval()?
0
213
What do setTimeout() and setInterval() return?
a timer id
214
What is a CLI?
command-line interfaces.
215
What is a GUI?
graphical user interface
216
What are the three virtues of a great programmer?
laziness, impatience, and hubris
217
What is a JavaScript module?
a file
218
What values are passed into a Node.js module's local scope?
exports, require, module, __filename, and __dirname
219
Give two examples of truly global variables in a Node.js program.
process , settimeout
220
What is the purpose of module.exports in a Node.js module?
Module exports are the instruction that tells Node.js which bits of code (functions, objects, strings, etc.) to “export” from a given file so other files are allowed to access the exported code
221
How do you import functionality into a Node.js module from another Node.js module?
require()
222
What is a directory?
a collection of files typically created for organizational purposes.
223
What is a relative file path?
Relative paths do not start with / and point to a location relative to the document that the path reference is made in.
224
What is an absolute file path?
Absolute paths start with / and point to the root of your site. A URL is a prime example of an absolute path.
225
What module does Node.js include for manipulating the file system?
FS
226
What method is available in the Node.js fs module for writing data to a file?
fs.writeFile
227
Are file operations using the fs module synchronous or asynchronous?
asynchronous
228
What does the express.json() middleware do and when would you need it?
middleware will json parse it
229
What are the three states a Promise can be in?
pending
fulfilled
rejected
230
How do you handle the fulfillment of a Promise?
.then
231
How do you handle the rejection of a Promise?
.catch
232
What is Array.prototype.filter useful for?
working with a filter subset of data
good with quick search
233
What is Array.prototype.map useful for?
to simplify your code.
to take raw data and format it.
Extracting values from an array of object.
234
What is Array.prototype.reduce useful for?
to take a array of values and reduce it to a single value
get a single value
235
What is "syntactic sugar"?
syntax within a programming language that is designed to make things easier to read or to express. It makes the language "sweeter" for human use: things can be expressed more clearly, more concisely, or in an alternative style that some may prefer.
236
What is the typeof an ES6 class?
obj
237
Describe ES6 class syntax.
```
class name {
constructor(x, y) {
this
}
}
```
238
What is "refactoring"?
is the process of restructuring existing computer code—changing the factoring—without changing its external behavior.
239
What is Webpack?
It's a tool that lets you bundle your JavaScript applications
240
How do you add a devDependency to a package?
--save-dev
241
What is an NPM script?
An npm script is a convenient way to bundle common shell commands for your project. They are typically commands, or a string of commands, which would normally be entered at the command line in order to do something with your application. Scripts are stored in a project's package
242
How do you execute Webpack with npm run?
npm run build
243
What is React?
React is a JavaScript library for creating user interfaces
244
What is a React element?
An element is a plain object describing a component instance or DOM node and its desired properties
245
How do you mount a React element to the DOM?
ReactDOM.render()
246
What is Babel?
toolchain that is mainly used to convert ECMAScript 2015+ code into a backwards compatible version of JavaScript in current and older browsers or environments
247
What is a Plug-in?
a software component that adds a specific feature to an existing computer program.
248
What is a Webpack loader?
They allow you to pre-process files as you import or “load” them
249
How can you make Babel and Webpack work together?
Babel Loader
250
What is JSX?
JavaScript XML is a form of markup that allows us to write HTML in React by converting HTML tags into React elements.
251
Why must the React object be imported when authoring JSX in a module?
it will be undefined and the createElement call will fail.
252
How can you make Webpack and Babel work together to convert JSX into valid JavaScript?
@babel/plugin-transform-react-jsx
253
What is a React component?
JavaScript functions. They accept arbitrary inputs (called “props”) and return React elements describing what should appear on the screen.
describes a piece of our UI
254
How do you define a function component in React?
must start with cap letter
255
How do you mount a component to the DOM?
ReactDOM.render
256
What are props in React?
properties
arguments passed into components
257
How do you pass props to a component?
key value pairs
use the prop name and a value
258
How do you write JavaScript expressions in JSX?
inside curly braces
259
How do you create "class" component in React?
class Example extends React.Component
260
How do you access props in a class component?
this.props
261
What is the purpose of state in React?
to update the element, gives us control over the component
262
How to you pass an event handler to a React element?
onClick={this.handleClick}
do it as a attribute
263
What are controlled components?
An input form element whose value is controlled by React
264
What two props must you pass to an input for it to be "controlled"?
a value and an onChange
265
What Array method is commonly used to create a list of React elements?
map
266
What is the best value to use as a "key" prop when rendering lists?
IDs from your data as keys
makes react do less work for the same outcome
267
What does express.static() return?
exposes a directory or a file to a particular URL so it's contents can be publicly accessed.
returns a function
268
What is the local __dirname variable in a Node.js module?
The directory name of the current module
absolute path
269
What does the join() method of Node's path module do?
Joins several segments into one path
270
What does fetch() return?
a Promise that you can use to retrieve the response of the request.
271
What is the default request method used by fetch()?
GET
272
How do you specify the request method (GET, POST, etc.) when calling fetch?
method: "POST" or whatever you need
273
When does React call a component's componentDidMount method?
invoked immediately after a component is mounted
274
Name three React.Component lifecycle methods.
constructor, render, componentdidupdate
275
How do you pass data to a child component?
props
