JAVASCRIPT Flashcards

1
Q

What is the purpose of variables?

A

the purpose of variables is to not lose track of the variable in your code

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

How do you declare a variable?

A

with the var keyword

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 = opertor

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

$, _,

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

if you have a variable with a capital S and lower case s they are different

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 have a number of letters to make up something

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

the prupose of a number is to hold a numeric value.

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

to determine 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

it is the assignment operator

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

How do you update the value of a variable?

A

variable name = and then the value you want to give it

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 done intentioanlly and undefined is not

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

Why is it a good habit to include “labels” when you log values to the browser console?

A

so you know what data is being output and you can keep track of what you are logging

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, undefined, null, array object

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

numeric data type

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

What is string concatenation?

A

the joining of one strring and another string to make a whole 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

it allows us to add strings or numerical values together

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 and assigns new value to current value

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

What are objects used for?

A

a data type that allows you to store data in indivisual keys

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

What are object properties?

A

indivisual keys that hold a value

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

Describe object literal notation.

A
var hello = {
}
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 object.property

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

. notation and 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

arrays are used to store multiple values of data kind of like a shopping list

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

Describe array literal notation.

A

[ ]

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

array hold and index and object do not

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 length property stores values and lets a use know the length of an an 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

subtract 1 from the length of the array

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 statments that perform tasks to calculate a value

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

function defention, keyword, parameter lsit

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

function name ()

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 call uses function name with () and any argument 
defention has a function keyword and  code block()
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
34
Q

What is the difference between a parameter and an argument?

A

a paremeter holds a place so that you can add whatever argument you want later.

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

Why are function parameters useful?

A

Function parameters are useful because they act as placeholders for data.

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

a return statement stops the code once the return statement has been executed.

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

Why do we log things to the console?

A

to see what the output is that we are getting

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

What is a method?

A

a function which is a property of an object

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

How is a method different from any other function?

A

A method, like a function, is a set of instructions that perform a task. The difference is that a method is associated with an object, while a function is not.

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

How do you remove the last element from an array?

A

.pop()

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

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

A

Math.floor()

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

How do you generate a random number?

A

Math.random()

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

How do you delete an element from an array?

A

.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

.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

.split( )

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

All string methods return a new string. They don’t modify the original string. F

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

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

A

80-85

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

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

A

40-50

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

Give 6 examples of comparison operators.

A
> 
< 
>=
<=
===
!
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
52
Q

What data type do comparison expressions evaluate to?

A

true or false

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

What is the purpose of an if statement?

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

Describe the syntax (structure) of an if statement.

A

if( ){

}

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

What are the three logical operators?

A

logical and &&
logical or ||
logical not !

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

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

A

logical and logical or operator

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

What is the purpose of a loop?

A

the purpose of a loop is to run something several times until a condition is met

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

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

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

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

A

it is the repetition of a process

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

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

A

second after the initializtion

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

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

A

when the loop starts.

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

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

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

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

A

after the code block runs and before the condition runs again

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

Besides a return statement, which exits its entire function block, which keyword exits a loop before its condition expression evaluates to false?

A

break

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

What does the ++ increment operator do?

A

the increment operator increments a value

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

How do you iterate through the keys of an object?

A

The Object. keys() method was introduced in ES6. It takes the object that you want to iterate over as an argument and returns an array containing all properties names (or keys)

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

Why do we log things to the console?

A

we log things to the console to see what the output is

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

What is a “model”?

A

a model is a piece that is a replica of something else

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

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

A

HTML document

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

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

A

the nodes

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

What is a DOM Tree?

A

Document object model that stores parent elements and their children elements

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

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

A

document. querySelector()

document. getElementById()

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

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

A

document.querySelectorAll()

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

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

A

So that you can document it again

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

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

A

the dir. direcotry method

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

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

A

So that we can let the document know that we are going to include javascript

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

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

A

css selector and returns the first element with that selector

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

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

A

csss selector and it returns all elements that have the id selectors

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

What is the className property of element objects?

A

The className property of the Element interface gets and sets the value of the class attribute of the specified element.

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

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

A

setAttribute()

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

What is the textContent property of element objects?

A

The textContent property sets or returns the text content of the specified node, and all its descendants.

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

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

A

using the document.querySelector(‘ ).textcontent

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

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

A

no it is not

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

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

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

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

