JavaScript中的for ... in和for ... of循环有什么区别?

for ... in和for ... of循环之间的区别

这两个循环都对某事进行迭代。它们之间的主要区别在于它们迭代的内容。

1)for ...在循环中

此循环以任意顺序遍历对象的可枚举属性。它只关心属性,而不关心值。

在下面的示例中,通过使用for ... in循环,可以迭代数组的属性 。由于它是一个数组,因此Index是重要的属性,因此将迭代每个元素的索引并将其显示在输出中。除索引外,还将显示一些继承的属性,例如“ inherProp2 ”,“ inherProp1 ”。

示例1

<html>

<body>

<script>

   Object.prototype.inherProp1 = function({};

   Array.prototype.inherProp2= function({};

   var org = ["Apple""Microsoft""Tesla"]

   org.anotherOrg = "solarCity";

   for (var key in org) {

      document.write(key);

      document.write("</br>");

}

</script>

</body>

</html>

输出结果

0

1

2

anotherOrg  // own property

inherProp2 // inherited property

inherProp1 // inherited property


在下面的示例中,由于使用了hasOwnProperty(),因此仅显示自己的属性(例如索引) 和其他属性,而不会显示继承的属性(例如“ inherProp1 ”和“ inherProp2 ”)。 

示例2

<html>

<body>

<script>

   Object.prototype.objCustom = function({};

   Array.prototype.arrCustom = function({};

   var org = ["Apple""Microsoft""Tesla"]

   org.anotherOrg = "solarCity";

   for (var i in org) {

      if (org.hasOwnProperty(i)) {

         document.write(i);

         document.write("</br>");

      }

   }

</script>

</body>

</html>

输出结果

0

1

2

anotherOrg

2)for ... of循环

与 for ... in循环不同,for ... of循环迭代对象定义要迭代的值。

在以下示例中,使用for ... of循环在输出中显示“ Apple ”,“ Microsoft ”和“ Tesla ”等属性。

示例

<html>

<body>

<script>

   var org = ["Apple""Microsoft""Tesla"]

   for (var key of org) {

   document.write(key);

   document.write("</br>");

}

</script>

</body>

</html>

输出结果

Apple

Microsoft

Tesla

以上是 JavaScript中的for ... in和for ... of循环有什么区别? 的全部内容, 来源链接: utcz.com/z/345506.html

回到顶部