JavaScript

Question 1

What is the purpose of a string?

Answer 1

To store texts that doesn’t make sense to Javascript
as a sequence of characters!

Question 2

Purpose of a number?

Answer 2

to store numbers, not always mathematical values
ex) zip codes, phone numbers = numbers that are actually a type of IDs

Question 3

Purpose of a boolean?

Answer 3

to make decisions/logic switches

Question 4

What is the difference between null and undefined?

Answer 4

null = value is left out intentionally or coming later. Can only be created by coders by assigning null as the value of a variable
ex) var intentionallyEmpty = null;

undefined = Javascript can create this whenever! Causing ambiguity to the code/debugging steps

Question 5

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

Answer 5

It describes the value that is being logged creating more organization and clarity

Question 6

7 examples of javascript PRIMITIVES vs JS data types?

Answer 6

string, boolean, number, bigint(numbers that are big), null, undefined, symbol

vs. all of the above AND objects

Question 7

What is string concatenation?

Answer 7

to make multiple strings become one string
not mathematical, but still an expression (aka a chunk of work that javascript must perform)
uses string operator +

Question 8

What is an object literal notation?

Answer 8

a simplified syntax = aka syntactical sugar of the constructor notation which uses a constructor function and “new” operator

Question 9

method

Answer 9

properties that store functions
OR functions that are properties of an object

Question 10

What are objects used for?

Answer 10

to group data/variables that are related

Question 11

What are object properties?

Answer 11

individual place to store data within an object
basically a variable inside of an object

Question 12

Describe object literal notation

Answer 12

{
property: value,
property: value
};

Question 13

How do we remove a property from an object?
How do we clear the value of a property from an object?

Answer 13

delete operator with object name and property name
reassign the value using dot or bracket notation = ‘ ‘ (blank string)

Question 14

How do we read this (using square bracket to assign a property and value of an object)?

vehicle[‘color’] = ‘white’;

Answer 14

string white is being assigned to the vehicle AT string color

Question 15

What makes arrays a special type of object?

Answer 15

They hold a related set of key/value pairs, but the key for each value is its index number.

Question 16

What are arrays used for?

Answer 16

to create a list and group like data with more flexibility in length/amount vs. object

Question 17

What is the length property of an array?

Answer 17

shows how many items are inside the array
array.length

Question 18

How are arrays different from “plain” objects?

Answer 18

arrays do not need a property/key name
the automatically generated name is the index number!
arrays have an order and length
requires method to add/delete data

vs

objects need property/key name
objects do not have order or length
objects require assignment operator to add
and delete operator to delete data

Question 19

How do you calculate the last index of an array?

Answer 19

array.length - 1

Question 20

What is a function in Javascript?

Answer 20

a special kind of object that is “callable”
repeatable named block of code

Question 21

Parts of the Function Definition

Answer 21

Key word: function
optional name
optional parameter
{}
*likely a return statement

Question 22

What is the difference between function parameter and argument?

Answer 22

Parameter = part of function definition (aka placeholders for potential value in the future) only exists inside of the function code block! This is what lets us reuse functions with different values!
Argument = part of function call
the value that we pass

Question 23

What 2 effects does the return statement have?

Answer 23

1. return of the function spits out a value = specifies a value to be returned to the function caller
2. stops the function from running
   we can use it to create Guard Clauses (used when we can’t prevent something from going wrong lol)

Question 24

Does every function call have a return value?

Answer 24

Yes! Even if there is nothing specified, JavaScript will return UNDEFINED! If the code block has console.log, it will log whatever is specified.
ex) function greet () {
var greeting = ‘Hello’;
}
greet();

we will have undefined show up in our console

Question 25

Why do we log things to the console?

Answer 25

to see the result and check = for debugging
console.log does not do anything for the users
DELETE console.logs once project is finished

Question 26

6 examples of comparison operators

Answer 26

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

Question 27

What data type do comparison expressions evaluate to?

Answer 27

boolean: true or false

Question 28

Purpose of an if statement?

Answer 28

To create logic

Question 29

3 logical operators

Answer 29

|| , && , !
(! means to flip the boolean value)

Question 30

Syntax of an if statement

Answer 30

key word: if
(condition)
{}

