随着数据结构的增多，我们需要统一的对数据的遍历接口，ES6提供了Iterator遍历器。
1默认用法
默认实现了Iterator遍历器的数据结构可直接使用，如Array数组。代码如下：
let arr = ['a','b','c'];
let iter = arr[Symbol.iterator]();
iter.next() // { value: 'a', done: false }
iter.next() // { value: 'b', done: false }
iter.next() // { value: 'c', done: false }
iter.next() // { value: undefined, done: true }
由以上代码可见，使用遍历器接口可以遍历数组，返回值为一个对象，value为当前元素，done为一个布尔值，当该值为true时说明遍历到了数据机构的末尾。
写成循环是下面这个样子：
let arr = ['a','b','c'];
let iter = arr[Symbol.iterator]();
let i = {value:null,done:false};
while(!i.done){
i=iter.next();
console.log(i.value);
}
//a b c undefined
ES6中默认实现了Iterator接口的数据结构包括如下几种：
- Array
- Map
- Set
- String
- TypedArray
- 函数的 arguments 对象
- NodeList 对象
2实现自定义Iterator接口
默认实现了Iterator接口的数据结构都可以使用for...of遍历。
let obj = {
name:'zhangsan',
age:18,
count:[{yuWen:80},{huaXue:90}]
}
for(let key of obj){
console.log(key);
}
//报错： obj is not iterable
说明obj对象默认没有实现Iterator接口，那我们该如何去部署一个自定义的遍历器接口呢？
- 为数据结构添加Symbol.iterator属性，其是一个函数
- Symbol.iterator属性函数返回一个对象，该对象包含next方法
-
next方法返回一个{value:xxx,done:boolean}形式的对象
代码如下：
let obj = {
name:'zhangsan',
age:18,
count:[{yuWen:80},{huaXue:90}],
[Symbol.iterator](){
let index = 0;
let map = new Map();
for(let key in obj){
map.set(key,obj[key]);
}
let arr = Array.from(map);
return {
next(){
if(index<arr.length){
return {
value:arr[index++][1],
done:false
}
}else{
return {
value:undefined,
done:true
}
}
}
}
}
}
for(let value of obj){
console.log(value);
}
//zhangsan 18 [{…}, {…}]
以上实现的遍历器返回的都是对象的value值，如果想返回对应的key值，只需将value:arr[index++][1],的索引变为0即可：
let obj = {
name:'zhangsan',
age:18,
count:[{yuWen:80},{huaXue:90}],
[Symbol.iterator](){
let index = 0;
let map = new Map();
for(let key in obj){
map.set(key,obj[key]);
}
let arr = Array.from(map);
return {
next(){
if(index<arr.length){
return {
value:arr[index++][0],
done:false
}
}else{
return {
value:undefined,
done:true
}
}
}
}
}
}
for(let key of obj){
console.log(key);
}
//name age count
