ES6/JSX/REACT Flashcards
What is a code block? What are some examples of a code block?
a lexical structure of source code which is grouped together. if, else, while, for loop, do while
What does block scope mean?
within the curly braces, the only place this thing would exist
What is the scope of a variable declared with const or let?
block scoped
What is the difference between let and const?
let can be reassgined and const can not
Why is it possible to .push() a new value into a const variable that points to an Array?
if the const object is an object or array its properties or items can be updated or removed but not reassigned
How should you decide on which type of declaration to use?
every thing should be a const, until you have a variable that will be reassigned.
What is the syntax for writing a template literal?
wrap your text in backticks and for substitution we use ${}
What is “string interpolation”?
when you substitute part of the string for the values of variables or expressions.
What is destructuring, conceptually?
Its something that allows us to access properties inside of an object or indexes inside an array, and then store that information into a new variable
What is the syntax for Object destructuring?
const{ property1: variable1} = object;
What is the syntax for Array destructuring?
const foo = [“one”, “two”, “three”];
const [red, yellow, green] = foo;
console.log(red); // “one”
console.log(yellow); // “two”
console.log(green); // “three”
How can you tell the difference between destructuring and creating Object/Array literals?
The difference is if the curly braces is on the left side, it is object/array destructuring and if its on the right side, we’re creating a new object.
What is the syntax for defining an arrow function?
const add = (x, y) => { return x + y; };
const sample = x => {}
const sample = ()=>2+2
When an arrow function’s body is left without curly braces, what changes in its functionality?
implicit “return”. The braces can only be omitted if the function directly returns an expression.
const add = (x, y) => { x + y; };
Nao ia dar certo pq com o {}, nao tem mais o implicit return
How is the value of this determined within an arrow function?
its going to be based on lexical this.
an arrow function captures the this value of the enclosing context instead of creating its own this context.
What are the three states a Promise can be in?
pending: initial state, neither fulfilled nor rejected.
fulfilled: meaning that the operation was completed successfully.
rejected: meaning that the operation failed.
How do you handle the fulfillment of a Promise?
promise1.then((value) => {
console.log(value);
});
What is Array.prototype.filter useful for?
To return a new array with all the elements that pass the test implemented by the callback() function.
What is Array.prototype.map useful for?
Array.map() method allows you to iterate over a new array and modify its elements using a callback function.
For each does the same thing as .map() but the difference is that it does not return a new array
What is Array.prototype.reduce useful for?
The array reduce in JavaScript is a method used to reduce an array to a single value by passing a callback function on each element of the array.
What is “syntactic sugar”?
syntactic sugar is syntax within a programming language that is designed to make things easier to read or to express
What is the typeof an ES6 class?
function
Describe ES6 class syntax.
class Person {
constructor(name) {
this.name = name;
}
getName() {
return this.name;
}
}
let john = new Person(“John Doe”);
let name = john.getName();
console.log(name); // “John Doe”
What is “refactoring”?
code refactoring is the process of restructuring existing code without changing its external behavior.
What is Webpack?
Its a program that allows us to take all of our script files and combine them into one file
How do you add a devDependency to a package?
npm install <package-name> --save-dev</package-name>
