一、set
1.基本用法
數(shù)據(jù)結構Set類似于數(shù)組，但是成員的值都是唯一的，沒有重復的值。
let s = new Set();
[2,3,5,4,5,2,2].map(x => s.add(x))
for (let i of s) {console.log(i)}// 2 3 5 4
//Set函數(shù)可以接受一個數(shù)組作為參數(shù)，用來初始化。
var items = new Set([1,2,3,4,5,5,5,5]);
console.log(items); // set object
console.log(items.size); // 5
//向Set加入值的時候，不會發(fā)生類型轉換，所以5和“5”是兩個不同的值。
let set = new Set();
set.add({})
console.log(set.size);// 1
set.add({})
console.log(set.size);// 2
//上面代碼表示，由于兩個空對象不是精確相等，所以它們被視為兩個值。
2.Set實例的屬性
Set結構的實例有以下屬性。
Set.prototype.constructor：構造函數(shù)，默認就是Set函數(shù)。
Set.prototype.size：返回Set實例的成員總數(shù)。
let s = new Set();
s.add(1).add(2).add(2);// 注意2被加入了兩次
console.log(s);
console.log(s.size); // 2
3.Set實例的方法
分為兩大類：
操作方法（用于操作數(shù)據(jù)）和遍歷方法（用于遍歷成員）。下面先介紹四個操作方法。
add(value)：添加某個值，返回Set結構本身。
delete(value)：刪除某個值，返回一個布爾值，表示刪除是否成功。
has(value)：返回一個布爾值，表示該值是否為Set的成員。
clear()：清除所有成員，沒有返回值。
上面這些屬性和方法的實例如下:
let s = new Set();
s.add(1).add(2).add(2);
console.log(s.has(1));// true
console.log(s.has(2)); // true
console.log(s.has(3));// false
s.delete(2);
console.log(s.has(2));// false
s.clear();
console.log(s.size);//0
//Array.from方法可以將Set結構轉為數(shù)組：
let items = new Set([1, 2, 3, 4, 5]);
let array = Array.from(items);
console.log(array);//[1, 2, 3, 4, 5]
4.遍歷操作
Set結構的實例有四個遍歷方法，可以用于遍歷成員。
keys()：返回一個鍵名的遍歷器
values()：返回一個鍵值的遍歷器
entries()：返回一個鍵值對的遍歷器
forEach()：使用回調函數(shù)遍歷每個成員
由于Set結構沒有鍵名，只有鍵值（或者說鍵名和鍵值是同一個值），所以key方法和value方法的行為完全一致。
let set = new Set(['red', 'green', 'blue']);
for ( let item of set.keys() ){
console.log(item);// red green blue
}
for ( let item of set.values() ){
console.log(item);// red green blue
}
for ( let item of set.entries() ){
console.log(item);// ["red", "red"] ["green", "green"] ["blue", "blue"]
}
set.forEach(function(item){
console.log(item);// red green blue
})
二、WeakSet
WeakSet和Set一樣都不存儲重復的元素，但有一些不同點 。
WeakSet的成員只能是對象，而不能是其他類型的值。
WeakSet結構有以下三個方法。
WeakSet.prototype.add(value)：向WeakSet實例添加一個新成員。
WeakSet.prototype.delete(value)：清除WeakSet實例的指定成員。
WeakSet.prototype.has(value)：返回一個布爾值，表示某個值是否在
let ws = new WeakSet();
//console.log(ws.add(1));// TypeError: Invalid value used in weak set
let obj = {};
let foo = {};
ws.add(window);
ws.add(obj);
console.log(ws);
console.log(ws.has(window)); // true
console.log(ws.has(foo)); // false
ws.delete(window);
console.log(ws.has(window)); // false
//WeakSet沒有size屬性，沒有辦法遍歷它的成員。
console.log(ws.size) // undefined
console.log(ws.forEach); // undefined
//ws.forEach(function(item){ console.log('WeakSet has ' + item)})// TypeError: undefined is not a function
三、Map結構的目的和基本用法
Map 是一個“超對象”，其 key 除了可以是 String 類型之外，還可以為其他類型（如：對象）
他的方法和 Set 差不多：
size：返回成員總數(shù)。
set(key, value)：設置一個鍵值對。
get(key)：讀取一個鍵。
has(key)：返回一個布爾值，表示某個鍵是否在Map數(shù)據(jù)結構中。
delete(key)：刪除某個鍵。
clear()：清除所有成員。
let m = new Map();
o = {p: "Hello World"};
m.set(o, "content")
console.log(m);
console.log(m.get(o))// "content"
實例的屬性和操作方法
Map結構的實例有以下屬性和操作方法。
size：返回成員總數(shù)。
set(key, value)：設置key所對應的鍵值，然后返回整個Map結構。如果key已經有值，則鍵值會被更新，否則就新生成該鍵。
get(key)：讀取key對應的鍵值，如果找不到key，返回undefined。
has(key)：返回一個布爾值，表示某個鍵是否在Map數(shù)據(jù)結構中。
delete(key)：刪除某個鍵，返回true。如果刪除失敗，返回false。
clear()：清除所有成員，沒有返回值。
set()方法返回的是Map本身，因此可以采用鏈式寫法。
let map = new Map()
.set(1, 'a')
.set(2, 'b')
.set(3, 'c');
console.log(map);
//下面是has()和delete()的例子。
let m = new Map();
m.set("edition", 6) // 鍵是字符串
m.set(262, "standard") // 鍵是數(shù)值
m.set(undefined, "nah") // 鍵是undefined
let hello = function() {console.log("hello");}
m.set(hello, "Hello ES6!") // 鍵是函數(shù)
m.has("edition") // true
m.has("years") // false
m.has(262) // true
m.has(undefined) // true
console.log(m.get(undefined));
m.has(hello) // true
m.delete(undefined)
m.has(undefined) // false
m.get(hello) // Hello ES6!
m.get("edition") // 6
//下面是size屬性和clear方法的例子。
map.set('foo', true);
map.set('bar', false);
map.size // 2
map.clear()
map.size // 0
console.log(Array.from(m));//Array
遍歷方法
Map原生提供三個遍歷器。
keys()：返回鍵名的遍歷器。
values()：返回鍵值的遍歷器。
entries()：返回所有成員的遍歷器。
使用示例：
let map = new Map([
['F', 'no'],
['T', 'yes'],
]);
for (let key of map.keys()) {
console.log(key);
}
// "F"
// "T"
for (let value of map.values()) {
console.log(value);
}
// "no"
// "yes"
for (let item of map.entries()) {
console.log(item[0], item[1]);
}
// "F" "no"
// "T" "yes"
// 或者
for (let [key, value] of map.entries()) {
console.log(key, value);
}
// 等同于使用map.entries()
for (let [key, value] of map) {
console.log(key, value);
}
Map結構轉為數(shù)組結構，比較快速的方法是結合使用擴展運算符（...）。
let map = new Map([
[1, 'one'],
[2, 'two'],
[3, 'three']
]);
[...map.keys()];
// [1, 2, 3]
[...map.values()];
// ['one', 'two', 'three']
[...map.entries()];
// [[1,'one'], [2, 'two'], [3, 'three']]
[...map]
// [[1,'one'], [2, 'two'], [3, 'three']]
//此外，Map還有一個forEach方法，與數(shù)組的forEach方法類似，也可以實現(xiàn)遍歷。
map.forEach(function(value, key){
console.log(key+':'+value);
});
四、WeakMap
WeakMap結構與Map結構基本類似，唯一的區(qū)別是它只接受對象作為鍵名（null除外），不接受原始類型的值作為鍵名，而且鍵名所指向的對象，不計入垃圾回收機制。set()和get()分別用來添加數(shù)據(jù)和獲取數(shù)據(jù):
let map = new WeakMap();
let element={};
map.set(element, "Original");
// 下面就可以使用了
let value = map.get(element);
console.log(value); // "Original"
WeakMap與Map在API上的區(qū)別主要是兩個:
一是沒有遍歷操作（即沒有key()、values()和entries()方法），也沒有size屬性；
二是無法清空，即不支持clear方法。這與WeakMap的鍵不被計入引用、被垃圾回收機制忽略有關。
因此，WeakMap只有四個方法可用：get()、set()、has()、delete()。
五、Iterator（遍歷器）的概念
遍歷器（Iterator）就是統(tǒng)一的接口機制，來處理所有不同的數(shù)據(jù)結構。
Iterator的作用有三個：
一是為各種數(shù)據(jù)結構，提供一個統(tǒng)一的、簡便的訪問接口；
二是使得數(shù)據(jù)結構的成員能夠按某種次序排列；
三是ES6創(chuàng)造了一種新的遍歷命令for...of循環(huán)，Iterator接口主要供for...of消費。
Iterator的遍歷過程是這樣的。
創(chuàng)建一個指針，指向當前數(shù)據(jù)結構的起始位置。也就是說，遍歷器的返回值是一個指針對象。
第一次調用指針對象的next方法，可以將指針指向數(shù)據(jù)結構的第一個成員。
第二次調用指針對象的next方法，指針就指向數(shù)據(jù)結構的第二個成員。
調用指針對象的next方法，直到它指向數(shù)據(jù)結構的結束位置。
每一次調用next方法，都會返回當前成員的信息，具體來說，就是返回一個包含value和done兩個屬性的對象。其中，value屬性是當前成員的值，done屬性是一個布爾值，表示遍歷是否結束。
function idMaker(){
var index = 0;
return {
next: function(){
return {value: index++, done: false};
}
}
}
let it = idMaker();
console.log(it.next().value); // '0'
console.log(it.next().value); // '1'
console.log(it.next().value); // '2'
數(shù)據(jù)結構的默認Iterator接口
在ES6中，可迭代數(shù)據(jù)結構(比如數(shù)組)都必須實現(xiàn)一個名為Symbol.iterator的方法，該方法返回一個該結構元素的迭代器。注意，Symbol.iterator是一個Symbol，Symbol是ES6新加入的原始值類型。
let arr = ['a', 'b', 'c'];
let iter = arr[Symbol.iterator]();
console.log(iter);
console.log(iter.next()); // { value: 'a', done: false }
console.log(iter.next()); // { value: 'b', done: false }
console.log(iter.next()); // { value: 'c', done: false }
console.log(iter.next()); // { value: undefined, done: true }
上面代碼中，變量arr是一個數(shù)組，原生就具有遍歷器接口，部署在arr的Symbol.iterator屬性上面。所以，調用這個屬性，就得到遍歷器。
調用默認Iterator接口的場合
有一些場合會默認調用iterator接口（即Symbol.iterator方法），除了下文會介紹的for...of循環(huán)，還有幾個別的場合。
解構賦值
對數(shù)組和Set結構進行解構賦值時，會默認調用iterator接口。
let set = new Set().add('a').add('b').add('c');
let [x,y] = set;
// x='a'; y='b'
let [first, ...rest] = set;
console.log(first);//'a'
console.log(rest);// ['b','c'];
//擴展運算符
//擴展運算符（...）也會調用默認的iterator接口。
// 例一
let str = 'hello';
console.log([...str]); // ['h','e','l','l','o']
// 例二
let arr = ['b', 'c'];
console.log(['a', ...arr, 'd']);// ['a', 'b', 'c', 'd']
其他場合
以下場合也會用到默認的iterator接口，可以查閱相關章節(jié)。
yield*
Array.from()
Map(), Set(), WeakMap(), WeakSet()
Promise.all(), Promise.race()
原生具備Iterator接口的數(shù)據(jù)結構
字符串是一個類似數(shù)組的對象，也原生具有Iterator接口。
let someString = "hi";
typeof someString[Symbol.iterator]// "function"
let iterator = someString[Symbol.iterator]();
iterator.next() // { value: "h", done: false }
iterator.next() // { value: "i", done: false }
iterator.next() // { value: undefined, done: true }
//上面代碼中，調用Symbol.iterator方法返回一個遍歷器，在這個遍歷器上可以調用next方法，實現(xiàn)對于字符串的遍歷。
//可以覆蓋原生的Symbol.iterator方法，達到修改遍歷器行為的目的。
let str = new String("hi");
[...str] // ["h", "i"]
str[Symbol.iterator] = function() {
return {
next: function() {
if (this._first) {
this._first = false;
return { value: "bye", done: false };
} else {
return { done: true };
}
},
_first: true
};
};
[...str] // ["bye"]
str // "hi"
//上面代碼中，字符串str的Symbol.iterator方法被修改了，所以擴展運算符（...）返回的值變成了bye，而字符串本身還是hi。
六、Iterator接口與Generator函數(shù)
Symbol.iterator方法的最簡單實現(xiàn)，還是使用下一章要介紹的Generator函數(shù)。
let myIterable = {};
myIterable[Symbol.iterator] = function* () {
yield 1;
yield 2;
yield 3;
};
console.log(myIterable);
console.log([...myIterable]); // [1, 2, 3]
// 或者采用下面的簡潔寫法
let obj = {
* [Symbol.iterator]() {
yield 'hello';
yield 'world';
}
};
for (let x of obj) {
console.log(x);// hello world
}
//上面代碼中，Symbol.iterator方法幾乎不用部署任何代碼，只要用yield命令給出每一步的返回值即可。
遍歷器的return()，throw()
遍歷器返回的指針對象除了具有next方法，還可以具有return方法和throw方法。其中，next方法是必須部署的，return方法和throw方法是否部署是可選的。
return方法的使用場合是，如果for...of循環(huán)提前退出（通常是因為出錯，或者有break語句或continue語句），就會調用return方法。
如果一個對象在完成遍歷前，需要清理或釋放資源，就可以部署return方法。
throw方法主要是配合Generator函數(shù)使用，一般的遍歷器用不到這個方法。
七、for...of循環(huán)
迭代器對象允許像 CLI IEnumerable 或者 Java Iterable 一樣自定義迭代器。
將for..in轉換為自定義的基于迭代器的形如for..of的迭代，不需要實現(xiàn)一個數(shù)組，支持像 LINQ 一樣的惰性設計模式。
let fibonacci = {
[Symbol.iterator]() {
let pre = 0, cur = 1;
return {
next() {
[pre, cur] = [cur, pre + cur];
return { done: false, value: cur }
}
}
}
}
console.log(fibonacci);
for (let n of fibonacci) {
// truncate the sequence at 1000
if (n > 1000){
break;
}
console.log(n);
}
此篇終，待續(xù)……
|
