在 JavaScript 中，我们可以使用 for...in 循环来遍历一个对象中所有可枚举属性的键名。然而，这个循环有时候会表现出一些奇怪的行为，特别是当我们对数组进行遍历的时候。
数组遍历中的问题
让我们看一下下面的代码：
----- --- - --- -- --- ------- - ------ --- ---- - -- ---- - --------------- -
如果你运行这段代码，你会发现它输出了以下内容：
- - - ---
这里的问题在于，for...in 循环并不仅仅只遍历数组元素本身，而是会遍历数组对象上的所有可枚举属性，包括我们自己添加的 foo 属性。
因此，如果你只想要遍历数组元素本身，你需要加上一个判断语句来排除掉其他属性：
----- --- - --- -- ---
------- - ------
--- ---- - -- ---- -
-- ----------------------- -
---------------
-
-现在，这段代码只会输出：
- - -
因为我们使用了 hasOwnProperty() 方法来检查属性是否是对象本身的属性。
对象遍历中的问题
除了数组之外，在遍历对象时也可能会出现问题。让我们看一下下面的代码：
----- --- - - -- -- -- -- -- - -- -------------------- - ------ --- ---- ---- -- ---- - ------------------ -
如果你运行这段代码，你会发现它输出了以下内容：
- - - ---
同样的，for...in 循环并不仅仅只遍历对象本身的属性，而是包括了原型链上的属性。因此，如果你只想要遍历对象自身的属性，你需要加上一个判断语句来排除掉其他属性：
----- --- - - -- -- -- -- -- - --
-------------------- - ------
--- ---- ---- -- ---- -
-- -------------------------- -
------------------
-
-现在，这段代码只会输出：
- - -
总结
在 JavaScript 中，for...in 循环虽然非常便捷，但是需要注意其奇怪的遍历行为。特别是在遍历数组和对象时，我们需要使用 hasOwnProperty() 方法去排除掉原型链上的属性，确保我们只遍历到对象/数组本身的属性。
希望这篇文章对你有所帮助！
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/29358