What does the transform property do?

A

the transform property lets you move the element around in differne ways

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

Give four examples of CSS transform functions.

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

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

A

the focus event

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

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

A

the blur event

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

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

A

the input event

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

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

A

submit event

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

What does the event.preventDefault() method do?

A

it stops the default method from happening

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

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

A

The preventDefault() method cancels the event if it is cancelable, meaning that the default action that belongs to the event will not occur

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

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

A

form

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

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

A

.value gets and sets property of a form control

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

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

A

You can not see where you messed up and it is harder to find where you made a mistake

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

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

A

You can see where there is an error as it happens

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

Give two examples of media features that you can query in an @media rule.

A

min-width max-width

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

Which HTML meta tag is used in mobile-responsive web pages?

A

viewport

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

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

A

no it does not

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

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

A

with the appendChild() method

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

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

A

we pass the classname or attributes we want to include on that element

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

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

A

document.createElementById(‘div”)

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

What is the textContent property of an element object for?

A

we can use it to set and change the text of an element from the DOM

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

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

A

setAttribute and .className

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

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

A

we ca go back and re use the data for other situations

108
Q

The transition property is shorthand for which four CSS properties?

A

transition-property
transition-duration
transition-timing-function
transition-delay

109
Q

What is the event.target?

A

The event.target property can be used in order to implement event delegation.

110
Q

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

A

Event delegation

111
Q

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

A

tagName

112
Q

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

A

The closest() method 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.

113
Q

How can you remove an element from the DOM?

A

you can use the removechild() method

114
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

you would add an event listener to the parent object and it would apply to its children

115
Q

What kind of inheritance does the javascript programming language use?

A

prototypal inheritance

116
Q

What is a prototype in Javascript?

A

prototype is an object that is associated with every functions and objects by default

//object that other objects are allowed to build upon//

117
Q

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

A

by using methods in the prototype object

118
Q

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

A

prototype. if it cannot find that property it goes to what it was built upon

119
Q

What is this in JavaScript?

A

an object.

120
Q

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

A

it is available in a function code block even though it was never defined or declared

121
Q

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

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

Call time

122
Q

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

A

call time

123
Q

Given the above character object, what is the result of the following code snippet? Why?
character.greet();

A

function it is me a mario

124
Q
Given the above character object, what is the result of the following code snippet? Why?
var hello = character.greet;
hello()
A

the function its. a me mario becaue it is calling the function and that function is pointing to the message

125
Q

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

A

you have to have the method being called

the value to the left of the dot determines what it is

126
Q

What does the new operator do?

A

The new keyword does the following things:

  • 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 (i.e. all references to this in the constructor function now refer to the object created in the first step).
  • Returns this if the function doesn’t return an object.
127
Q

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

A

prototype property

128
Q

What does the instanceof operator do?

A

instanceof is a binary operator used to test if an object is of a given type.

129
Q

What is a “callback” function?

A

a fucntion being passed around as a value

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

131
Q

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

A

you can use the set interval methd

132
Q

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

A

0 milliseonds

133
Q

What do setTimeout() and setInterval() return?

A

numeric non interval value

numeric value is id for that interval

134
Q

what is a client?

A

piece of hardware or software that accesses a servie made availabe by a server

135
Q

What does the sort() method do?

A

The Array.sort() method sorts the elements of an array.

136
Q

Reversing an array using which method?

A

he Array.reverse() method reverses the order.

137
Q

Splice() method and its parameters

A

splice(start)
splice(start, deleteCount)
splice(start, deleteCount, item1)
splice(start, deleteCount, item1, item2, itemN)

138
Q

What does the setTimeOut() function do and how many times does it run

A

The setTimeout() function executes a code block after a specified amount of time (in milliseconds) and is only executed once.

139
Q

endsWith() method

A

check to see iif a string ends with a specific ending

140
Q

algorithm challenges

A
function confirmEnding(str, target) {
  return str.slice(str.length - target.length) === target
}

confirmEnding(“Bastian”, “n”);

mutation algorithm  to see if the first element has all letters in the second as well:
function mutation(arr) {
   let test = arr[1].toLowerCase();
  let target = arr[0].toLowerCase();
  for(var i = 0; i < test.length; i++){
    if(target.indexOf(test[i]) < 0){
      return false
    }
  }
  return true
}

mutation([“hello”, “hey”]);