Question 31

What is the purpose of a loop?

Answer 31

To run a job multiple times/repeat!

Question 32

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

Answer 32

tells the loop when to stop

Question 33

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

Answer 33

A single time that the loop’s CODE BLOCK runs!

Question 34

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

Answer 34

before the code block/iteration

Question 35

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

Answer 35

just ONCE BEFORE ANYTHING in the loop
ALWAYS ONCE and never again

Question 36

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

Answer 36

before each iteration = code block
after the final expression
except the first iteration, which will be after the initialization

Question 37

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

Answer 37

after the code block

Question 38

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

Answer 38

break

Question 39

What does the ++ increment operator do?

Answer 39

add and assign
ex) var num = 1;
5 + ++num
// num = 2
// 5 + 2 = 7
5 + num++
// num = 1
// 5 + 1 = 6
// num = 2
num++(adds first THEN reassign) vs. ++num (reassigns incremented value first THEN adds)

Question 40

How do you iterate through the keys of an object?

Answer 40

for…in loop

Question 41

How do you store data in localStorage?

Answer 41

setItem() method of the localStorage object
takes ( string of the key name, string of the value of key)

Question 42

How do you retrieve data from localStorage?

Answer 42

getItem() method of the localStorage object
takes string of the name of the key as the argument

Question 43

What data type can localStorage save in the browser?

Answer 43

strings
which is why we use JSON

Question 44

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

Answer 44

before the window unloads everything
ex) when the user refreshes/closes tab/browser

Question 45

What is a method?

Answer 45

It is a function which is a property of an object.
2 kinds:
- Instance Methods (built-in tasks performed by an object instance)
- Static Methods (tasks called directly on an object constructor)

Question 46

How can you tell the difference between a method definition and a method call?

Answer 46

definition requires a function definition
call would require object . method name ()

Question 47

Describe method definition syntax (structure)

Answer 47

if creating an object, {
property name: function

if object already created,
object name.propertyname = function;

Question 48

Describe method call syntax (structure)

Answer 48

object name.method name (arguments if needed);

Question 49

How is a method different from any other function?

Answer 49

method is function stored inside an OBJECT
requires NAMING THE OBJECT with dot notation in order to call
When being called:
presence of an object vs. function name

Question 50

What is the defining characteristic of OOP (Object-Oriented Programming)?

Answer 50

objects can contain both data (as properties) and behaviors (as methods)

Question 51

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

Answer 51

abstraction (removing complex details for ease of use)
encapsulation (?)
inheritance (prototypal inheritance/delegation)
polymorphism (?)

Question 52

What is “abstraction”?

Answer 52

removing/hiding complex details (that is not relevant for current use) to work with complex things in simple ways
ex) light switch hides all the complexity of circuits, breakers, etc.
ex) automatic transmission vs manual (aka stick)
ex) javascript: built upon C (which is more intense)

Question 53

What does API stand for?

Answer 53

Application Programming Interface

Question 54

What is the purpose of API?

Answer 54

• give programmers a way to interact with a system in a simplified, consistent fashion: aka, an abstraction.
• a connection between computers or between computer programs. It is a type of software interface, offering a service to other pieces of software.
  ex) DOM: I don’t know how the .createElement() method truly creates a new DOM element, but I know how to use it!

Question 55

What is “this” in JavaScript?

Answer 55

An implicit parameter that allows us to see
the object where “this” is being invoked from

Question 56

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

Answer 56

this is a parameter that exists in a function without having to be declared explicitly

Question 57

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

Answer 57

call time
this is a parameter, therefore, it only has value when the function is called

Question 58

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);
}
};

Answer 58

there is no value since it hasn’t been called
aka we cannot be certain!

Question 59

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

Answer 59

function has been called through the greet method, therefore, the message will be printed with ‘Mario’

Question 60

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

Answer 60

“message + undefined” since I called the variable hello, which means I got the function definition stored inside the character object, causing the variable to hold the function definition. Now, JS variables are actually properties! Therefore global variables = property of the window object! So, the var hello is now actually a property of the window object, and the window object does not have a firstName property = undefined!

Question 61

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

Answer 61

We can’t know!

Question 62

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

Answer 62

Look at the object left of the dot

