ES6-11 總結(jié)一 (nrm,var,let,const,解構(gòu)賦值) : http://www.reibang.com/p/b04fbab076b3
ES6-11 總結(jié)二 (ES5和ES6數(shù)組的 遍歷&擴(kuò)展) : http://www.reibang.com/p/a775c3311a0b
ES6-11 總結(jié)三(深淺拷貝,對象和函數(shù)的擴(kuò)展) : http://www.reibang.com/p/6dda93b18d9a
ES6-11 總結(jié)四 (es5和es6的類與繼承,Symbol數(shù)據(jù)類型) : http://www.reibang.com/p/e3c24c0db755
ES6-11 總結(jié)五 (set,Map,字符串&&正則&&數(shù)值的擴(kuò)展) : http://www.reibang.com/p/c1ca903f6573
ES6-11 總結(jié)六 (代理Proxy 反射Reflect):http://www.reibang.com/p/4ff19ba5d219
1 新的數(shù)據(jù)結(jié)構(gòu) Set
Set里面的值不可重復(fù),,數(shù)組Array里面是可以重復(fù)的
let s = new Set([1, 2, 3, 2]); //Set(3) {1, 2, 3} // 不可重復(fù)的
Set 方法
s.add(6); // 新增
s.delete(6); // 刪除
s.has(6); //有沒有,,布爾類型返回值
s.size; // set長度 從1開始數(shù)的,,不是從0
s.clear(); // 清空
Set 遍歷
1 forEach
2 for of for(let item of s)
3 for of for(let item of s.keys())
4 for of for(let item of s.values())
5 for of for(let item of s.entries())
Set 應(yīng)用場景
1 數(shù)組去重 new Set(Array) 把Array去重
2 數(shù)組合并去重 new Set([...arr1,...arr2]) 把a(bǔ)rr1和arr2,合并去重
3 Set變回?cái)?shù)組
3.1 : [...s] // let s = new Set([1,2,3])
3.2 : Array.from(s) // let s = new Set([1,2,3])
4 求出兩個數(shù)組的交集
let arr1 = [1, 2, 3];
let arr2 = [2, 3, 4];
let s1 = new Set(arr1);
let s2 = new Set(arr2);
let res = new Set(arr1.filter((item) => {
if(s2.has(item)){
return item;
}
}));
console.log(res); // Set(2) {2, 3}
5 求出兩個數(shù)組的差集
let res2 = new Set(arr1.filter((item) => {
if(!s2.has(item)){
return item;
}
}));
let res3 = new Set(arr2.filter((item) => {
if(!s1.has(item)){
return item;
}
}));
let arr4 = [...res2, ...res3]; // (2) [1, 4]
2 新的數(shù)據(jù)結(jié)構(gòu) WeakSet() 類似于Set
1 WeakSet只能存儲對象
2 WeakSet不能被遍歷 // 弱引用 垃圾回收機(jī)制不考慮這種引用,,,如果對象只被WeakSet引用,,就會被回收
垃圾回收機(jī)制 GC
1 如果一個值被聲明,,計(jì)數(shù)為0,,每引用一次+1,,如果不是0,就不會被回收
2 WeakSet的引用是弱引用,,不會被+1
3 新的數(shù)據(jù)結(jié)構(gòu) Map
Map的key可以是多種數(shù)據(jù)類型,,比如key是對象,
// Map 定義和方法
let obj = {
age: 18
}
let m = new Map()
// 設(shè)置
m.set(obj, "value")
console.log(m) // Map(1) {{…} => "value"} 此時(shí)的key就是obj對象
// 獲取
m.get(obj)// "value"
// 刪除
m.delete(obj)
// 查詢
m.has(obj)
// 長度
m.size
// 清空
m.clear
// Map傳入數(shù)組
let m2 = new Map([
["name", "liu"],
["age", 18]
])
console.log(m2) // Map(2) {"name" => "liu", "age" => 18}
m2.get("age") // 18
m2.set("age", "20") // Map(2) {"name" => "liu", "age" => 20}
Map 遍歷
1 forEach 遍歷 m.forEach((value,key)=>{}) 注意第一個參數(shù)是value,,第二個參數(shù)是key
2 forOf 遍歷 for(let [key,value] of m) 注意第一個是key 第二個是value
3 forOf 遍歷2 for(let key of m.keys())
4 forOf 遍歷3 for(let value of m.values())
4 forOf 遍歷4 for(let [key,value] of m.entries())
應(yīng)用場景
1 判斷對象有沒有某個屬性 map.has() 但是正常的obj對象,,要循環(huán)遍歷
2 判斷對象鍵值對的個數(shù),,比如判斷是不是空,,, map.size obj還是要循環(huán)
3 經(jīng)常對 鍵值對的增刪改查,, map更要性能優(yōu)勢
4 新的數(shù)據(jù)結(jié)構(gòu) weakMap
weakMap key只是是引用數(shù)據(jù)類型
weakMap 不支持clear方法
weakMap 不支持size方法 因?yàn)椴荒鼙闅v
weakMap 不支持遍歷
weakMap 是弱引用
5 字符串的擴(kuò)展
5.1 字符串的unicode
unicode : 字符的表示法,,,例如中文,,表情符號啊等等
es6 \uXXX 取值范圍在0000~ffff
如果超出了取值范圍 例如下面
\u20BB7會被解析成 \u20BB+7
\u{20BB7} 就表示可以超出范圍
5.2 字符串的遍歷
for(let item of "xxx"){}
5.3 模板字符串
`${}`
1 換行和回車, es5要加\n等等 es6`` 的情況下直接回車或者空格為就行
2 變量
let a = 20 let b =10 let c = "ccc"
let d = `${a+b}c` // "30c"
3 嵌套模板
例如 `icon icon-${XXX}` 前面是固定,后面不固定
5.4 字符串新的api方法
5.4.1 String.fromCodePoint() : 傳入unicode返回對應(yīng)字符
es5 : String.fromCharCode() 參數(shù)是unicode 但是不能超過0000~ffff
es6 : String.fromCodePoint() // 參數(shù)是unicode 可以超過0000~ffff
5.4.2 String.prototype.includes() : 查看字符串有沒有某個字符
es5 : indexOf 有返回下標(biāo),,沒有返回-1
es6 : includes 返回值是布爾值
5.4.3 String.prototype.startsWith() : 查看字符串是不是以什么開頭
5.4.4 String.prototype.endsWith() : 查看字符串是不是以什么結(jié)尾#####5.4.5 String.prototype.repeat() : 重復(fù)幾次當(dāng)前字符串,,傳入是number
6 正則表達(dá)式的擴(kuò)展
es 5 修飾符
i 忽略大小寫
m 多行匹配
g 全局匹配
es 6 修飾符
y 粘連修飾符
粘滯匹配不能像普通正則那樣,跳過那些匹配失敗的字符后接著執(zhí)行后面字符的匹配操作
let str = "aaa_aa_a"
let reg1 = /a+/g 每次匹配剩余的 +:一次或者多次
let reg2 =/a+/y 剩余的第一個開始匹配
console.log(reg1.exec(str)) ["aaa", index: 0, input: "aaa_aa_a", groups: undefined]
console.log(reg2.exec(str)) ["aaa", index: 0, input: "aaa_aa_a", groups: undefined]
console.log(reg1.exec(str)) ["aa", index: 4, input: "aaa_aa_a", groups: undefined]
console.log(reg2.exec(str)) null 匹配到 _ 直接就失敗了,,不會匹配了
console.log(reg1.exec(str)) ["a", index: 7, input: "aaa_aa_a", groups: undefined]
console.log(reg2.exec(str)) ["aaa", index: 0, input: "aaa_aa_a", groups: undefined]
u 修飾符 unicode修飾符
let str = '\uD842\uDFB7' 這是一個字符,,一個字符!,,不是兩個字符
舉例1 :
es5 : /^\uD842/.test(str) true, es5認(rèn)為str是兩個字符,所有返回true
es6 : /^\uD842/u.test(str) false 會識別str為一個字符
舉例2 :
es5 . 修飾符 表示換行符以外的任意 單個 字符
es5 : /^.$/.test(str) false es5認(rèn)為str是多個字符,
es5 : /^.$/u.test(str) true es6認(rèn)為str是單個字符,
舉例3 : \u{61}表示a字符
/\u{61}/.test("a") false
/\u{61}/u.test("a") true
7 數(shù)值的擴(kuò)展
7.1 進(jìn)制轉(zhuǎn)換
es 5 進(jìn)制轉(zhuǎn)換
十進(jìn)制 => 二進(jìn)制
let a = 5
a.toString(2) 101
二進(jìn)制 => 十進(jìn)制
let b = 101
b.parseInt(b,2) 5
es 6 進(jìn)制轉(zhuǎn)換 0B:二進(jìn)制 0O八進(jìn)制
0101 也表示5
let a = 0101 直接報(bào)錯
let a = 0B0101 就不會報(bào)錯
7.2 Number的方法
Es5的parseInit,parseFloat等等,都是掛載在window下面,
Es6的parseInit,parseFloat等等,都掛載在各自的下面
Number.isFinite 判斷一個數(shù)值是不是有限的
Number.isFinite(5) true
Number.isFinite(Infinity) false
Number.isFinite("XXX") false
Number.isFinite(true") flase"
Number.isNaN 數(shù)值是不是NaN
Number.isNaN(5) false
Number.isNaN(NaN) true
Number.parseInt 和window.parseInt 一致
Number.parseFloat 和window.parseFloat 一致
Number.isIntrger 判斷一個值是不是整數(shù)
let max = Math.pow(2,53) 9007199254740992
Number.MAX_SAFE_INTEGER 9007199254740991
Number.MIN_SAFE_INTEGER 最小值
Number.isSafeInteger() 判斷某個值是不是個安全的整數(shù)
7.3 精度缺失的問題
js 數(shù)字采取的是 IEEE 754 雙精度標(biāo)準(zhǔn)
0.1 轉(zhuǎn)換到二進(jìn)制 0.0001100110011001100110011..............無限大
7.4 Math方法
Math.trunc() 取整 5.5=>5 -5.5=>-5 true=>1 NaN / undefined =>NaN
Math.sign() 判斷是正數(shù)還是負(fù)數(shù)和0,,, 正數(shù)=>1 負(fù)數(shù)=>-1 0=>0 true => 1 false =>0
Math.cbrt() 計(jì)算一個數(shù)的立方根