141
Q

what does the slice methoid take as its pareemers

A

string.slice(start, end)

142
Q

Matching single Chracters not specified using regular expressions

A

use the up carrot for chracters you do not want to match

etc. /[^aeiou]/gi

143
Q

ternary operator syntax

A

condition ? exprIfTrue : exprIfFalse

144
Q

hasOwnProperty() method

A

check if an object has a specific property

145
Q

Object.keys()

A

This will return the properties in the object it receives as an argument

146
Q

Object.keys()

A

This will return the properties in the object it receives as an argument

147
Q

spinal tap algrotihm using regex

A
function spinalCase(str) {
    var regex = /\s+|_+/g;

str= str.replace(/([a-z])([A-Z])/g, ‘$1 $2’)
return str.replace(regex, “-“).toLowerCase();

}

spinalCase(‘This Is Spinal Tap’);

148
Q

What is the difference between an ordered list and an unordered list in HTML?

A

An unorderd list is not numbers and an ordered List is numbered

149
Q

Is an HTML list a block element or an inline element?

A

An HTML list is a block element

150
Q

The Math.max() function returns the largest of the zero or more numbers given as input parameters, or NaN if any parameter isn’t a number and can’t be converted into one.

A
151
Q

The Math.random() function returns a floating-point, pseudo-random number in the range 0 to less than 1 (inclusive of 0, but not 1) with approximately uniform distribution over that range — which you can then scale to your desired range. The implementation selects the initial seed to the random number generation algorithm; it cannot be chosen or reset by the user.

A
152
Q

The splice() method changes the contents of an array by removing or replacing existing elements and/or adding new elements in place. To access part of an array without modifying it, see slice().

A
153
Q

The split() method divides a String into an ordered list of substrings, puts these substrings into an array, and returns the array. The division is done by searching for a pattern; where the pattern is provided as the first parameter in the method’s call.

A
154
Q

If you want to check a method then look at MDN Documentation for all methods

A
155
Q

for ([initialization]; [condition]; [final-expression])

statement

A
156
Q

DOM QUERYING QUIZ

A
157
Q

Why do we log things to the console?

A

So we know what is being output in the console

158
Q

What is a “model”?

A

a model is a piece that is a replica of something else

159
Q

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

A

HTML DOCUMENT

160
Q

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

A

the nodes

161
Q

What is a DOM Tree?

A

Document object model that stores parent elements and their children elements

162
Q

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

A

document.QuerySelector()

and document.getElementById()

163
Q

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

A

document.querySelectorAll()

164
Q

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

A

So you can use it in your code later

165
Q

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

A

the dir. direcotry method

166
Q

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

A

because javascript is read last in the html document

167
Q

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

A

css selector and returns the first element with that selector

168
Q

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

A

csss selector and it returns all elements that have the id selectors

169
Q

DOM EVENTS QUIZ

A
170
Q

Why do we log things to the console?

A

So we know what the output is

171
Q

What is the purpose of events and event handling?

A

to do a specific task when the user interacts within elements on the page

an event is some occurence that happens onn the page and handling is the steps we take

172
Q

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

A

no because we do not alway use parameers

173
Q

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

A

event listener

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

175
Q

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

A

the event object

176
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 read-only target property of the Event interface is a reference to the object onto which the event was dispatched. It is different from Event.currentTarget when the event handler is called during the bubbling or capturing phase of the event.
You would check in the console to see what the target is

MDN

177
Q

What is the difference between these two snippets of code?

A

one is calling the function within the argumebt abd tghe other is not

178
Q

What is the className property of element objects?

A

The className property The className property of the Element interface gets and sets the value of the class attribute of the specified element.

179
Q

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

A

You update the class with the className property

180
Q

What is the textContent property of element objects?

A

the text content property sets the new text to the element it was assigned to

it is also a getter and setter

181
Q

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

A

textContent property

182
Q

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

A

no it is not

183
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

it would be more complicated because we would not know how many times the user clicked and therefore we would be lost

184
Q

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

A

because we can always use that variable for something else if we need to change or update values

185
Q

What does the transform property do?

A

The transform CSS property lets you rotate, scale, skew, or translate an element. It modifies the coordinate space of the CSS visual formatting model.

186
Q

give four examples of tranforms functions

A

Skale, rotate, skew, translate

187
Q

The css transiitons property is shorthand for

