使用for...of遍历对象

我们都知道，for...of的出现是为了让开发者遍历各种数据结构能有一个统一的书写格式。但是官方并没有为对象（Object）提供一个for...of遍历的接口。那么，今天我们就来搞一波事情，通过修改Object原型上面的方法来实现对象的遍历。在这里我们就要用到ES6中的一个神器：Symbol！不说多的，咱们直接上干货！

var obj1 = {
	name: '红酒',
	price: '10元',
	weight: '1KG',
	author: '小酒一桌'
};

Object.prototype[Symbol.iterator] = function () {
	var arr = [];
	var index = 0;
	for (var key in this) {
		arr.push(key);
	};
	return {
		next: function () {
			if (index < arr.length) {
				return {
					value: this[arr[index++]],
					done: false
				}
			} else {
				return {
					value: this[arr[index++]],
					done: true
				}
			}
		}.bind(this)
	}
}

for (var key of obj1) {
	console.log(key);
}

如果注释掉原型链上面的方法，代码运行就会报一个类型错误：Uncaught TypeError: obj1 is not iterable；因为iterable是属于Symbol类型上面属性，所以我们得知，Symbol.iterator是为for...of遍历提供了一个统一的接口，所以要实现该功能，必然会要用到Symbol。代码实现思路有很多种，上面方案并不是最佳方案。只是为了证明一下，我们确实可以通过修改底层的思路来实现需求。