前幾年一直覺得瀏覽器對ES6的支持度不高,要用工具編譯成ES5很麻煩,就一直沒狠下心學,如今雖然TS很好,但我還是決定先學學ES6。
這是學習筆記,并不是教程。本人學習的教程為阮一峰老師的
1. let和const
1.1 let聲明的變量為塊級作用域變量
1.2 沒有命名提升,不能重復(fù)聲明,不能在聲明前使用
1.3 for循環(huán)中計數(shù)量和循環(huán)內(nèi)可以聲明同一名稱變量,但是不是指向同一個值。
1.4 注意暫時性死區(qū)
1.6 塊級作用域中可以聲明”局部”函數(shù),但是具體怎樣還是根據(jù)瀏覽器自己的實現(xiàn)方式?jīng)Q定。建議使用函數(shù)表達式
1.7 const用于聲明常量,必須立即初始化,也是處于塊級作用域
1.8 對簡單類型數(shù)據(jù),const為常量,隊伍復(fù)合類型數(shù)據(jù),const只會保證指向地址不改變,其數(shù)據(jù)結(jié)構(gòu)可以改變,如給對象多加一個屬性值
1.9 想凍結(jié)對象需要使用Object.freeze方法
1.10 let和const聲明的全局作用域?qū)ο蟛辉陧攲訉ο笾?/p>
2. 變量的結(jié)構(gòu)賦值
2.1 模式匹配,解構(gòu)不成功會賦值為undefined
2.2 可以不完全解構(gòu),即左邊的項數(shù)少于需要被解構(gòu)的變量
2.3 被解構(gòu)的必須是可遍歷結(jié)構(gòu)
2.4 可以賦默認值,只有當被解構(gòu)對象相對應(yīng)的此位置為嚴格的undefined時才會賦予默認值,要注意暫時性死區(qū)
2.5 如果使用函數(shù)作為默認值,則該函數(shù)是惰性的,即必須賦予默認值時才會運行該函數(shù)
2.6 對象解構(gòu)時必須名稱對應(yīng),可以取到繼承的屬性
2.7 如果用對象解構(gòu)對象時,雙方按照相同鍵名賦值,同時鍵名不可訪問
2.8 也可以使用嵌套對象解構(gòu),可以使用默認值
2.9 使用已經(jīng)聲明的變量,進行解構(gòu)時需要將整條解構(gòu)語句放入小括號中,避免由于行首出現(xiàn){而被解析成代碼塊而報錯
2.10 可以對數(shù)組進行對象解構(gòu)(待補充詳情)
2.11 字符串也可以直接解構(gòu),可以對字符串的length屬性進行對象解構(gòu)
2 .12 如果被解構(gòu)對象是數(shù)值或者布爾值,會先轉(zhuǎn)化成對象
2.13 不能直接對null或者undefined進行解構(gòu),因為他們不能轉(zhuǎn)化成對象
2.14 函數(shù)傳參時可以使用解構(gòu)的方式
2.15 盡量少使用小括號,變量聲明和函數(shù)傳參的時候使用小括號會報錯
2.16 解構(gòu)的一些用途:
? 2.16.1 交換變量的值
? 2.16.2 函數(shù)返回多個值
? 2.16.3 函數(shù)參數(shù)定義
? 2.16.4 提取json數(shù)據(jù)
? 2.16.5 函數(shù)參數(shù)默認值賦予
? 2.16.6 遍歷0MAP結(jié)構(gòu)(可以同時獲取鍵名和鍵值,或者獲得其一)
? 2.16.7 導(dǎo)入模塊指定方法
3. 字符串的拓展
3.1 增強了對Unicode的支持
3.2 可以使用 for? of 遍歷字符串,可以正確識別大于0xFFFF的字符
3.3 模板字符串使用反引號 ` ,默認保留所有空格和換行,
????3.3.1 如果想要清除換行,需要對字符串使用trim()函數(shù)
????3.3.2如果想要嵌入變量, 則需要將變量名寫在 ${} 之中, 同時 {} 內(nèi)部還可以放入任意的js表達式,包括運算, 引用對象屬性等, 還可以調(diào)用函數(shù)
4. set 和 map 數(shù)據(jù)結(jié)構(gòu)
4.1 set不會接受重復(fù)的成員
4.2 set的構(gòu)造函數(shù)可以接受數(shù)組或者類數(shù)組的成員
4.3 快速去除重復(fù)成員
```js
[...newSet(array)]
[...newSet('ababbc')].join('')
```
4.4 set內(nèi)部判斷兩個值是否相等的時候用的是 === 操作符, 但是對于NaN會全部視為一個相等的值,但是對于對象會總是認為是不相等的值
4.5 set實例的屬性:?
- size 返回set實例成員的總數(shù)
- constructor 構(gòu)造函數(shù),就是 set函數(shù)
4.5 set實例的操作方法
?- add(value) 添加某個值
- delete(value) 刪除一個值,返回一個布爾值,表示刪除是否成功
- has(value) 返回一個布爾值,判斷set中有沒有指定的值
- clear(value) 清楚所有成員
4.6 Array.from(set) 可以將一個set轉(zhuǎn)化成一個數(shù)組
4.7 set實例的遍歷屬性
- keys() 返回鍵名的遍歷器
- values() 返回鍵值的遍歷器
- entries() 返回鍵值對的遍歷器
- forEach() 使用回調(diào)函數(shù)遍歷每個成員
4.8? set的鍵名和鍵值是相等的, 默認遍歷器是他的values方法
4.9 數(shù)組的map, fliter方法可以間接用于set? ? ? ? ? ? ??newSet([...a].filter(x=>!b.has(x)))
4.10?想在遍歷操作中,同步改變原來的 Set 結(jié)構(gòu),目前沒有直接的方法,但有兩種變通方法。一種是利用原 Set 結(jié)構(gòu)映射出一個新的結(jié)構(gòu),然后賦值給原來的 Set 結(jié)構(gòu);另一種是利用Array.from方法。set=newSet([...set].map(val=>val*2))? ??set=newSet(Array.from(set,val=>val*2))
4.11 可以通過調(diào)用fliter方法來實現(xiàn)集合的交并補
4.12?WeakSet 結(jié)構(gòu)與 Set 類似,也是不重復(fù)的值的集合,成員只能是對象,而不能是其他類型的值
4.13?WeakSet 中的對象都是弱引用,即垃圾回收機制不考慮 WeakSet 對該對象的引用,也就是說,如果其他對象都不再引用該對象,那么垃圾回收機制會自動回收該對象所占用的內(nèi)存,不考慮該對象還存在于 WeakSet 之中
4.14?WeakSet 內(nèi)部有多少個成員,取決于垃圾回收機制有沒有運行,運行前后很可能成員個數(shù)是不一樣的,而垃圾回收機制何時運行是不可預(yù)測的,因此 ES6 規(guī)定 WeakSet 不可遍歷
4.15?WeakSet 可以接受一個數(shù)組或類似數(shù)組的對象作為參數(shù)。(實際上,任何具有 Iterable 接口的對象,都可以作為 WeakSet 的參數(shù))
```js
const a=[[1,2],[3,4]];
const ws=newWeakSet(a);
// WeakSet {[1, 2], [3, 4]}
//a數(shù)組的成員成為 WeakSet 的成員,而不是a數(shù)組本身。這意味著,數(shù)組的成員只能是對象
```
4.16 weakset沒有size和foreach屬性, 但是有 add has delete方法
4.17 map結(jié)構(gòu)是一個鍵值對, 不同以往的object對象的 "字符串->值" 而是采用的 "值->值"
4.18 使用 set() 方法可以向map結(jié)構(gòu)中添加一對數(shù)據(jù), 使用get()方法可以通過鍵名得到一個數(shù)據(jù),使用size方法可以返回map中數(shù)據(jù)對的數(shù)量
4.19?任何具有 Iterator 接口、且每個成員都是一個雙元素的數(shù)組的數(shù)據(jù)結(jié)構(gòu)都可以當作Map構(gòu)造函數(shù)的參數(shù)
4.20?如果對同一個鍵多次賦值,后面的值將覆蓋前面的值
4.21?只有對同一個對象的引用,Map 結(jié)構(gòu)才將其視為同一個鍵, 也就是說對于數(shù)組對象等復(fù)雜結(jié)構(gòu)作為鍵名時,需要特別小心
4.22?Map 的鍵實際上是跟內(nèi)存地址綁定的,只要內(nèi)存地址不一樣,就視為兩個鍵。這就解決了同名屬性碰撞(clash)的問題
4.23?Map 的鍵是一個簡單類型的值(數(shù)字、字符串、布爾值),則只要兩個值嚴格相等,Map 將其視為一個鍵,比如0和-0就是一個鍵,布爾值true和字符串true則是兩個不同的鍵。另外,undefined和null也是兩個不同的鍵。雖然NaN不嚴格相等于自身,但 Map 將其視為同一個鍵
4.24 map的操作屬性和遍歷屬性和set相同, forEach方法還可以接受第二個參數(shù),用來綁定this?
```js
const reporter={report:function(key,value){console.log("Key: %s, Value: %s",key,value);}};
map.forEach(function(value,key,map){this.report(key,value);},reporter);
```
4.25?WeakMap只接受對象作為鍵名(null除外),不接受其他類型的值作為鍵名,?WeakMap的鍵名所指向的對象,不計入垃圾回收機制
4.26?WeakMap的設(shè)計目的在于避免產(chǎn)生不必要的引用
4.27?沒有遍歷操作(即沒有keys()、values()和entries()方法),也沒有size屬性WeakMap只有四個方法可用:get()、set()、has()、delete()