A

The transition CSS property is a shorthand property for transition-property, transition-duration, transition-timing-function, and transition-delay.

188
Q

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

A

focus event

189
Q

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

A

blur event

190
Q

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

A

input event

191
Q

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

A

submit event

192
Q

What does the event.preventDefault() method do?

A

it stops the default method from happening

193
Q

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

A

The preventDefault() method cancels the event if it is cancelable, meaning that the default action that belongs to the event will not occur

194
Q

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

A

elements property

195
Q

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

A

.value gets and sets property of a form control

196
Q

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

A

You will not see where the error is and it willl be harder to adjust your code based on the error

197
Q

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

A

You can see if there are any errors right away before you proceed with writing more code

198
Q

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

A

no it doesnt

199
Q

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

A

appendChild() method

200
Q

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

A

name and value

201
Q

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

A

create the element
give it text content
attributes if its needed
append somewhere

202
Q

What is the textContent property of an element object for?

A

it gets and sets the textContent of an element

203
Q

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

A

set Attribute and className and classList

204
Q

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

A

we ca go back and re use the data for other situations
can find errors easily
lets your code be easier to navigate

205
Q

Give two examples of media features that you can query in an @media rule.

A

min width and max width

206
Q

Which HTML meta tag is used in mobile-responsive web pages?

A

viewport

207
Q

What is event.target?

A

The read-only target property of the Event interface is a reference to the object onto which the event was dispatched.

The element that was interacted with

208
Q

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

A

because bubbling which will bubble up to the parent

event delegation

209
Q

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

A

event.target.tagName

210
Q

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

A

selectors
A string of valid CSS selector to match the Element and its ancestors against.

Return value
The closest ancestor Element or itself, which matches the selectors. If there are no such element, null.

211
Q

How can you remove an element from the DOM?

A

remove method

212
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 it to the parent element

The parent will catch anything that bubbles up

213
Q

What is event.target

A

The element that was interacted with

214
Q

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

A

the affected element will dissapear

removes it from document flow

215
Q

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

A

takes a css selector and returns a boolean to determine if it matches that selector

216
Q

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

A

getAttribute method

217
Q

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

A

once you start writing the function and adding a for loop also to check if event,target matches the right event

218
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

you would have a lot of event listeners

219
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

a lot of if else statements

and or conditional blocks

220
Q

What is a breakpoint in responsive Web design?

A

The points at which a media query is introduced are known as breakpoints.

221
Q

What is the advantage of using a percentage (e.g. 50%) width instead of a fixed (e.g. px) width for a “column” class in a responsive layout?

A

The advantage would be that not all screens are the same size so if you have a widtch set to 50% then it would be 50% of that screen rather than having a fixed pixel and not all screens have the same pixel size

222
Q

If you introduce CSS rules for a smaller min-width after the styles for a larger min-width in your style sheet, the CSS rules for the smaller min-width will “win”. Why is that?

A

This is due to the order of which they were put in

css cascade
source order

223
Q

What is JSON?

A

JSON is a text-based data format following JavaScript object syntax

224
Q

What are serialization and deserialization?

A

Serialization is the process of turning an object in memory into a stream of bytes so you can do stuff like store it on disk or send it over the network.

Deserialization is the reverse process: turning a stream of bytes into an object in memory.

225
Q

Why are serialization and deserialization useful?

A

Allows you to send data and convert that data into a series of bytes when you receive it

226
Q

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

A

JSON.stringify

227
Q

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

A

JSON.parse

228
Q

How to convert a array or object to a string

A

JSON.stringify(value)

229
Q

How do you store data in localStorage?

A

localStorage.setItem method

230
Q

How do you retrieve data from localStorage?

A

getItem method

231
Q

What data type can localStorage save in the browser?

A

JSON strings

232
Q

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

A

When the window and document are about to be unloaded

233
Q

What is a method?
How can you tell the difference between a method definition and a method call?
Describe method definition syntax (structure).

Describe method call syntax (structure).
How is a method different from any other function?
What is the defining characteristic of Object-Oriented Programming?
What are the four “principles” of Object-Oriented Programming?
What is “abstraction”?
What does API stand for?
What is the purpose of an API

A
  1. A method is a function which is a property of an object.
  2. A method definition while a method call is attached to an object
  3. method name and parenthesis ()

