ES6 Flashcards
What is a code block? What are some examples of a code block?
A series of grouped code statements in curly braces. The body of a for loop, while loop, if statement, function.
What does block scope mean?
Variables declared within a containing code block are only accessible within that containing block.
What is the scope of a variable declared with const or let?
block scope
What is the difference between let and const?
A let variable can be reassigned another value after declaration
A constant can not be reassigned another value after declaration
Why is it possible to .push() a new value into a const variable that points to an array?
Although a constant can not be reassigned another value, if it points to an array, that array can be manipulated. Since the constant still points to the same array, reassignment is not occurring.
How should you decide on which type of declaration to use?
If you plan on never reassigning another value, then declare a constant.
If you plan on reassigning another value, then declare a let variable.
What is destructuring, conceptually?
- breaking up the structure
- in JavaScript, it is a shortcut for assigning array values and object properties to variables
What is the syntax for Object destructuring?
variable keyword followed by opening curly brace, property name (with optional colon and variable name), closing curly brace, assignment operator, and object name let { firstName: fname, lastName: lname } = person;
What is the syntax for Array destructuring?
variable keyword followed by opening bracket, variable names in indexed order, closing bracket, assignment operator, array name
let [x, y, z] = arrayName
How can you tell the difference between destructuring and creating Object/Array literals?
In destructuring, [] and {} are on the left hand side of the assignment operator and the name of the array or object is on the right hand side
What is the syntax for writing a template literal?
backtick, string, placeholder expressions, backtick
Fifteen is ${a + b} and not ${2 * a + b}.
What is “string interpolation”?
replacing placeholders with values in a template literal
What is the syntax for defining an arrow function?
( ) => { }
parameter (parenthesis if more than one parameter), followed by equal sign/arrow, followed by expression (optional curly braces/ return statement)
When an arrow function’s body is left without curly braces, what changes in its functionality?
It returns the result of the expression without a return statement
How is the value of ‘this’ determined within an arrow function?
It comes from the outer scope of its container in its definition, since it does not have its own reference to ‘this’ at call time like other functions
What is Array.prototype.filter useful for?
filtering an array into another array
What is Array.prototype.map useful for?
changing each element of an array, and putting those elements in a new array
What is Array.prototype.reduce useful for?
combining each element of an array into one element
What is “syntactic sugar”?
syntax which is easier to read but doesn’t change functionality
What is the typeof an ES6 class?
function
Describe ES6 class syntax.
class className { constructor(parameter) { this.parameter = parameter } method() { } }
What is “refactoring”?
restructuring code without altering its behavior
What is Webpack?
a module bundler for JavaScript applications
How do you add a devDependency to a package?
npm install –save-dev
What is an NPM script?
scripts (command line commands) in package.json that run at certain times of production
How do you execute Webpack with npm run?
npm run
How are ES Modules different from CommonJS modules?
ES Modules use import __ from ‘path’ and export default
CommonJS Modules use require(‘path’) and module.exports =
What kind of modules can Webpack support?
both EcmaScript and CommonJS and AMD modules
default export
can import without curly braces, and can name whatever you want
named exports
{} are needed and need to import by name
What is Babel?
toolchain to convert ECMAScript 2015 code into a backwards compatible version of JavaScript
What is a Plug-in?
component that adds a feature to an existing program
What is a Webpack loader?
a transformation applied to the source code of a module (can transform files from one language to Javascript)
How can you make Babel and Webpack work together?
install babel loader