1. Let and const commands

In ES5, there are only two variable declarations, var and function. In ES6, there are four new lets and const, as well as two more declarations of import and class. Let and const first, import and class will be added later

(1) the let

Let’s look at the basic syntax first

{
 let a = 10;
 var b = 1;
}
b // 1
a // ReferenceError: a is not defined.
Copy the code

We declared a, b in our code block. Then a is not defined. This is because the let command is only valid in the corresponding code block, we reference it externally, we will report an error. This is what the block-level scope of let looks like, if it’s not clear what a block-level scope is. Let’s look at the following example

var a = [];
for (var i = 0; i < 10; i++) {
  a[i] = function() { console.log(i); }; } a[0](); //10 a[6](); / / 10Copy the code

This is an old question. I is the global variable defined in the for loop. When we call a function. The I inside the function refers to the global I, so it prints out 10. We solved this earlier.

 var a = [];
    for (var i = 0; i < 10; i++) {
        a[i] = (function (a) {
            return function(){ console.log(a); } }(i)); } a[0](); //0 a[6](); / / 6Copy the code

We use the immediate-execute function to pass the value of I to the inner function so that the inner function can get the corresponding I.

We use let instead of var, and the final output is 6.

var a = [];
for (let i = 0; i < 10; i++) {
 a[i] = function() { console.log(i); }; } a[6](); / / 6Copy the code

This is because each time we loop we generate a new block-level scope that holds the value of I inside, so we print 6.

There is no variable promotion in LET

console.log(a); console.log(b); var a=0; //undefinedletb=0; //ReferenceError: b is not definedCopy the code

The TDZ(temporary dead zone) let command in a block-level scope affects the current block-level scope even if there is no variable promotion, i.e. it is bound to the current scope. Referencing variables outside the scope will cause an error.

 var a=10;
  {
      console.log(a);  //ReferenceError: a is not defined
      let a=10;
  }
Copy the code

Also, we get an error when using Typeof in TDZ.

console.log( typeof a); //undefinedCopy the code

console.log( typeof a); //ReferenceError: a is not definedlet a=10;
Copy the code

Let does not allow variables to be declared repeatedly

{
    var a=0;
    leta=1; //SyntaxError: Identifier'a' has already been declared
}
Copy the code

(2) the const constants

Const constant a variable that declares a read-only property, cannot be changed, cannot be declared and assigned, and generates block-level scope.

const a; //SyntaxError: Missing initializerinConst declaration(const declaration lacks an initializer) A =10;Copy the code

It has a lot in common with let. . Do not repeat the declaration

const a=10; var a=10; //SyntaxError: Identifier'a' has already been declared
Copy the code

. Variables do not promote

console.log(a)//ReferenceError: a is not defined
const a=10;
Copy the code

.There are also temporary dead zones