Question 63

What kind of inheritance does the JavaScript programming language use?

Answer 63

JavaScript includes a specific kind of inheritance known as prototype-based (or prototypal) inheritance.
The ultimate goal is to move properties and methods that we’d like to reuse into a “prototype” object and then tell other objects to simply delegate to that “prototype” object when they aren’t able to perform the required tasks themselves.

Question 64

What is a prototype in JavaScript?

Answer 64

It is an object. It contains data or behavior that is accessible to all other objects that delegate to it.

Question 65

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?

Answer 65

they have an prototype object, and prototypal inheritance applies to all of them since all of those are objects in JS

Question 66

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

Answer 66

in the prototype object (going up on each prototypal chain)

Question 67

How do you add a new property to all objects of the same type? (Context: you defined the object type by writing a function definition that specifies its name and properties)

ex: function Car(make, model, year) {
this.make = make;
this.model = model;
this.year = year;
}

Answer 67

You have to add the property to the constructor’s prototype property.

ex: Car.prototype.color = ‘original color’;
console.log(car1.color); // ‘original color’

car1.color = ‘black’;
console.log(car1.color); // ‘black’

console.log(Object.getPrototypeOf(car1).color); // ‘original color’
console.log(Object.getPrototypeOf(car2).color); // ‘original color’

console.log(car1.color); // ‘black’
console.log(car2.color); // ‘original color’

Question 68

Difference between .__proto__ (aka [[prototype]]) and .prototype properties?

Answer 68

__proto__/[[prototype]] = prototype on the created instance
prototype = prototype on the constructor function

Question 69

What does the new operator do?

Answer 69

It allows us to invoke a function as a constructor function.
It creates an empty object = “instance” with all the properties and methods of the user-defined object type or of the built-in object types that has its constructor function

1. create an empty object
2. attaches prototype object to the instance and points/delegates to the constructor function’s prototype property
3. makes the new object ‘this’ (runs the codeblock)
4. constructor function will most likely NOT have a return statement. Returns the instance/object as long as it doesn’t have a return statement. If it does, it returns the statement instead of the instance!

Question 70

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

Answer 70

prototype property

Question 71

What does the instanceof operator do?

Answer 71

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

Syntax:
object instanceof constructor

Question 72

What is a callback function?

Answer 72

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.

Question 73

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?

Answer 73

setTimeout()
ex) bank account websites with timeout

Question 74

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

Answer 74

setInterval()

Question 75

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

Answer 75

0 ms
BUT this does not mean it gets done immediately.
It means it will go into the que(?) immediately and stay there until JS is done with the main activity. When it is done, it will take the first item in the que and run it.

Question 76

What do setTimeout() and setInterval() return?

Answer 76

setTimeoutID (rarely used since the action will end after the first action, UNLESS we want to end the action from completing ex: bank time out gets “canceled” when user performs activity) & setIntervalID which are numeric values that identifies the timer created by the call. This value is passed to cancel the interval. They share the ID count so, if I create one interval, and then a timeout, the timeout’s ID will be 2.
NEVER expect the ID to be the next number since extensions can use timeouts and intervals as well! SAVE the return! DO NOT hard code IDs!

Question 77

JS values that have “falsy” value on its own?

Answer 77

false , 0 , “” , NaN , undefined, null

Question 78

What is special about primitives in javascript?

Answer 78

they do not change in values

Question 79

What is an algorithm?

Answer 79

a process made up of (3) things:
-variables
-conditionals
-loops

Question 80

What is the purpose of variables?

Answer 80

To store a value under a name for the future!
Computers DO NOT hold onto data unless we TELL them to!

Question 81

How do you declare a variable?

Answer 81

By using keywords, such as var, let, const

var scope = global/function scope
let/const = nearest block scope

Question 82

What characters are allowed in variable names?

Answer 82

number (only if NOT first), letter, $, _
NO punctuations

Question 83

What is a unary and binary operators?

Answer 83

unary = one operator and one operand
ex) typeof
binary = one operator and two operand
ex) 4 + 7

Question 84

logical operators vs. comparison operators

Answer 84

logical = combine expressions and return true/false
comparison = compare two values and return true/false

Question 85

What is the modulus operator?

