JavaScript

Question 1

What is the purpose of variables?

Answer 1

The purpose of variables is to store value.

Why does this help? Variables can change & it exists for a longer time.(data permanence)

Question 2

How do you declare a variable?

Answer 2

You declare a variable by using the var keyword and giving the variable a name.

Question 3

How do you initialize (assign a value to) a variable?

Answer 3

You initialize (assign a value to) a variable with the = operator.

Question 4

What characters are allowed in variable names?

Answer 4

Letters, numbers, dollar sign($), and underscore(_).

Note: dash(-) or period( . ) or question-mark(?) are not allowed & Numbers cannot go first.

Question 5

What does it mean to say that variable names are “case sensitive”?

Answer 5

When it is said that variable names are “case sensitive” it means that capitalization matters.

Ex: String and string are not the same.

Question 6

What is the purpose of a string?

Answer 6

The purpose of a string is to store text.

Question 7

What is the purpose of a number?

Answer 7

The purpose of a number is to use it for math and calculations.

Question 8

What is the purpose of a boolean?

Answer 8

The purpose of a boolean is to store if something is true or false. Booleans exist for decision making.

Question 9

What does the = operator mean in JavaScript?

Answer 9

The = operator in JavaScript means that we are assigning a value to something.

Question 10

How do you update the value of a variable?

Answer 10

You update the value of a variable by assigning a new value to the variable.

Note: You don’t need the var keyword to assign a new value to an existing variable.

Question 11

What is the difference between null and undefined?

Answer 11

Null: Primitive value that represents a reference that points, generally intentionally, to a nonexistent or invalid object or address. Null always need to be assigned to something.

Undefined: Primitive value automatically assigned to variables that have only been declared. Also assigned to formal arguments where there are no actual arguments.

Question 12

What data-type is returned by an arithmetic operation?

Answer 12

A Number value is returned by an arithmetic operation.

Question 13

What is string concatenation?

Answer 13

String concatenation is adding two or more strings to make a longer string.

Question 14

What purpose(s) does the + plus operator serve in JavaScript?

Answer 14

The + plus operator adds numbers and concatenates strings in JavaScript.

Question 15

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

Answer 15

A Boolean value is returned by comparing two values (< , >, ===, etc).

Question 16

What does the += “plus-equals” operator do?

Answer 16

A value on the right-side will be added to the variable, and the variable will then be updated to that new value.

Question 17

What are objects used for?

Answer 17

Objects are used to group together a set of properties and methods to create a model of something.

Question 18

What are object properties?

Answer 18

Object properties are variables glued to that object.

Question 19

Describe object literal notation.

Answer 19

var hotel = {
name: 'Cosmopolitan',
rooms: 500,
booked: 300,
checkAvailability: function( ) {
    return this.rooms - this.booked;
  }
};

Question 20

How do you remove a property from an object?

Answer 20

Removing a property from an object using the dot notation:
delete objectname.propertyname.

Removing a property from an object using the bracket notation:
delete objectname[‘propertyname’].

Question 21

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

Answer 21

Updating/getting a property from an object using the dot notation: variablename.propertyname.

Updating/getting a property from an object using the bracket notation: variablename[‘propertyname’].

Question 22

What are arrays used for?

Answer 22

Arrays are used to store a list of data with number indexes.

Question 23

Describe array literal notation.

Answer 23

colors = [‘white’, ‘blue’, ‘red’]

Question 24

How are arrays different from “plain” objects?

Answer 24

Arrays have orders to them unlike “plain” objects. Arrays will repair itself if a data is deleted.

Question 25

What number represents the first index of an array?

Answer 25

0 represents the first index of an array.

Question 26

What is the length property of an array?

Answer 26

The length property of an array tells us the number of data stored in an array.

Question 27

How do you calculate the last index of an array?

Answer 27

We calculate the last index of an array by:

arrayname.length - 1

Question 28

What is a function in JavaScript?

Answer 28

A function in JavaScript is giving a name to some amount of code so that it can be reused and also read easier.

Question 29

Describe the parts of a function definition.

Answer 29

function functionName (parameters) {
    return
}

Question 30

Describe the parts of a function call.

Answer 30

functionName (arguments)

Note: Arguments don’t have to be there.

Question 31

When comparing them side-by-side, what are the differences between a function call and a function definition?

Answer 31

function definition - name of data get passed as parameters.

function call - actual values get passed as arguments.

Question 32

Why are function parameters useful?

Answer 32

It functions as a placeholder.

Question 33

Why are function parameters useful?

Answer 33

Parameters are useful because they function as placeholders.