4.type the method name attached to its objects
5 A method is attached to an object while any other function is not
6. Objects can contain both data (as properties) and behavior (as methods).
7. Abstraction
Encapsulation
Inheritance
Polymorphism
8 being able to work with (possibly) complex things in simple ways.
9 application programming interface (API)
10.is to give programmers a way to interact with a system in a simplified, consistent fashion: aka, an abstraction.

234
Q

What is this in javascript?

A

this is an implicit parameter of all JavaScript functions.

235
Q

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

A

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

236
Q

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

A

when the function is called

237
Q

What does this refer to in this code snippet?

A

the character object

238
Q

Given the above character object, what is the result of the following code snippet? Why?
character.greet();

A

Its a me mario

239
Q
Given the above character object, what is the result of the following code snippet? Why?
var hello = character.greet;
hello();
A

its a me undefined because there is no character object assigned to it

240
Q

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

A

if there is no value to the left of the dot when the function is called, then by default, this will be the global window object.

241
Q

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

A

if you cannot see the function being called, then you do not know what the value of this will be.

242
Q

Object.setPrototypeOf(obj, prototype)

A

Object.setPrototypeOf(obj, prototype)

243
Q

What kind of inheritance does the JavaScript programming language use?

A

prototypal based inheritence

244
Q

What is a prototype in JavaScript?

A

an original model on which something is patterned

245
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

protoype

246
Q

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

A

prototype chain

247
Q

What does the new operator do?

A

The new operator lets developers create an instance of a user-defined object type or of one of the built-in object types that has a constructor function.

  1. Creates a blank, plain JavaScript object. For convenience, let’s call it newInstance.
  2. Points newInstance’s [[Prototype]] to the constructor function’s prototype property.
  3. Executes the constructor function with the given arguments, binding newInstance as the this context (i.e. all references to this in the constructor function now refer to newInstance).
  4. If the constructor function returns a non-primitive, this return value becomes the result of the whole new expression. Otherwise, if the constructor function doesn’t return anything or returns a primitive, newInstance is returned instead. (Normally constructors don’t return a value, but they can choose to do so to override the normal object creation process.)
248
Q

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

A

prototype property

249
Q

What does the instanceof operator do?

A

The instanceof operator 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.

250
Q

What is a “callback” function?

A

a function that is passed as an argument to another function

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

252
Q

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

A

setInterval()

253
Q

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

A

Defaults to 0 if not specified

254
Q

What do setTimeout() and setInterval() return?

A

SetTimeout() returns. The returned timeoutID is a positive integer value which identifies the timer created by the call to setTimeout().

setInterval returns The returned intervalID is a numeric, non-zero value which identifies the timer created by the call to setInterval()

255
Q

What is a client?

A

client is a piece of computer hardware or software that accesses a service made available by a server as part of the client–server model of computer networks.

THe one who is making the request

256
Q

What is a server?

A

a server is a piece of computer hardware or software (computer program) that provides functionality for other programs or devices, called “clients”

Server is a software driven thing

257
Q

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

A

get request

258
Q

What three things are on the start-line of an HTTP response message?

A

protocol version
status code
status text

259
Q

What three things are on the start-line of an HTTP request message?

A
  1. An HTTP method, a verb (like GET, PUT or POST) or a noun (like HEAD or OPTIONS), that describes the action to be performed.
  2. The request target, usually a URL, or the absolute path of the protocol, port, and domain are usually characterized by the request context.
  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.
260
Q

What are HTTP headers?

A

An HTTP header is a field of an HTTP request or response that passes additional context and metadata about the request or response.````

HTTP Headers are information about the request being made.

261
Q

Where would you go if you wanted to learn more about a specific HTTP Header?

A

MDN

262
Q

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

A

no

263
Q

What is AJAX

A

a programming practice of building complex, dynamic webpages using a technology known as XMLHttpRequest.

Ajax allows you to update parts of the DOM of an HTML page without the need for a full page refresh. Ajax also lets you work asynchronously, meaning your code continues to run while the targeted part of your web page is trying to reload (compared to synchronously, which blocks your code from running until that part of your page is done reloading).

264
Q

What does the AJAX acronym stand for?

A

Asynchronous JavaScript And XML

265
Q

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

A

XMLHttpRequest

266
Q

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

A

The load event is fired

267
Q

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

A

They Have a shared prototype object