ES6

Question 1

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

Answer 1

Code surrounded by curly brackets. If statements, for loops, function definitions

Question 2

What does block scope mean?

Answer 2

Exists within curly braces {}

The scope is based on the container code block

Question 3

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

Answer 3

block-scoped

Question 4

What is the difference between ‘let’ and ‘const’?

Answer 4

Let values can be resigned while const can’t be resigned

const is a ‘read-only’ reference to a value

Question 5

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

Answer 5

Objects are mutable, we are not reassigning the const variable, just updating the array

The value of ‘const’ variable is mutable; you can change the value of the property.

Question 6

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

Answer 6

If variable is reassigned, use let.

if variable doesn’t reassigned, use const

Question 7

What is the syntax for writing a template literal?

Answer 7

Use backticks `

Backticks beginning and end of template literal; ${} to embed in literal “${expresstion}”

Question 8

What is “string interpolation”?

Answer 8

Substitute result of expressions into a string; using ${} syntax

Replace variables and expressions in a string through substitution in template literals using a special block.

Question 9

What is destructuring, conceptually?

Answer 9

Assigning properties of an object to a variable (different or same name).

Question 10

What is the syntax for ‘Object’ destructuring?

Answer 10

let/const/var {
property1: variable1,
property2: variable2
} = object;

Question 11

What is the syntax for ‘Array’ destructuring?

Answer 11

let/const/var [variable1, variable2] = array;

Question 12

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

Answer 12

Brackets on left hand side of ‘=’ for destructuring; creating will be on right hand side

Question 13

What is the syntax for defining an arrow function?

Answer 13

let add = (x,y) => x + y;
let add = (x, y) => { return x + y; };

Use parenthesis for parameters if 0 and more than 1 parameters. 1 parameter does not need it; use curly braces if more than one line of code

Question 14

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

Answer 14

You don’t need a return statement

if you use an expression in the body of an arrow function, you don’t need to use the curly braces. However, if you use a statement, you must wrap it inside a pair of curly braces

Question 15

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

Answer 15

Arrow function, ‘this’ is defined at definition time, not call time.

‘this’ goes to global scope or first non arrow function

arrow function captures the ‘this’ value of the enclosing context instead of creating its own this context.

Question 16

What are the three states a Promise can be in?

Answer 16

pending: initial state, neither fulfilled nor rejected.
fulfilled: meaning that the operation was completed successfully.
rejected: meaning that the operation failed.

Question 17

How do you handle the fulfillment of a Promise?

Answer 17

then() method

const promise1 = new Promise((resolve, reject) => {
  resolve('Success!');
});

promise1.then((value) => {
console.log(value);
// expected output: “Success!”
});

Question 18

How do you handle the rejection of a Promise?

Answer 18

catch() method

const promise1 = new Promise((resolve, reject) => {
  throw 'Uh-oh!';
});

promise1.catch((error) => {
console.error(error);
});
// expected output: Uh-oh!

Question 19

What is “syntactic sugar”?

Answer 19

Syntax to make code cleaner and “easier” to read and understand

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 20

What is the ‘typeof’ an ES6 class?

Answer 20

Function

Question 21

Describe ES6 class syntax.

Answer 21

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

Question 22

What is “refactoring”?

Answer 22

the process of restructuring existing computer code—changing the factoring—without changing its external behavior.

Question 23

How are ES Modules different from CommonJS modules?

Answer 23

If not default export, use curly bracket from module importing, if exporting multiple functions

CommonJS: require() and module.exports
ES Modules: export [default] function myFunction{ };
import myFunction from ‘function.js’;
import {myFunction1, myFunction2} from ‘function.js’;
import * as function from ‘./function.js’

Question 24

What kind of modules can Webpack support?

Answer 24

ECMAScript modules, CommonJS modules, AMD modules, Assets, WebAssembly modules.