Adds reusability and adaptability.

Question 34

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

Answer 34

1. Causes the function to return a value we can use in our program.
2. Prevents any more code in the function’s code block from being run.

Question 35

Why do we log things to the console?

Answer 35

We log things to the console for debugging purposes.

Question 36

What is a method?

Answer 36

A method is a function which is a property of an object.

Question 37

How is a method different from any other function?

Answer 37

A function becomes a method once it is passed in as a property for an object. Method has to say where it is coming from.

Question 38

How do you remove the last element from an array?

Answer 38

You can remove the last element from an array by using the pop( ) method.

Question 39

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

Answer 39

You can round a number down to the nearest integer by using the Math.floor( ) method.

Question 40

How do you generate a random number?

Answer 40

You can generate a random number in a range by:

Ex: Math.floor(Math.random( ) * 10);

Question 41

How do you delete an element from an array?

Answer 41

You can delete an element from an array by using the: pop( ) method, shift( ) method, and/or splice( ) method.

Question 42

How do you append an element to an array?

Answer 42

You can add an element to an array by using the: push( ) method, unshift( ) method, and or splice( ).

Question 43

How do you break a string up into an array?

Answer 43

You can break a string up into an array by using the split( ) method.

Question 44

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

Answer 44

No. You can check by using console.log ( ).

Question 45

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

Answer 45

A lot. Learn it when you need it.

Question 46

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

Answer 46

No.

The push ( ), unshift ( ), pop( ), shift( ), and splice( ) are good examples for when you are solely just trying to manipulate the array.

Question 47

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

Answer 47

A lot. Learn it when you need it.

Question 48

Give 6 examples of comparison operators.

Answer 48

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

Question 49

What data type do comparison expressions evaluate to?

Answer 49

Comparison expressions evaluate to Booleans.

Question 50

What is the purpose of an if statement?

Answer 50

The purpose of an if statement is for decision making.

Question 51

Is else required in order to use an if statement?

Answer 51

No.

Question 52

Describe the syntax (structure) of an if statement.

Answer 52

if ( condition ) {

}

Question 53

What are the three logical operators?

Answer 53

&&, | |, and !.

Question 54

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

Answer 54

You compare two different expressions in the same condition by using logical && or logical | | operator.

Question 55

What is the purpose of a loop?

Answer 55

The purpose of a loop is to offer a quick and easy way to do something repeatedly.

Question 56

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

Answer 56

The purpose of a condition expression in a loop is to test if the loop-code-block should be executed or not. (To keep going or not)

Question 57

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

Answer 57

“Iteration” in the context of loops means a cycle of the loop.

Question 58

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

Answer 58

The condition expression of a while loop gets evaluated in the beginning.

Question 59

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

Answer 59

The initialization expression of a for loop gets evaluated in the beginning.
(initialization = before anything)

Question 60

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

Answer 60

The condition expression of a for loop gets evaluated before each iteration.
(condition = before each iteration)

Question 61

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

Answer 61

The final expression of for loop gets evaluated after the loop-code-block was executed.
(final expression = after each iteration)

Question 62

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

Answer 62

The “break” keyword.

Question 63

What does the ++ increment operator do?

Answer 63

The ++ increment operators increments by 1.

Question 64

How do you iterate through the keys of an object?

Answer 64

You can iterate through the keys of an object by using the for…in loop.

Question 65

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

Answer 65

focus

Question 66

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

Answer 66

blur

Question 67

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

Answer 67

input

Question 68

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

Answer 68

submit

Question 69