var a=10; { console.log(a); //ReferenceError: a is not defined const a=10; }Copy the code

In addition, how does const guarantee that the value of a constant is not modified? Const doesn’t really change the value of a constant on the stack. If the value is a primitive data type, const keeps the value unchanged. If the value is a reference type, the stack actually holds the address of the constant. The address cannot be changed, but the heap contents of the corresponding address can.

Const a = [1, 2, 3] Amy polumbo ush. (4) the console log (a); / / [1, 2, 3, 4]Copy the code

Obviously, we are directly changing the contents of the heap and indirectly changing the value of the const constant through push.

To make constants work, you can use object.freeze ()

Var a = [1, 2, 3]; Object.freeze(a) a.push(4) //Cannot add property 3, object is not extensibleat Array.push console.log(a);Copy the code

2. String extension method

(1) for of string traversal

You can use for of to iterate over strings and break them up into separate strings

var a='lang'
for (item of a){
  
   console.log(item);
} 
// l
// a
// n
// g
Copy the code

(2) codePointAt string query.

Query the corresponding string based on the subscript. In Es5, there was a charAt () method. But charAt () apparently didn’t realize that as Unicode encodings expanded, the original 0x0000-0xFFFF characters were no longer enough to represent all characters.

var text = "𠮷";
text.charAt(0); //' '
text.charAt(1); //' '
Copy the code

So es6 added codePointAt (), a query, with better Unicode support for characters >0xFFFF.

var text = "𠮷"; console.log(text.codePointAt(0)); / / 134071Copy the code

(3) Determination of includes() value

Prior to ES6, use of Indexof could also be used for value presence determination. Includes and Indexof can be used to determine both strings and array values, but indexof can be inaccurate in determining NaN.

var text = [1,NaN] console.log(text.indexOf(NaN)); / / 1Copy the code

In addition, indexof to return the result of 1 | | 0, includes to true | | false.

(4) Repeat () string

STR =repeat(n) returns the new string and repeats the string of STR n times.

var a='lang'console.log(a.repeat(3)); //langlanglangCopy the code

N is rounded automatically. N < = 1 | | n = = infinaty will be an error.

(5) startwith, endwith.

StartWith (‘ STR ‘,n) : Returns a Boolean value indicating whether the parameter string is at the head of the original string.

EndsWith (‘ STR ‘,n) : Returns a Boolean value indicating whether the argument string is at the end of the original string. Where STR represents the value to be judged, and n represents the number of elements in the target string to start from.

 var str='hello world'
 console.log(str.startsWith('hello', 0)); //true
 console.log(str.startsWith('world', 6)); //true
 console.log(str.startsWith('world', 0)); //false
Copy the code

(6) padStart(), padEnd()

Es6 provides additional methods String two strings. The prototype. PadStart and String. Prototype. PadEnd, convenient we will a new String appended to the end of a String.

We often use padstart to keep strings formatted for output.

 var a='abc'
 var b='abcd'
 var c='abcd'
 console.log(a.padStart('10', 0)); console.log(b.padStart('10', 0)); console.log(c.padStart('10', 0)); //0000000abc //000000abcd //00000abcdeCopy the code

But sometimes it’s clearly better to use EndStart.

var a='abc'
 var b='abcd'
 var c='abcde'
 console.log(a.padEnd(10,'-- -- -- -- -- -- --)); 
 console.log(b.padEnd(10,'-- -- -- -- -- -- --));
 console.log(c.padEnd(10,'-- -- -- -- -- -- --));
 //abc-------
 //abcd------
 //abcde-----
Copy the code

It can also be used in combination for effect

var obj={
  name:'wangcai',
  car:'BMW',
  wife:'fatgirl'
}
for(var item in obj){
  console.log(item.padEnd(10,The '-') +'value:'+obj[item].padStart(10,'* *'));
}
//name------value:***wangcai
//car-------value:*******BMW
//wife------value:***fatgirl
Copy the code

(7)** template string

The introduction of template strings is one of the highlights of ES6, making output templates concise and convenient. The template uses backquotes (‘ ‘) and supports output in a variety of formats. Including newlines, Spaces, variables, expressions, call functions and so on. We can combine them in a template

var age=22;
var name='lang'
var say=()=>{
  return 'hello'
}
var str=`myname is${name} my age is ${age} and i can say ${say()}`
console.log(str);  //myname islang my age is 22 and i can say hello
Copy the code

You can write any expression in the template string ${}, but again, if/else judgments and loops are not handled.

But a lot of times we need to use if or loops. We can use logic to process statements externally, then generate a template we want, and then escape with ‘ ‘

var age=22;
var name='lang'
var name2='Lang'
var str=' '
var say=()=>{
  return 'hello'
}
if(age>=18){str=name2}
var str=`myname is${str} my age is ${age} and i can say ${say}`
console.log(str);  //myname isLang my age is 22 and i can say hello
Copy the code

Of course, we can also use arrays, storing individual template fragments into an Array and finally concatenating them into the final template using array.join (” “).

3. Numerical extension method

(1) Binary and octal representation

In es5’s strict mode, binary and octal were no longer available. Two new binary and octal notation are available in ES6.

Binary (0 BXXX | | 0 BXXX) octal (0 oxxx | | 0 oxxx)

'use strict'var a=0b11; var b=0o11 console.log(a); //3 console.log(b); / / 9Copy the code

(2)Number.isNaN()

IsNAN can be used to check if data is of NAN type. Only NAN returns true, and all other types return false.

var x=NaN*2 console.log(Number.isNaN(x)); //trueconsole.log(NaN==NaN); //falseconsole.log(NaN===NaN); //false
Copy the code

(3)Number.parseInt(), Number.parseFloat()

These two methods already exist in ES5, which pulls them out of the global object and into the Number object

(4) Number. IsIntger ()

Var a = 3.00 var b = 10; var c=false; Var d = 4.00000000000000000000000000000002 the console. The log (Number. IsInteger (a)); //trueconsole.log(Number.isInteger(b)); //trueconsole.log(Number.isInteger(c)); //falseconsole.log(Number.isInteger(d)); //true
Copy the code

Only integer and floating point number like 3.0 will be considered to be an integer, return true, besides, js operation is not precise, value, beyond the precision will default to o, so 4.0000000000000000000000002 will be seen as 4. (5) math.h trunc ()

The value is rounded by Number (), math.floor () for positive numbers, math.ceil () for negative numbers;

The console. The log (math.h trunc (4.1)); / / 4 console. The log (math.h trunc (4.9)); / / 4 console. The log (math.h trunc (1.2)); The console / / - 1. The log (math.h trunc (1.9)); //-1 console.log(Math.trunc(true)); //1 console.log(Math.trunc('lang')); //NaNCopy the code

3. Function extension

(1) The function can specify default values for parameters passed by the function, which can be overridden internally.

functionsay(x,y=5){ console.log(x,y); / / 1, 5 y = 10; console.log(x,y); / / 1, 10} say (1)Copy the code

Two points need to be noted

. When default values are used, functions cannot have arguments of the same name.

/ / is not an errorfunctionfoo(x, x, y) { // ... } / / an errorfunction foo(x, x, y = 1) {
  // ...
}
// SyntaxError: Duplicate parameter name not allowed in this context
Copy the code

. Cannot be repeated with let, const

function say(x,y=5){
  let y=10;
  console.log(x,y);  //SyntaxError: Identifier 'y' has already been declared
 }
 say(1)
Copy the code

(2) Rest arguments are used in function parameters… Extension operator to pass an amorphous parameter into a REST array.

functionsay(... res) {for (var item of res) {
     console.log(item);
   }
 }
 say(1, 2, 3)  
 //1
 //2
 //3
Copy the code

(3) Arrow function (emphasis)

Basic usage

 var f=(x,y)=>{ returnX + y} the console. The log (f (1, 2)); / / 3Copy the code

If (x, y) has only one argument, we can omit (), and if the return statement has only one argument, we can omit ().

var f=x=>x+10 console.log(f(1)); / / 11Copy the code

The use note arrow function has several use note points.

(1) The this object inside the function is the object at which it is defined, not the object at which it is used.

(2) Cannot be used as a constructor, that is, cannot use the new command, otherwise an error will be thrown.

(3) You can’t use arguments. This object does not exist in the function body. If you do, use the REST argument instead.

(4) Yield cannot be used, so arrow functions cannot be used as Generator functions.

The first point to note is that we often have trouble maintaining this in callback functions, whereas we do not have this problem in arrow functions, where this is fixed and does not change with function calls.

In ES5, we usually save this externally to maintain this,

// ES6
function foo() {
  setTimeout(() => {
    console.log('id:', this.id);
  }, 100);
}

// ES5
function foo() {
  var that= this;

  setTimeout(function () {
    console.log('id:', that.id);
  }, 100);
}
Copy the code

Argumet does not exist in the arrow function. Argument will use the argument of the external function

function foo() {
  setTimeout(() => {
    console.log('args:', arguments);
  }, 100);
}

foo(2, 4, 6, 8)
// args: [2, 4, 6, 8]
Copy the code

(4) calls

Calling a function at the last step of the function is called a tail call. The explanation is simple, but confusing. .Last step? What is the last step? In a function, return is the last step, and nothing without return is the last call.

 function g() {}function f(){g() // This is not the end call} f()Copy the code

Even if there is an expression after a return, but these functions do not work, it is still a trailing call.

 function g() {}function f() {returnG () // This is the end call to console.log('121');
}
f()
Copy the code

. Returns a function, not an expression. In the following example, g () +1 is returned; G () + 1; It’s not a function, it’s an expression.

 function g() {}function f() {returnG ()+1 // This is not the end call} f()Copy the code

(5) tail recursion

Tail recursion is a special case of tail invocation, but tail recursion is calling itself at the last step.

When we use recursion, we must give a termination condition, otherwise we will create an endless loop

var a=0;
  function f(){
   a++
   return} f()} f()Copy the code

We often use recursion to solve factorial and so on, but recursion is very prone to stack overflow.

The non-tail recursive Fibonacci sequence is implemented as follows.

function Fibonacci (n) {
  if ( n <= 1 ) {return 1};

  returnFibonacci(n - 1) + Fibonacci(n - 2); } Fibonacci(10) // 89 Fibonacci(100) // stack overflowCopy the code

The tail-recursively optimized Fibonacci sequence is implemented as follows.

function Fibonacci2 (n , ac1 = 1 , ac2 = 1) {
  if( n <= 1 ) {return ac2};

  return Fibonacci2 (n - 1, ac2, ac1 + ac2);
}

Fibonacci2(100) // 573147844013817200000
Fibonacci2(1000) // 7.0330367711422765e+208
Fibonacci2(10000) // Infinity
Copy the code

4. Array expansion

(1) Extension operator (…)

It is possible to copy an array directly using the extension operator. Modifying a reference value in one array does not change another value

Var arr = [1, 2, 3, 4, 5), 6] var a = arr [...]; console.log(a); //[1, 2, 3, Array(2), 6]Copy the code

Extension operators can be used for array concatenation

Var arr=[1,2,3] var arr2=[4,5,6] var STR ='12121'
 var a=[1,...arr,2,...arr2];
Copy the code

In addition… Arr does not return an array, but the values of each array. Only […arr] is an array, so… Arr. Can be used to pass values to methods

Var arr = [1, 2, 3]function f(x,y,z){
    returnx+y+z } console.log(f(... arr)); / / 6Copy the code

(2)Array.from()

Array.from() can convert some pseudo-arrays to real Array results. What are pseudo-arrays? In real development, there are two common types of pseudo-arrays, arguments and the collection of elements retrieved from Dom.

<body>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
</body>
<script> 
 var arr = document.getElementsByTagName('p') var arr2 = Array.from(arr) console.log(Array.isArray(arr2)); //true
Copy the code

There are also two other methods that can convert a pseudo-array to an array. The extension operator mentioned earlier

 var arr = document.getElementsByTagName('p') var arr2 = [...arr] console.log(Array.isArray(arr2)); //true
Copy the code

. Use the call, apply method.

 var arr = document.getElementsByTagName('p') var newarr=Array.prototype.slice.call(arr,0) var newarr=Array.prototype.slice.apply(arr,[0]) console.log(Array.isArray(newarr)); Slice (start subscript, end subscript) return value: array, which is a part of the old array. console.log(newarr);Copy the code

(3)Array.of()

It’s also used to convert a set of values into an array. Array.of is not used to convert pseudo-arrays. It is used to make up for the shortcomings of the Array constructor

var arr=new Array(3) console.log(arr); //[empty*3]Copy the code

Obviously, we want to build one [3], using array.of ()

var arr=Array.of(3) console.log(arr); / / [3]Copy the code

(4) find and findIndex query the first conditional value/index

Find: Used to find the first array element that matches the criteria. Find not return undefined.

FindIndex: Returns the index of the first eligible array element. Can’t find return -1;

Var arr = [1, 2, 3, 4, 5] var newarr1 = arr. Find (function(item,index){return item>2})
var newarr2=arr.findIndex(function(item,index){returnitem>2}) console.log(newarr1); //3 console.log(newarr2); / / 2Copy the code

The basic syntax is as follows: Find and findIndex are internal callback functions that return a query condition. Find executes the return condition and searches for the first value that meets the condition. Findindex returns the index. We can just use the arrow function for shorthand

Var arr=[1,2,3,4,5] var newarr1=arr.find(item=>item>2) var newarr2= arr.findindex (item=>item>2) console.log(newarr1); //3 console.log(newarr2); / / 2Copy the code

Initialize the array with fill

Fills an array with a value. The Fill method is handy for initializing an empty array. Existing data will be overwritten. The fill method can also accept a second and third parameters that specify where the fill starts and ends

Var arr = [1, 2, 3, 4, 5] arr. The fill (The '*', 1, 3) the console log (arr); / / [1,"*"."*", 4, 5]
Copy the code

5. Object extension

(1). Abbreviation of attribute

Property names can be abbreviated, but only if the value of the property is a variable and the variable name is the same as the key name.

var name ='lang'
var age=22;
var obj={
name:name,
age:age
}
Copy the code

Objects like this, we can abbreviate them

var name ='lang'var age=22; Var obj={name, age,}Copy the code

The prerequisite is that the property name and value must be the same.

(2) Method shorthand

var obj={
say:function(){}
}
Copy the code

Shorthand for

var obj={
say(){}
}
Copy the code

(3) Fine set the properties of the object

Four characteristics of an attribute:

1. Signals: Indicates whether the system can be deleted. The default is true and can be deleted:

2. Writable: Indicates whether it can be modified. The default is true and can be modified:

3. Enumerable: Can we enumerate? You can use for in, which defaults to true, to enumerate:

4. The value: the value. The default value is undefined

Format 1: Object.defineProperty(Object name, ‘attribute name’, {four features above});

var obj={
  name:'lang',
  age:22
}
 Object.defineProperty('obj'.'name',{
   configurable:false,
   writable:false,
   enumerable:false
 })
Copy the code

Format 2: Object.defineProperties(Object name, {attribute name {four attributes}}, {attribute name {four attributes}}});

  var obj = {
   name: 'lang',
   age: 22
 }
 Object.defineProperties(obj, {
   name: {
     configurable: false,
     writable: false,
     enumerable: false
   },
   age: {
     configurable: false,
     writable: false,
     enumerable: false}})Copy the code

(4) Get the properties of the fine Settings object

Obect. GetOwnProertyDescriptor (object, attribute name) to get the object refinement of attribute values.

var obj={
name:'lang',
age:22
}
Object.defineProperty(obj,'name',{
 configurable:false,
 writable:false,
 enumerable:false
})

console.log(Object.getOwnPropertyDescriptor(obj,'name'));
Copy the code

(5)Object.keys()

Use Object. GetOwnPropertyNames () and the Object. The keys () can be an Object attribute name, attribute name is on the of an array.

var obj={
name:'lang', age:22 } console.log(Object.keys(obj)); / / /"name"."age"]
Copy the code

So now we have three ways of traversing an object and there are three ways of traversing an object:

        1. for in

        2.Object.keys()

        3.Object.getOwnPropertyNames()
Copy the code

For in: outputs enumerable properties for itself and the stereotype chain.

Keys () : Used to get the enumerable property keys of the Object itself

Object. GetOwnPropertyNames () : all the property name used to retrieve the Object itself

(6) the Object. The values ();

Gets the value of an object and places it in an array.

var obj={
  name:'lang', age:22 } console.log(Object.values(obj)); / / /"lang", 22]
Copy the code

6. Deconstruct assignments

The destruct assignment syntax is a Javascript expression that makes it possible to extract values from arrays or properties from objects into different variables.

Object literals and array literals provide a simple way to define a particular set of data.

let x = [1, 2, 3, 4, 5];
Copy the code

Destruct assignment uses the same syntax, except that the left side of the expression defines what variables to extract from the original.

var x = [1, 2, 3, 4, 5]; var [y, z] = x; console.log(y); // 1 console.log(z); / / 2Copy the code

(1) Array deconstruction

Destruct when variables are declared and assigned

var foo = ["one"."two"."three"];

var [one, two, three] = foo;
console.log(one); // "one"
console.log(two); // "two"
console.log(three); // "three"Link to section deconstructs variables when they are declared first and then assignedCopy the code

You can assign a value to a variable by deconstructing the declaration of separating variables.

var a, b; [a, b] = [1, 2]; console.log(a); // 1 console.log(b); // 2 Link to section default valueCopy the code

To prevent an object with a value of undefined from being pulled out of the array, you can set a default value for the object.

var a, b; [a=5, b=7] = [1]; console.log(a); // 1 console.log(b); // 7 Link to section swaps variablesCopy the code

You can swap the values of two variables in a destructed expression.

Swapping two variables without a deconstructed assignment requires a temporary variable (or the Low-level xor-swap technique).

var a = 1; var b = 3; [a, b] = [b, a]; console.log(a); // 3 console.log(b); // 1 Link to section parses an array returned from a functionCopy the code

It is quite common to return an array from a function. Deconstruction makes it easier to deal with arrays of return values.

In the following example, [1, 2] is the output value of the function f(), which can be parsed in one sentence using destruction.

function f() {
  return[1, 2]; } var a, b; [a, b] = f(); console.log(a); // 1 console.log(b); / / 2Copy the code

(2) Object deconstruction

The basic assignment

var o = {p: 42, q: true};
var {p, q} = o;

console.log(p); // 42
console.log(q); // true
Copy the code

Assign the new variable name

Variables can be extracted from an object and assigned to new variable names that are different from the object property names.

var o = {p: 42, q: true};
var {p: foo, q: bar} = o;
 
console.log(foo); // 42 
console.log(bar); // true
Copy the code

The default value

Variables can be assigned default values first. When the object to be extracted has no corresponding attribute, the variable is given a default value.

var {a = 10, b = 5} = {a: 3}; console.log(a); // 3 console.log(b); / / 5Copy the code

Mixed deconstruction (nested objects and arrays) Deconstruct nested objects and arrays

var metadata = {
    title: "Scratchpad",
    translations: [
       {
        locale: "de",
        localization_tags: [ ],
        last_edit: "2014-04-14T08:43:37",
        url: "/de/docs/Tools/Scratchpad",
        title: "JavaScript-Umgebung"
       }
    ],
    url: "/en-US/docs/Tools/Scratchpad"
};

var { title: englishTitle, translations: [{ title: localeTitle }] } = metadata;

console.log(englishTitle); // "Scratchpad"
console.log(localeTitle);  // "JavaScript-Umgebung"
Copy the code

7. Class class

In ES5, how do we implement the functionality of a class? We usually use the constructor method to implement, however, using the constructor to imitate the class implementation is not convenient, not only need to constantly maintain this, and when inheriting, not only need to use call to copy the basic values of the parent class, but also need to inherit the prototype of the parent class to inherit methods. Let’s take a quick look at the code

   function Parent(name) {
        this.name = name;
    }
    Parent.prototype.sayName = function () {
        console.log('parent name:', this.name);
    }

    function Child(name, parentName) {
        Parent.call(this, parentName);
        this.name = name;
    }

    functioninheritPrototype(Parent, Child) { Child.prototype = Object.create(Parent.prototype); / / modify the Child. The prototype. The constructor = Child; } inheritPrototype(Parent, Child); Child.prototype.sayName =function () {
        console.log('child name:', this.name);
    }

    var parent = new Parent('father');
    parent.sayName();      // parent name: father

    var child = new Child('son'.'father');
    child.sayName();       // child name: son
Copy the code

In ES6, we can define classes directly, which should be easy to understand if you have A Java background. Basically, ES6 classes can be seen as a syntactic candy that does most of what ES5 does. The new class writing method simply makes object prototype writing clearer and more like object-oriented programming syntax.

Class Point {constructor(x, y) {this.x = x; this.y = y; }toString() {
   return '(' + this.x + ', ' + this.y + ') '; }}Copy the code

When we use typeof to examine the data typeof a class, we see that the class class is essentially a method, or constructor. Not only can we use the new method to create a new class, we can also use Prototype to access the class’s prototype.

(1) constructor

You can see that there is a constructor method, which is the constructor, and the this keyword represents the instance object. This usually holds the class base data type

(2) Define class methods

We can add our own methods directly to the class without using the keyword function. In addition, in order to make the class more common, we have removed the comma separation, so we do not need to use commas to separate methods.

(3) Class inheritance

Es6 also provides a method of extending extends to classes. It is used in the same way as Java.

 class NBAPlayer2 {
       constructor(name, height) {
           this.name = name;
           this.height = height;
       }
       say() {
           console.log(`name is${this.name} height is${this.height}`);
       }
   }
   class MVP2 extends NBAPlayer {
       constructor(name, height, year) {
           super(name, height)
           this.year = year
       }
       say() {
           console.log(`name is${this.name} height is${this.height} mvpyear is${this.year}`);
       }
   }
   var n1 = new MVP2('Old Curry'.'201'.'2016')
   var m1 = new NBAPlayer2('Old Curry'.'201')
   n1.say()
   m1.say()
Copy the code

Note: To use the extends keyword to implement inheritance in a subclass constructor, you must explicitly call the super method of the superclass. If not, this is not available

If we use stereotypes to look at parent-child classes, we see that they actually inherit through the stereotype chain.

At the end

There are many new ES6 features, but this time I’ve outlined some of the more common ones. Suitable for those who are new to ES6 to have a general understanding of ES6.

More on es6 features will be added later. Specific important contents are as follows

1. Promise

2.Generator

3. The async function

4. The Module syntax

For more details, see Ruanda’s Introduction to ECMAScript 6