一、ES7 - Array Includes

在ES7之前，如果我們想判斷一個(gè)數(shù)組中是否包含某個(gè)元素，需要通過(guò) indexOf 獲取結(jié)果，并且判斷是否為 -1。

在ES7中，我們可以通過(guò)includes來(lái)判斷一個(gè)數(shù)組中是否包含一個(gè)指定的元素，根據(jù)情況，如果包含則返回 true，否則返回false。

二、ES7 –指數(shù)(乘方) exponentiation運(yùn)算符

在ES7之前，計(jì)算數(shù)字的乘方需要通過(guò) Math.pow 方法來(lái)完成。

在ES7中，增加了 ** 運(yùn)算符，可以對(duì)數(shù)字來(lái)計(jì)算乘方。

三、ES8 Object values

之前我們可以通過(guò) Object.keys 獲取一個(gè)對(duì)象所有的key，在ES8中提供了 Object.values 來(lái)獲取所有的value值：

四、ES8 Object entries

通過(guò)Object.entries 可以獲取到一個(gè)數(shù)組，數(shù)組中會(huì)存放可枚舉屬性的鍵值對(duì)數(shù)組

五、ES8 - String Padding

某些字符串我們需要對(duì)其進(jìn)行前后的填充，來(lái)實(shí)現(xiàn)某種格式化效果，ES8中增加了 padStart 和 padEnd 方法，分別是對(duì)字符串的首尾進(jìn)行填充的。

六、ES8 - Trailing Commas

在ES8中，我們?cè)试S在函數(shù)定義和調(diào)用時(shí)多加一個(gè)逗號(hào)：

七、ES8 - Object Descriptors

獲取一個(gè)對(duì)象的所有屬性描述符

八、ES10 - flat flatMap

flat() 方法會(huì)按照一個(gè)可指定的深度遞歸遍歷數(shù)組，并將所有元素與遍歷到的子數(shù)組中的元素合并為一個(gè)新數(shù)組返回。

flatMap() 方法首先使用映射函數(shù)映射每個(gè)元素，然后將結(jié)果壓縮成一個(gè)新數(shù)組。

• 注意一：flatMap是先進(jìn)行map操作，再做flat的操作；
• 注意二：flatMap中的flat相當(dāng)于深度為1；
  

九、ES10 - Object fromEntries

在前面，我們可以通過(guò) Object.entries 將一個(gè)對(duì)象轉(zhuǎn)換成 entries，那么如果我們有一個(gè)entries了，如何將其轉(zhuǎn)換成對(duì)象呢？

• ES10提供了 Object.formEntries來(lái)完成轉(zhuǎn)換：
  
  那么這個(gè)方法有什么應(yīng)用場(chǎng)景呢？
  

十、ES10 - trimStart trimEnd

去除一個(gè)字符串首尾的空格，我們可以通過(guò)trim方法，如果單獨(dú)去除前面或者后面呢？

• ES10中給我們提供了trimStart和trimEnd；
  

十一、ES11 - BigInt

在早期的JavaScript中，我們不能正確的表示過(guò)大的數(shù)字：

• 大于MAX_SAFE_INTEGER的數(shù)值，表示的可能是不正確的。

那么ES11中，引入了新的數(shù)據(jù)類型BigInt，用于表示大的整數(shù)：

• BigInt的表示方法是在數(shù)值的后面加上n
  

十二、ES11 - Nullish Coalescing Operator

注意：在之前，我們用const bar = foo || "default value"這種方式來(lái)判斷是存在問(wèn)題的：并不能完全達(dá)到要求（只有foo為undefined或者null時(shí)才賦予foo默認(rèn)值）
比如：下面這種foo初始值為空的情況下，我們本來(lái)期望的是foo為空，但是卻被賦予了默認(rèn)值！

但是ES11，Nullish Coalescing Operator增加了空值合并操作符就不會(huì)存在這種問(wèn)題：

十三、ES11 - Optional Chaining

可選鏈也是ES11中新增一個(gè)特性，主要作用是讓我們的代碼在進(jìn)行null和undefined判斷時(shí)更加清晰和簡(jiǎn)潔：

十四、ES11 - Global This

在之前我們希望獲取JavaScript環(huán)境的全局對(duì)象，不同的環(huán)境獲取的方式是不一樣的

• 比如在瀏覽器中可以通過(guò)this、window來(lái)獲取；
• 比如在Node中我們需要通過(guò)global來(lái)獲取；

那么在ES11中對(duì)獲取全局對(duì)象進(jìn)行了統(tǒng)一的規(guī)范：globalThis

十五、ES11 - for…in標(biāo)準(zhǔn)化

在ES11之前，雖然很多瀏覽器支持for…in來(lái)遍歷對(duì)象類型，但是并沒(méi)有被ECMA標(biāo)準(zhǔn)化。

在ES11中，對(duì)其進(jìn)行了標(biāo)準(zhǔn)化，for…in是用于遍歷對(duì)象的key的：

十六、ES12 - FinalizationRegistry

FinalizationRegistry 對(duì)象可以讓你在對(duì)象被垃圾回收時(shí)請(qǐng)求一個(gè)回調(diào)。

• FinalizationRegistry 提供了這樣的一種方法：當(dāng)一個(gè)在注冊(cè)表中注冊(cè)的對(duì)象被回收時(shí)，請(qǐng)求在某個(gè)時(shí)間點(diǎn)上調(diào)用一個(gè)清理回調(diào)。（清理回調(diào)有時(shí)被稱為 finalizer ）;
• 你可以通過(guò)調(diào)用register方法，注冊(cè)任何你想要清理回調(diào)的對(duì)象，傳入該對(duì)象和所含的值;
  

十七、ES12 - WeakRefs

如果我們默認(rèn)將一個(gè)對(duì)象賦值給另外一個(gè)引用，那么這個(gè)引用是一個(gè)強(qiáng)引用：

• 如果我們希望是一個(gè)弱引用的話，可以使用WeakRef；
  

十八、ES12 - logical assignment operators 邏輯賦值運(yùn)算

// 1.||= 邏輯或賦值運(yùn)算 // let message = undefined // message = message || "default value" // message ||= "default value" // console.log(message) // default value// 2.&&= 邏輯與賦值運(yùn)算 // && // const obj = { // name: "why", // foo: function() { // console.log("foo函數(shù)被調(diào)用") // // } // } // obj.foo && obj.foo()// &&= let info = {name: "why" }// // 1.判斷info // 2.有值的情況下, 取出info.name // info = info && info.name info &&= info.name console.log(info) // why// 3.??= 邏輯空賦值運(yùn)算 let message = 0 message ??= "default value" console.log(message) // 0

總結(jié)

以上是生活随笔為你收集整理的ES6~ES12——Array Includes、Object values、Object entries、Object fromEntries、flat、flatMap、空值合并运算符、可选链等的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。