for of 和 for in

for of

具有遍历器(Inteator)接口的数据结构，都可以通过 for of 去消费

具体可看遍历器(Inteator)

特点

1. 依赖遍历器(Inteator)接口,所以原生的对象类型是没有 Inteator 所以不能使用 for of 遍历对象类型

2. 使用 foreach 遍历数组的话，使用 break 不能中断循环，使用 return 也不能返回到外层函数，而 for of 可以通过 break 和 throw 去跳出循环

// 情况一
for (let line of [1, 2, 3, 4, 5, 6]) {
	console.log(line); // 1 , 2 , 3 , 4
	if (line === 4) {
		break;
	}
}

// 情况二
for (let line of [1, 2, 3, 4, 5, 6]) {
	console.log(line); // 1 , 2 , 3 , 4
	if (line === 4) {
		throw new Error();
	}
}

for in

for...in 语句以任意顺序遍历一个对象的除Symbol以外的可枚举属性。

特点

1. 只遍历可枚举属性（包括它的原型链上的可枚举属性）

2. 以任意序迭代一个对象的属性(无序)

例子

1. 继承的属性 其是可以枚举的所以显示

var triangle = { a: 1, b: 2, c: 3 };

function ColoredTriangle() {
	this.color = 'red';
}

ColoredTriangle.prototype = triangle;

var obj = new ColoredTriangle();

for (var prop in obj) {
	if (obj.hasOwnProperty(prop)) {
		console.log(`obj.${prop} = ${obj[prop]}`);
	}
}

// Output:
// "obj.color = red"

2. Symbol 和 定义的不可枚举的属性

let obj = {
	[Symbol('gz')]: 'gz',
	1: 1,
	2: 2,
};

Object.defineProperty(obj, 3, {
	enumable: false,
	value: 20,
});

for (var prop in obj) {
	console.log(`obj.${prop} = ${obj[prop]}`);
}

结果为：

obj.1 = 1
obj.2 = 2