ES6 Flashcards
What is Babel?
(The most popular es6 transpiler)
• Transpiles es6 into the supported pre-es6 JS so browsers can read the newer version.
What is a “transpiler”?
A transpiler reads code written in one language and produces the equivalent code in another.
Why do we need transpilers?
- We need transpilers so that our pretty es6 code compiles into the dense JavaScript code that browser like.
- Browsers only currently have widespread support of older JS
- Transpilers convert advanced TypeScript and CoffeeScript code back into the original JS
Benefits of webpack
Using webpack allows us to create an environment that transforms es6 code with babel.
• It combines multiple modules into one js file to reduce errors and resources on the client-side.
• Shipping with a development server, it gives us live code updating for free!
What is weppack
Webpack is an open-source JavaScript module bundler. It is a module bundler primarily for JavaScript, but it can transform front-end assets like HTML, CSS, even images if the corresponding plugins are included.
{variable name} some words
template literals
{…variable name}. Inserts the content of one variable into another variable by inserting …variableName
Spread Operator
The ‘var’ keyword allows for block scoping?
False. It does not allow block scoping. Re-using the same variable with ‘var’ twice in coding blocks will overwrite data.
Which es6 keyword declares a variable that cannot be re-assigned or re-declared?
const
___ replaces var in es6 in term of variable assignment.
let
T or F: “let” allows for block scoping.
True
T or F: “const” allows for block scoping
True
_____ scope refers to the set of statements, variables, objects, and more that confine to a coding block denoted by a pair of curly braces: {…}
Local
____ scope refers to the set of statements, variables, objects, methods, and more that exist outside and beyond all local scope functions and coding blocks.
Global
____ ______ allow for the gathering of multiple parameter calls into one array: Denoted by three periods.
Rest parameter
Destructuring assignment on arrays allows for much more efficient array manipulation and assigns multiple variables from array data based on the index value.
just remember
Destructuring assignment on objects allows for more concise object manipulation and assigns multiple variables from object data based on keynames.
just remember
By default, _____ functions are anonymous.
anonymous
() => {} : This syntax is…
an arrow function
The ____ _____ creates new arrays by calling a function on individual
map method
The ____ _____ creates new arrays based on an original array and a certain test on each of its element.
filter method
The most common ways you’ll see arrow functions show up in es6 code is with _____ methods.
helper
What are modules?
Split code into unique files baed on relevant data.
Enables us to split our code into files based on relevant information.
We handle modules in es6 with the _____ and _____ keywords.
import and export
_____ keyword sends data to other modules
export
What are anonymous function expressions?
Function expressions that don’t explicitly assign a name to the function like a function declaration does.
Change the code below to an arrow function:
setTimeout (function() {
console.log(“Woohoo!”);
}, 3000);
setTimeout (() => {
console.log(“Woohoo!”);
}, 3000);
Change the code below to a string literal template:
let b = “wooh” + “oo”.repeat(50) + “oo”;
console.log(b);
let b =`wooh${"oo.repeat(50)}`; console.log(b);
T or F: Arrow functions are anonymous by default
True. Anonymous functions are always anonymous because they do not use the ‘function declaration.