ES6 Flashcards
What is a code block? What are some examples of a code block?
- Portions of code denoted by curly braces {}.
- Some examples are if/else, for, while, try/catch.
What does block scope mean?
Variables declared within that code block can’t be accessed by code outside of the block
What is the difference between var and let?
Var adds the variable to the property list of the global object (window for browsers) —> let does not.
What is the scope of a variable declared with const or let?
They’re both block scoped.
What is the difference between const and let?
- Block-scoped variables assigned by const keyword can not be reassigned.
- You also have to initialize a value to the variable declared by const —> you don’t have to immediately with let.
Why is it possible to .push() a new value into a const variable that points to an array?
The array is not immutable, it can change. It’s just the variable that stores the array that can’t be changed.
How should you decide on which type of declaration to use?
Unless you’re positive you’re going to change the memory pointer, use const.
What is the syntax for writing a template literal?
Use backticks (string-goes-here)
What is string interpolation?
The ability to substitute part of the string for the values of variables or expressions
What is destructuring, conceptually?
Taking an array or object and assigning some OR all values to corresponding variables
What is the syntax for Object destructuring?
Let { property1: variable1, property2: variable2 } = object
What is the syntax for Arrray destructuring?
[a, b, c] = [value1, value2, value3] OR let [x, y, z] = getScores( )
•How can you tell the difference between destructuring and creating Object / Array literals?
The variables are always wrapped in an object / array and the sides are swapped.
What is the syntax for defining an arrow function?
Const functionName = (parameters) => {code block w/optional return}
If an arrow function only has one parameter, we can…
Remove the parenthesis entirely
When an arrow function’s body is left without curly braces, what changes in its functionality?
Implicit return—> curly braces need an explicit return
What determines the ‘this’ inside of a function created with the function keyword?
It’s determined by what is to the left of the dot when the function is called
This is the window object by default —> for methods its the object attached to that method
How is the value of this determined within an arrow function?
It’s a ‘lexical’ this —> this is determining by the surrounding scope
Before ES6, how did we change the binding of this to be the appropriate object instead of the window?
Use the bind method with the ‘this’ passed in as an argument
When do we need to be extra cautious about ‘this’?
When using callback functions!
What are the two ways to fix the binding of this within callback functions?
- Use the bind keyword
- Use arrow functions
What are two large differences between defining functions using the function keyword and arrow functions?
- Function definition also has access to the arguments keyword which allows you to loop through the arguments passed into the function
- Arrow functions don’t bind the this —> they take the this from the enclosing scope
What are the three states a promise can be in?
Pending, fulfilled, rejected
How do you handle the fulfillment of a promise?
Use .then(firstArgFx)
How do you handle the rejection of a promise?
Use .then(secondArgCbFx) OR .catch
How are ES Modules different from CommonJS modules?
CommonJS uses require & module.exports whereas ES modules use import / export.
What kind of modules can Webpack support?
It natively supports ES modules, CommonJS modules, and AMD modules
The two types of ES6 exports are…
Default exports (can be assigned any name in import file)
Named exports (have to be assigned same name in import file)
Why index.js?
We often import things from a lib folder —> create an index.js for that folder and then pull all of the imports from the index.js for that folder
