JavaScript中for...in和for...of的使用

定义一个需要遍历的对象

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
const obj1 = {
[0]: 100,
[1]: 101,
[2]: 102,
[3]: 103,
item1: 'item1',
fun1: function() {
console.log(this[0])
},
arr1: [1, 2, 3],
[Symbol.iterator](){
let n = this.arr1.length
return {
i: 0,
next() {
if (this.i < n) {
return {value: this.i++, done: false}
}
return {value: undefined, done: true}
}
}
}
};

使用for…in…遍历

1
2
3
4
console.log('use for...in')
for (let obj in obj1) {
console.log(obj);
}

使用for…of…遍历

1
2
3
4
console.log('use for...of')
for (let obj of obj1) {
console.log(obj);
}

添加新的内容然后遍历

1
2
3
4
5
obj1.arr1.push(4, 5, 6);
console.log('use for...of add')
for (let obj of obj1) {
console.log(obj);
}

遍历字符串

1
2
3
4
let str = 'merry'
for (let obj of str) {
console.log(obj);
}

输出结果

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
use for...in
0
1
2
3
item1
fun1
arr1
use for...of
0
1
2
use for...of add
0
1
2
3
4
5
m
e
r
r
y