ES6新增資料結構-set與map
阿新 • • 發佈:2018-11-29
ES6新增資料結構-set與map
1.Set
*Set是ES6新增的一種資料型別,怎麼將它與物件陣列區分呢使用typeof set物件 返回的是object:
let set=new Set();
console.log(typeof set); //object
這種方法並不能將區分,應該使用到:Object原型上的toString方法,toString方法會將呼叫該方法的物件以字串形式返回。利用這個特性,再結合call方法改變this的指向,即可。
let set=new Set(); console.log(Object.prototype.toString.call(set));//[objetc set]
這樣就能正確的區分。
*怎麼使用Set:
- 例項化Set物件:
let set =new Set();//可以傳引數,
這裡的引數有點講究,來看一下先傳一個數字。
let set2=new Set(123);
console.log(set2)//這裡會報錯
//報錯資訊: Uncaught TypeError: (var)[Symbol.iterator] is not a function
//意思是說 傳入的引數沒有 Symbol.iterator (遍歷器)這個方法;
看到這個報錯資訊,是不是有點眼熟?在哪裡見過呢,來看一下下面的程式碼:
let num=123; let str='123'; for(let i of str){ console.log(i); // 1 2 3 (字串) } for(let j of num){ console.log(j);//報錯 } //報錯資訊:Uncaught TypeError: num[Symbol.iterator] is not a function //是不是發現與上面set的報錯資訊基本一致。
為了得出結論,我再將可以用for of 遍歷的值均作為引數傳入Set的建構函式,發現都不會報錯。而不能使用for of 遍歷的值也均不能作為引數。
let set2=new Set('123'); console.log(set2);// {‘1’,‘2’,‘3’} let set3=new Set([1,2,3]); console.log(set3);// {1,2,3} let set4=new Set({0:'1',1:'2'}); console.log(set4); //報錯 //報錯資訊:Uncaught TypeError: (var)[Symbol.iterator] is not a function 物件是不能使用for of 遍歷的。 let set5=new Set(set3); console.log(set5);// {1,2,3} //Set 物件是可以使用 for of遍歷的 let map=new Map(); map.set('123',123); let set5=new Set(map); console.log(set5); // {['123',123]} //連map物件都能接受,因為map也能使用for of 遍歷。
所以Set物件建構函式能接受的引數為可以使用for of 遍歷的資料,而能使用for of 遍歷的資料,是該資料原型上有 Symbol.iterator 遍歷器 方法。而有這個方法的資料有 : Set Map Array String
2.獲得Set物件的長度:
set.size //set物件的size屬性
3.為Set物件新增元素:
set.add(newValue); //利用set的add方法,該方法會返回set物件,所以可以連用。
set.add(...).add(...).add(...)
需要注意的是,set物件內的資料都是唯一的,所以如果新增set內含有的值,則不會再追加。
4.刪除Set物件內指定的值:
set.delete(value);
5.取Set物件內的值:可以使用解構 也可以使用for of 遍歷
let set=new Set([1,2,3]);
let arr=[...set];
console.log(arr);//[1,2,3]
6.Set的作用:可以利用Set物件的特性(唯一性)用來陣列去重;
將需要去重的陣列,作為引數傳入Set建構函式即可。
let arr=[111,222,333,222];
let set=new Set(arr);
let arr2=[...set];
console.log(arr2);//[1,2,3]
2.Map
1.Map的例項化:
建構函式引數,只接受二維陣列
let map=new Map([[1,2],['a','c']]);
console.log(map);// {1=>2,'a'=>'c'}
2.Map新增屬性:
map.set(name,value);
//如果name是map內有的,則會把之前name對應的資料覆蓋。
3.刪除Map屬性:
map.delete(name);//引數為屬性名
4.獲取長度:
map.size
5.獲取資料:
map.get(name);
6.遍歷:
for(let [k,v] of map){
console.log(k,v);
}
k為屬性名,v為值。