ES6 Flashcards
What three new methods does ES6 introduce for identifying whether a given string contains a substring?
includes(), startsWith() and endsWith() // These won’t work with regular expressions
What are tagged template literals?
Functions that receive pieces of a template literal as arguments which you can manipulate and return as html.
How can you easily clone an array using rest parameters?
let […clonedArray] = myArray;
For function doSomething () { … } how can you get the name “doSomething” from within or without the function?
doSomething.name
How can you make sure a function was called with the ‘new’ keyword?
if (typeof new.target !== ‘undefined’) { // the function was called using new. This is better than checking if this instanceof Person, for example.
Make an arrow function into an immediately invoked function: (value) => {
doSomething(value)
return value;
}
Wrap in parens: ((value) => {…})(‘Something’)
What’s a tail call?
When a function is called as the last statement in another function the compiler has trouble optimizing.
How can you optimize for tail calls when they are necessary?
Don’t require access to variables in the current stack frame (the function can’t be a closure); the function making the tail call has no more work todo after the tail call returns; the result of the tail call is returned as the function value.
How does Object.is() work?
Accepts 2 arguments and returns true if they are the same type and value. Object.is(NaN, NaN); // true
How does Object.assign() work?
Object.assign(receiver, supplier); It takes two objects and adds the properties/values from supplier to receiver. It modifies receiver.
What does the super() method do? How does it work?
‘super’ is a pointer to the current object’s prototype. It’s like saying Object.getPrototypeOf(this). It must be inside a ‘concise’ method to work.
What is a concise method of an object literal?
Instead of var person = { getAge: function() { … } we can say var person = { getAge() { … } ,
Why send destructured parameters to a function? What does this mean/do?
It helps clarify what the function requires: function myFunction (name, value, { url, filename, size } = { } ) { ... } // Note: the parameters are required if you don't set a default
Add newItem onto the end of array someArray using spread operator
[ …someArray, newItem ]
How to make this work:
var a, b;
{a, b} = {a: 1, b: 2};
Move the destructing into parenthesis:
var a, b;
({a, b} = {a: 1, b: 2});
or use let/const/var
var {a, b} = {a: 1, b: 2};
Using destructing a variable can be assigned a default, in the case that the value unpacked from the object is undefined. How to do this?
var {a = 10, b = 5} = {a: 3};
console. log(a); // 3
console. log(b); // 5
var {a:aa = 10, b:bb = 5} = {a: 3};
what does this mean?
It’s an assigning to new variables names and providing default values
console. log(aa); // 3
console. log(bb); // 5
How to unpack User in whois parameter?
function whois(???) { console.log(displayName + ' is ' + name); }
var user = { id: 42, displayName: 'jdoe', fullName: { firstName: 'John', lastName: 'Doe' } };
The args should be
{displayName, fullName: {firstName: name}}
i.e. function whois({displayName, fullName: {firstName: name}}) {
console.log(displayName + ‘ is ‘ + name);
}
Give an example of computed object property names in destructuring
let key = 'z'; let {[key]: foo} = {z: 'bar'};
console.log(foo); // “bar”
Is it possible to use Rest in Object Destructuring
For arrays:
var [a, …b] = [1, 2, 3];
console.log(a); // 1
console.log(b); // [2, 3]
The Rest/Spread Properties for ECMAScript proposal (stage 3) adds the rest syntax to destructuring. Rest properties collect the remaining own enumerable property keys that are not already picked off by the destructuring pattern.
let {a, b, …rest} = {a: 10, b: 20, c: 30, d: 40}
a; // 10
b; // 20
rest; // { c: 30, d: 40 }
What will be printed?
function print(a, b, ...c) { console.log(a); console.log(b); console.log(c); }
print(…[3], …[1, 2, 12]);
3
1
[ 2, 12 ]
For the following function function print(a, b, ...c) { console.log(a); console.log(b); console.log(c); }
what would be printed in case x = [0, 5]; print([12, ...x, 10]); and x = [0, 5]; print(...[12, ...x, 10]); ?
[ 12, 0, 5, 10 ]
undefined
[]
vs
12
0
[ 5, 10 ]
What’d be in console?
x = [0, 5];
console. log(“Array: ${x[0]}, ${x}”);
console. log(‘Array: ${x[0]}, ${x}’);
console. log(Array: ${x[0]}, ${x}
);
Array: ${x[0]}, ${x}
Array: ${x[0]}, ${x}
Array: 0, 0,5
Template literals require ‘ticks’ - ` symbol
What’d be printed for custom tag like this:
console.log(lowerTag ${1} + ${2} EQUALS ${1+2}
);
let lowerTag = function (strings, ...values) { let result = ""; strings.forEach((s, i) => { result += s; if(i < values.length) result += values[i]; });
return result.toLowerCase(); }
1 + 2 equals 3