What does the event.preventDefault( method do?

Answer 69

Prevents the page from doing what it usually does.

Question 70

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

Answer 70

Sends the data of key value pair to URL. (Query String) The data gets sent back to the current page.

Question 71

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

Answer 71

elements

Question 72

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

Answer 72

value

Question 73

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

Answer 73

Harder to debug.

Question 74

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

Answer 74

Easier to debug.

Question 75

What is the event.target?

Answer 75

It is the dom object of the element where the event was fired.

Question 76

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

Answer 76

It hides the content.

Question 77

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

Answer 77

It takes a CSS selector as an argument and returns a boolean.

Question 78

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

Answer 78

getAttribute( )

Question 79

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

Answer 79

Almost at every step.

Question 80

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?

Answer 80

We would need event listeners for each of the tabs.

Question 81

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?

Answer 81

We need to check through each element individually.

Question 82

What is JSON?

Answer 82

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

JSON exists as a string — useful when you want to transmit data across a network. It needs to be converted to a native JavaScript object when you want to access the data.

Question 83

What are serialization and deserialization?

Answer 83

Serialization: a process of converting an Object into stream of bytes so that it can be transferred over a network or stored in a persistent storage.

Deserialization: a process of fetching a stream of bytes from a network or persistence storage and convert it back to the Object with the same state.

Question 84

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

Answer 84

JSON.stringify( )

Question 85

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

Answer 85

JSON.parse( )

Question 86

How do you store data in localStorage?

Answer 86

localStorage.setItem(‘key’, ‘value’ )

Question 87

How do you retrieve data from localStorage?

Answer 87

localStorage.getItem(‘key’)

Question 88

What data type can localStorage save in the browser?

Answer 88

JSON strings

Question 89

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

Answer 89

Before the window unloads.

Question 90

What is a method?

Answer 90

A method is a function which is a property of an object.

Question 91

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

Answer 91

Method definition is a function that is a value of object:

Ex: Property: function ( )

Method call is property of object:

Ex: Object.method( )

Question 92

Describe method definition syntax (structure).

Answer 92

Ex:

var calculator = {
  add: function (x, y) {
    return x + y;
  },

Question 93

Describe method call syntax (structure).

Answer 93

object.method( )

Question 94

How is a method different from any other function?

Answer 94

Methods are functions attached to objects.

Question 95

What is the defining characteristic of Object-Oriented Programming?

Answer 95

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

Question 96

What is “abstraction”?

Answer 96

Being able to work with (possibly) complex things in simple ways.

Example: Automatic Car Transmission

Question 97

What does API stand for?

Answer 97

Application Programming Interface

Question 98

What is the purpose of an API?

Answer 98

To give programmers a way to interact with a system in a simplified, consistent fashion: aka, an abstraction.

Question 99

What is ‘this’ in JavaScript?

Answer 99

‘this’ is an implicit parameter of all JavaScript functions.

Question 100

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 100

‘this’ refers to the object ‘character’.

Question 101

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 101

Since the method is not being used, ‘this’ does not have anything inside.

Question 102

Given the below character object:

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

What is the result of the following code snippet? Why?

character.greet();

Answer 102

The result will be ‘It’s a me, Mario!”

Because the value of the parameter greet is ‘It's-a-me, ‘ + this.firstName + ‘!’;.

Question 103

Given the below character object:

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

What is the result of the following code snippet? Why?

var hello = character.greet;
hello();

Answer 103

The result will be ‘It’s a me, undefined!”

Because the greet method hasn’t been called.

The value of ‘this’ is still window.
The window object does not have a property firstName.

Question 104

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

Answer 104

You can’t. If you cannot see the function being called, then you do not know what the value of ‘this’ will be.

Question 105

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

Answer 105

The value of ‘this’ can be recognized as “the object to the left of the dot” when the function is called (as a method).

Question 106

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

Answer 106

call time

Question 107

What kind of inheritance does the JavaScript programming language use?

Answer 107

JavaScript includes a specific kind of inheritance known as prototype-based (or prototypal) inheritance. JavaScript objects give certain behaviors (methods) or data (properties) to other objects.

Prototypal inheritance in JavaScript is a fairly simple concept (especially compared to ‘this’). 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 (verb) to that “prototype” object when they aren’t able to perform the required tasks themselves.

Question 108

What is a prototype in JavaScript?

Answer 108

JavaScript prototype is simply an object that contains properties and (predominantly) methods that can be used by other objects.

Question 109

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?

Answer 109

The methods exist in their prototype object.

Question 110

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

Answer 110

In the __proto__ object.

Question 111

What does the new operator do?

Answer 111

1. Creates a blank, plain JavaScript object.
2. Adds a property to the new object (__proto__) that links to the constructor function’s prototype object.

Note: Properties/objects added to the construction function prototype are therefore accessible to all instances created from the constructor function (using new).

3. Binds the newly created object instance as the this context (i.e. all references to this in the constructor function now refer to the object created in the first step).
4. Returns this if the function doesn’t return an object.

Question 112

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

Answer 112

.prototype

Example:

Student.prototype.getFullName = function () {
  var fullName = this.firstName + ' ' + this.lastName;
  return fullName;
};

Question 113

What does the instanceof operator do?

Answer 113

Checks if an instance is an instance of a specific object or not.

Returns a boolean.

Question 114

What is a “callback” function?

Answer 114

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 115

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 115

using setTimeout( )

Question 116

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

Answer 116

using setInterval( )

Question 117

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

Answer 117

0

Question 118

What do setTimeout() and setInterval() return?

Answer 118

It returns an interval ID which uniquely identifies the interval, so you can remove it later by calling clearInterval().

interval ID is an integer.

Question 119

What is AJAX?

Answer 119

AJAX is a technique for loading data into part of a page without having to refresh the entire page.

Use XMLHttpRequest( )

Question 120

What does the AJAX acronym stand for?

Answer 120

Asynchronous JavaScript And XML

Question 121

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

Answer 121

XMLHttpRequest ( )

Question 122

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

Answer 122

load

Question 123

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

Answer 123

It is in the prototype.

Both branching off of the same prototype.

Question 124

What is a code block? What are some examples of a code block?

Answer 124

Code in-between { } to be executed together that are statements.

Examples of a code block are function code blocks, conditional code blocks, loop code blocks.

Question 125

What does block scope mean?

Answer 125

In ES6, const and let keywords allow developers to declare variables in the block scope, which means those variables exist only within the corresponding block.

Question 126

What is the scope of a variable declared with const or let?

Answer 126

block scope

Question 127

What is the difference between let and const?

Answer 127

You can’t reassign values declared in const.

Question 128

Why is it possible to .push() a new value into a const variable that points to an Array?

Answer 128

Can’t reassign but we can manipulate the value.

Question 129

How should you decide on which type of declaration to use?

Answer 129

If the value is going to be reassigned, use let.
If not, use const.

Use const everywhere unless you can’t.

Question 130

What is the syntax for writing a template literal?

Answer 130

${variable}

Question 131

What is “string interpolation”?

Answer 131

The ability to substitute part of the string for the values of variables or expressions.

Question 132

What is destructuring, conceptually?

Answer 132

Destructuring broadly means extracting data from arrays or objects. Using destructuring, we can break a complex array or object into smaller parts. Destructuring also offers us the ability to extract multiple data at once from an object or array. It also provides the ability to set a default value of the property if it’s already not set.

Question 133

What is the syntax for Object destructuring?

Answer 133

var obj {
}

const/let {keyName: variableName} = obj

or

const/let {keyName/varibleName} = obj
if the the key name and variable name are the same.

Question 134

What is the syntax for Array destructuring?

Answer 134

var array [
]

const/let [arrayValue] = array
if only grabbing first value of array and putting it into a variable.

or

const/let {index:variableName} if using object destructuring.

Question 135

How can you tell the difference between destructuring and creating Object/Array literals?

Answer 135

The { } and [ ] followed with the name of the object/array after the =.

Creating:
const/let array = [ ]

Destructuring:
const/let [arrayValue] = arrayName

Question 136

What is the syntax for defining an arrow function?

Answer 136

const greet = (who) => {
  return `Hello, ${who}!`;
}

Question 137

When an arrow function’s body is left without curly braces, what changes in its functionality?

Answer 137

It has an implicit return but the statement must be in one-line. (The right side of the arrow is the expression)

Question 138

How is the value of ‘this’ determined within an arrow function?

Answer 138

In regular functions the ‘this’ keyword represented the object that called the function, which could be the window, the document, a button or whatever. ‘this’ is determined at function call.

With arrow functions the this keyword always represents the object that defined the arrow function. ‘this’ is determined at function definition. Go up one level and search for ‘this’.

Question 139

What is Array.prototype.filter useful for?

Answer 139

To make a new array from specific elements of an existing array.

Question 140

What is Array.prototype.map useful for?

Answer 140

To make a new array after the elements have been altered.

Question 141

What is Array.prototype.reduce useful for?

Answer 141

Take all elements of an array and combine them somehow.

Question 142

What is “syntactic sugar”?

Answer 142

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.

Question 143

What is the “typeof” an ES6 class?

Answer 143

function

Question 144

Describe ES6 class syntax.

Answer 144

class Person {
    constructor(name) {
        this.name = name;
    }
    getName( ) {
        return this.name;
    }
}

Question 145

What does fetch() return?

Answer 145

a promise. The promise is for a response at all.

Question 146

What is the default request method used by fetch()?

Answer 146

GET

Question 147

How do you specify the request method (GET, POST, etc.) when calling fetch?

Answer 147

Pass the method as the second argument.

Question 148

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

myFunction( )( );

Answer 148

Must be a function.

Second () is calling the return of myFunction.

Question 149

What does this code do?

const wrap = value => ( ) => value;

Answer 149

It is assigning an anonymous function with a single parameter “value” to the const variable wrap. And in the code-block, another anonymous function is defined with the parameter value.

The code assigns the value of the parameter to const variable wrap.

Question 150

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

Answer 150

When it is defined.

Question 151

What allows JavaScript functions to “remember” values from their surroundings?

Answer 151

closures / lexical environment