木灵鱼儿
阅读:189
对象的遍历
for...in循环可以用来遍历对象的可枚举属性列表,但是如果遍历对象的值呢?
以数组为例,我们最基础的方式就是for循环:
var myArray = [1, 2, 3];
for (var i = 0; i < myArray.length; i++) {
console.log(myArray[i]);
}
// 1 2 3
事实上这种并不是真的遍历值,而是在遍历下标来获取到对应的值。
ES5新增了一些数组的遍历方法,比如:forEach(..)、every(..) 和 some(..);每种方法都可以接受一个回调函数并将其应用到数组每个元素上,,唯一的区别就是它们对于回调函数返回值的处理方式不同。
数组也可以使用for..in,不过得到的也是数组下标,在ES6的时候,新增了for...of的循环方法,用于遍历数组的值。
var myArray = [1, 2, 3];
for (var v of myArray) {
console.log(v);
}
// 1
// 2
// 3
for..of 循环首先会向被访问对象请求一个迭代器对象,然后通过调用迭代器对象的next() 方法来遍历所有返回值。
而数组内置了@@iterator迭代器,所以for...of可以直接应用在数组上。
我们可以手动调用迭代器来实现遍历数组:
var myArray = [1, 2, 3];
var it = myArray[Symbol.iterator]()
it.next(); // { value:1, done:false }
it.next(); // { value:2, done:false }
it.next(); // { value:3, done:false }
it.next(); // { done:true }
如你所见,调用迭代器的 next() 方法会返回形式为 { value: .. , done: .. } 的值,value 是当前的遍历值,done 是一个布尔值,表示是否还有可以遍历的值。
注意,和值“3”一起返回的是 done:false,乍一看好像很奇怪,你必须再调用一次next() 才能得到 done:true,从而确定完成遍历。这个机制和 ES6 中发生器函数的语义相关,不过已经超出了我们的讨论范围。
和数组不同,普通的对象是没有内置迭代器的,所以它无法直接通过for...of来实现遍历值。
但是我们可以自己手动添加一个迭代器来实现:
var myObject = {
a: 2,
b: 3
};
Object.defineProperty(myObject, Symbol.iterator, {
enumerable: false,
writable: false,
configurable: true,
value: function() {
var o = this;
var idx = 0;
var ks = Object.keys(o);
return {
next: function() {
return {
value: o[ks[idx++]],
done: (idx > ks.length)
};
}
};
}
});
// 手动遍历 myObject
var it = myObject[Symbol.iterator]();
it.next(); // { value:2, done:false }
it.next(); // { value:3, done:false }
it.next(); // { value:undefined, done:true }
// 用 for..of 遍历 myObject
for (var v of myObject) {
console.log(v);
}
// 2
// 3
版权申明
本文系作者 @木灵鱼儿 原创发布在木灵鱼儿 - 有梦就能远航站点。未经许可,禁止转载。
相关推荐
生成器 Generator
简介Promise的出现,我们可以将回调进行反客为主,不在受回调调用者的限制(控制反转和信任问题),但是它并没有解决异步编程导致的代码顺序问题,有没有一种方式,可以让我们的代码虽然是异步的,但是书写顺序却是同步的,这样完全符合我们人类大脑理解方式?console.log("同步的1"); axios({ ... }).then(() => { console.log("异步的回调,如果需要等待结果处理,代码只能写在这个回调里") }); console.log("同步的2")很明显,如果我们希望"同步...
Iterator 和 for...of 循环
Iterator(遍历器)的概念JavaScript 原有的表示“集合”的数据结构,主要是数组(Array)和对象(Object),ES6 又添加了Map和Set。这样就有了四种数据集合,用户还可以组合使用它们,定义自己的数据结构,比如数组的成员是Map,Map的成员是对象。这样就需要一种统一的接口机制,来处理所有不同的数据结构。遍历器(Iterator)就是这样一种机制。它是一种接口,为各种不同的数据结构提供统一的访问机制。任何数据结构只要部署 Iterator 接口,就可以完成遍历操作(即依次处理该数据结构的所有成员)。Iterator 的作用有三个:一是为各种数据结构,提供一个统一...