preface

Tip: Here you can add the general contents to be recorded in this article:
Summary of new features of ES6.

1.let and const

let represents a declared variable and const represents a declared constant.

• Constants cannot be changed once they are defined. Object, because the address pointed to by the object has not changed.
• const must be assigned when declaring.
• Both are block level scopes

Block level scope:

        The statements in any pair of curly braces () and {} belong to a block. All variables defined in this block are invisible outside the code block. We call it block level scope.

Function scope:

        Parameters and variables defined in a function are invisible outside the function.

Constants cannot be changed

const a=1;
a=0;//report errors

2. Template string``

You can use quotation marks ` ` to splice strings$ {} assign a value to a variable.

let a=6666;
console.log(`nihao${a}`); //nihao6666

3. Deconstruction

You can use {} to deconstruct arrays and objects.

//Create array
const foodList = ['Broccoli','Cauliflower','Pepper','meat'];
//Array structure
const [food1,food2,food3,food4]=foodList;

console.log(food1); //Broccoli
console.log(food2); //Cauliflower
console.log(food3); //Pepper
console.log(food4); //meat

//create object
const person={
    name: 'Xiao Ming',
    skill: 'dye one 's hair',
    color: 'white',
}
//Object parsing
const { name, skill, color } = person;

console.log(name); //Xiao Ming
console.log(skill); //dye one 's hair
console.log(color); //white

4. Default values of function parameters

Function arguments can have default values

function printText(text = 'default') {
    console.log(text); //default
}

5.Spread/Rest operator

The Spread/Rest operator refers to.

• When used in iterators, it is a Spread operator: iterators are a mechanism for traversing elements in one or more containers in a certain order

function foo(x,y,z){
    console.log(x,y,z);
}

let arr = [1,2,3];
foo(...arr); //1 2 3

• When used to pass arguments to a function, it is a Rest operator.

function foo(...arrs){
    console.log(arrs);
}

foo(1,2,3,4,5,6);// [1,2,3,4,5,6]

6. Arrow function

• The function keyword is not required to create a function
• Omit the return keyword
• This always points to the value of this under the scope where the function is declared

//es5
var fun = function(){

}

//es6
var fn = () => {

}

7.for of

• for of traverses the values in key value pairs
• for in traverses the keys in a key value pair

8.class

Class syntax is supported in ES6. However, the class of ES6 is not a new object inheritance model. It is only the expression of prototype chain syntax.

class Students{
    constructor(){
        console.log("I'm a student.");
    }
    
    study(){
        console.log('study!');
    }

    static read(){
        console.log("Reading Now.");
    }
}

console.log(typeof Student); //function
let stu = new Student();
stu.study(); // "study!"
stu.read(); // "Reading Now."

9. Import and export

• Import improve
• export default

10.promise

Promise is used to handle asynchronous requests more gracefully

new Promise((resolve,reject) => {
    setTimeout(function() {
        resolve('succeed!')
    }, 1000)
    // reject("failed, wuwu")
}).then(data => {
    console.log(data)
)}.catch(err => {
    console.log(err)
)}

11.async/await

Better resolution of callbacks than promise

async function(){
    await fn()
}

12.Symbol

New basic type

13.Set set

Store unique values of any type, that is, the elements saved in the collection are not repeated. Class array structure.

arr = [1, 2, 3, 1];
let arrNew = new Set(arr);
let ar = Array.from(arrNew);
console.log(ar) // [1, 2, 3]

Class array is not an array. It should be converted to array. From (arrannew), so that arrannew is an array.