Answer 85

% = divides two values and returns the remainder
ex) 10 % 3 = 1

Question 86

Several arithmetic operations can be performed in one expression, what is the order of execution?

Answer 86

PEMDAS

Question 87

What data type is returned by an arithmetic operation?

Answer 87

number

Question 88

What is the typeof Nan?

Answer 88

number

Question 89

What is the typeof null?

Answer 89

object

Question 90

Why are strings primitive?

Answer 90

They are immutable!
ex) var str = ‘cat’
str[1] = ‘o’;
str = ‘cat’

VS.

ex) var str = ‘cat’
str += ‘tle’
str = ‘cattle’

Question 91

What data type is returned by comparing two values (<, >, ===, etc)?

Answer 91

boolean

Question 92

+ vs += ?

Answer 92

+ (add or concatenate)
+= (add or concatenate AND reassign)

Question 93

++ vs += ?

Answer 93

difference in when the value is changed?
++ only increments by 1
+= can add and assign by any specified value

Question 94

What are two ways to get or update the value of a property of an object?

Answer 94

dot notation = EVERYTHING that comes after is read as STRING!
bracket notation = reads EVERYTHING inside as an EXPRESSION! Think of it as a 2 step process where the expression is solved and the value that is the result is run with dot notation!
*if you can use a [””] then you should use dot notation!

Question 95

Every property inside an object is what type of data?

Answer 95

string
BUT we don’t put quotes around them in object literal
BUT when we use bracket notation to get or update a property, we use quotes inside the bracket!

Question 96

Why does index start at 0?

Answer 96

index = how many spaces to move to get to the data

Question 97

What is a reference data type?

Answer 97

since these grow over time with infinite possibility
we do not store the actual memory space inside the variable we assign it to. It simply stores the memory address that points to the memory space.
*making a copy of ref data type is tricky!! Just making another var that points to the same thing and making changes to one will corrupt the original memory!!!
ex) objects, arrays

Question 98

Why do we log things to the console?

Answer 98

to debug!
it is a way to see what is happening as we make changes/create

Question 99

How do you remove the last element from an array?

Answer 99

pop() = removes the last element from an array and returns that element. This method changes the length of the array.

Question 100

Math.floor()

Answer 100

rounds down to the lower number
ex) -4.5 will become -5

Question 101

Math.random()

Answer 101

generate random number from 0 - 0.9999999~
DOES NOT go up to 1
to represent a percentage

Question 102

How do you delete an element from an array?
Why is this method dangerous?

Answer 102

splice()
It changes the content of the array!
We don’t want to modify original data!

Question 103

How do you append (add to the end) of an array?
What does it return?

Answer 103

push() = adds one or more elements to the end of an array and returns the new length of the array.

Question 104

How do you break a string up into a array?

Answer 104

split() = takes a pattern and divides a String into an ordered list of substrings by searching for the pattern, puts these substrings into an array, and returns the array.

Question 105

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

Answer 105

NOPE! String are immutable!
Log the string!

Question 106

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

Answer 106

No.
Sometimes the function or method may not return what we want.
ex) push() returns the new LENGTH of the array
pop() returns the last ELEMENT that was removed

Question 107

array.splice() return value is?

Answer 107

an array of element/elements that are removed

Question 108

What is a shallow copy?

Answer 108

it only makes a copy of the primitive data types BUT the reference data types will NOT be a different copy! It is still the same reference point to the memory space!
ex) array with objects
if shallow copy’s object is changed = original object inside original array is changed as well!

Question 109

What is type coercion in JavaScript?

Answer 109

js can convert data types behind the scenes to complete an operation
ex) ‘1’ (string) can be turned into 1 (number)
*this is why js is said to use weak typing vs. strong typing
*to check this behavior, use strictly equal to === / !==

Question 110

The difference between
if (document.getElementById(‘header’)) {
console.log(‘found’)
} else {
console.log(‘not found’)
}

vs.

if (document.getElementById(‘header’) == true) {
console.log(‘found’)
} else {
console.log(‘not found’)
}

Answer 110

The first if statement will check if the element exists, and if it does, return truthy.
The second statement using a loose equality will return an object which is a truthy value but NOT equal to boolean true! Resulting in logging the ‘not found’ else statement.

