for..in
循环是一种用于遍历对象的属性的方法。它的语法如下:
for (variable in object) {
// code to be executed
}
for...of
循环是一种用于遍历可迭代对象(例如数组、字符串、Map 和 Set)的方法。它的语法如下:
for (variable of iterable) {
// code to be executed
}
相同点两者都可用作遍历,只不过for...in
遍历的是数组的索引
,而for...of
遍历的是数组的值
const arr = ["a","b","c"]
for (const item of arr) {
console.log(item)
}
// Expected output: "a"
// Expected output: "b"
// Expected output: "c"
for (key in arr) {
console.log(key)
}
// Expected output: "0"
// Expected output: "1"
// Expected output: "2"
for...in
:更适合遍历对象(也可以遍历数组,遍历出的数组索引是字符串类型),遍历顺序有可能不是按照实际数组的内部顺序。
for...in
:会遍历出数组所有的可枚举属性,包括原型。如果不想遍历原型的方法和属性,可以使用hasOwnProperty()
方法进行判断。
for...of
:遍历的是数组元素值,且for...of
遍历的只是数组内的元素,不包括原型的属性、方法和索引。
for...of
:上面提到for...of
循环是一种用于遍历可迭代对象(例如数组、字符串、Map 和 Set)的方法。因此它不能遍历对象,因为没有迭代器对象。如果你非要使用它来遍历对象,也不是不行。你可以使用对象内置的Object.keys()
方法。如下:
let personalInformation = {
name: "梁予安",
age: 18,
height: "175cm",
weight: "60kg",
}
for (key of Object.keys(personalInformation)) {
console.log(key + ": " + personalInformation[key])
}
另外使用for...of
遍历出来的对象的key
是number类型(升序)
排在最前。
let personalInformation = {
b: "梁予安",
a: 18,
1: "175cm",
str: "60kg",
Boolean: true,
null: null,
undefined: undefined,
Symbol: Symbol(),
function: function () {}
}
for (key in personalInformation) {
console.log(key)
}
Expected output:
/*
1
2
4
b
a
str
Boolean
null
undefined
Symbol
function
*/