In 2022, it will be es2022 soon. Do you only know the new features of ES6?

2022 year , Right now ES2022 了 , Still watching ES6 Knowledge points of ？

During the interview , Interviewers always like to ask questions you know ES6 What are the new properties of ？

actually ,ES6 All are 2015 The standard issued in , Now are all 2022 year , Also take this exam , It's a little out of date .

Today I'll take you to clean up , Over the years , from ES2015(ES6) To ES2021 What features have been added

One 、ES2015(ES6)

newly added let const Used to declare variables const a = 1 ; let b = 2

New variable deconstruction let [a, b, c] = [1, 2, 3];

Strengthen the right Unicode Code support ‘\u007A’ === ‘z’ // true

increase String Property method of fromCodePoint、raw、codePointAt

Added the traversal interface of string

for (let codePoint of 'foo') {
    
  console.log(codePoint)
}

Add the instance method of the string includes()、 startsWith()、 endsWith()、repeat()、 padStart(),padEnd()、trimStart()、trimEnd() 、matchAll()、at()

Modified some parameter settings of regular expression and added some properties （ Too much , If you don't list it in detail, just ）

Modified the way of specifying the default value of the input parameter of the function

Added the deconstruction method of array (… Operator )

Added the concise writing of objects for example {test} It is equivalent to {test:test}

Added Set Map Two data structures

increase Proxy Constructors （vue It is also based on this upgrade ）

increase Promise object , Used to solve asynchronous programming

newly added class keyword （ Grammatical sugar ）, Changed the way the previous prototype was written

increase import export Used for module programming （ I've been using it before , It's just ES6 after , Community standards have become official standards ）

Of course , There are other changes , Relatively speaking, it uses less , I won't mention it here

Two 、ES2016(ES7)

New array includes attribute

Introduced ** Operator （ Exponential operators ） Example 2 **3 //8

3、 ... and 、ES2017(ES8)

increase async await Make it possible to change asynchronous to synchronous , Avoid back and forth nesting of code writing

increase Object.values() Object.entries()

increase String padding：String.prototype.padStart、String.prototype.padEnd

Comma at the end of function parameter list is allowed

add to Object.getOwnPropertyDescriptors(): Get descriptors of all properties of an object , If there is no self property , Then return the empty object

newly added SharedArrayBuffer object ： Used to represent a general , Fixed length raw binary data buffer

newly added Atomics object ： Provides a set of static methods for SharedArrayBuffer Object to perform atomic operations

Four 、ES2018(ES9)

Allow asynchronous iterations ：await You can talk to for…of To use together , Run asynchronous operations in a serial fashion

add to Promise.finally()

Modified some properties of regular expression （ This one is more detailed ,mdn Just check how to use it at present ）

5、 ... and 、ES2019(ES10)

Revised try catch Use ,catch You don't have to enter

Increase the of the array flat flatMap Method
Add the string trimStart, trimEnd Method , Remove the leading and trailing spaces
increase Object.fromEntries Method , You can turn the corresponding array into an object
increase Function.prototype.toString() It is convenient to see the internal code corresponding to the function
increase Symbol.prototype.description Method

Example Symbol(‘test’). description === ‘test’ // true

Yes JSON Object optimization JSON.superset 、JSON.stringify

6、 ... and 、ES2020(ES11)

increase Bigint Used for large number calculation

Add optional chain Simplify writing judgment

increase ?? operation , If the left side is not null perhaps undefined Then return to ?? Left side content

It's solved let num = number || 1 This calculation method is bug

increase Promise.allSettled Method

Support import() The function is used for asynchronous loading

7、 ... and 、ES2021(ES12)

Add the string replactAll Method , Replace all before , You need to use regular expressions

increase Promise.any Method

New logical assignment operator ??=、&&=、 ||=

Add underline (_) Separator ： Use _ Separate numbers and literals for easy reading 1_0000 === 10000 //true

as well as WeakRefs、Intl.ListFormat、Intl.DateTimeFormat（ These three are generally not used much , If you are interested, please check it by yourself ）

attach 、

2015 year 6 Officially released in ES6, Also known as ES2015, Every year since then, some contents will be revised and published in 6 Release the corresponding year number in the month ES edition , such as ES2016~ES2021.ES2021 yes ECMAScript The second part of language norm 12 edition , Also known as ES12. In the future, in order to avoid confusion , Let's call it by year ！ The province also makes a conversion .