Question 111

null and undefined unique feature?

Answer 111

they are both falsy, but they are not equal to anything other than themselves.
ex) null === undefined => false

Question 112

conditional vs condition in code reading?

Answer 112

conditional includes all of the if and else statements
condition is the expression inside the parenthesis after the keywords if, else, while, etc.

Question 113

What is a truthy/falsy value?

Answer 113

a value that will convert into a boolean true/boolean false.

Question 114

Do order of conditionals matter in if…else and similar statements?

Answer 114

Yes! Try to go from detailed to general!
ex)
if the first condition is too general and has a return statement, the function will exit before it gets to the other conditions!

Question 115

When do we use a for loop?
while loop?
do while loop?
for…in loop?

Answer 115

for loop = when we KNOW exactly when to STOP
while = executes a specified statement as long as the test condition evaluates to true. In other words when we DON’T know when to stop.
do while =
for..in = to go through an object

Question 116

What does the keyword continue do in a loop?

Answer 116

Terminates execution of the statements in the current iteration of the current loop, and continues execution of the loop with next iteration.

Question 117

What should you be careful of when declaring variables inside loops?

Answer 117

the variable will be redeclared every time the loop runs
*if the variable should not change within the loop, define it outside!

Question 118

What is the purpose of a guard clause?

Answer 118

• to sift out potentially bad data that has no relation to the function
• to make our code easier to read:
  the code block that we WANT to run shouldn’t seem like a result of a conditional

Question 119

What is a SPA (single page application)?

Answer 119

application that uses one HTML document that has content that are hidden/ in view through JS

Question 120

What is a data-* attribute?

Answer 120

It lets us customize an attribute!
ex) data-view

Question 121

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

Answer 121

A value of display=”none” indicates that the given element and its children will not be rendered.
When applied to a container element, the container and all of its children will be invisible; thus, it acts on groups of elements as a group. This means that any child of an element with display=”none” will never be rendered even if the child has a value for display other than none.

Question 122

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

Answer 122

it takes a string containing a CSS selector as an argument
it returns a boolean

Question 123

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

Answer 123

.getAttribute()
className

Question 124

What is JSON?

Answer 124

a data interchange format used to send and store information in computer systems as a string representive of a JS object

Question 125

What are serialization and deserialization?

Answer 125

serialization = all the data is in one location (simplified)
deserialization = bringing back the complexity of data being placed in all potentially different locations
Objects are stored in a memory space, but would this location be the same in another server? user? No! So serialization strips all the complexity = string, while deserialization recreates the data adding all the necessary parts like objects memory location/array indexes.
ex) objects and arrays are stored in different locations to let them grow!

Question 126

Why are serialization and deserialization useful?

Answer 126

We use objects and arrays to make groups of data easier to work with!
But serialization is better to transfer/send data (ex: network request)!
Objects are stored in a memory space, but would this location be the same in another server? user? No!

Question 127

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

Answer 127

JSON.stringify();

Question 128

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

Answer 128

JSON.parse();

Question 129

What is AJAX?

Answer 129

It is a technique for loading data into part of a page without having to reload the entire page. It lets us create dynamic webpages using a technology called XMLHttpRequest (xhr);

Question 130

What does the AJAX acronym stand for?

Answer 130

Asynchronous JS and XML
XML is becoming deprecated with the introduction of JSON

Question 131

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

Answer 131

XMLHttpRequest

Question 132

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

Answer 132

load

Question 133

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

Answer 133

prototypal inheritance
sharing a prototype object!

Question 134

What must the return value of myFunction be if the following expression is possible?
myFunction()();

Answer 134

Another function since the return has to be callable!

Question 135

What does this code do?
const wrap = value => () => value;

Answer 135

Wrap is storing a function with one parameter value, and this function is returning another function that returns the same value. The second function knows the same value because the first function created a closure for the second function at its definition time.

Question 136

In JavaScript, when is a function’s scope determined; when it is called or when it is defined?

Answer 136

When it is defined!

Question 137

What allows JavaScript functions to “remember” values from their surroundings (lexical environment)?

Answer 137

Closures!

Question 138

When do we use closures?

Answer 138

event handlers