解释JavaScript中for(.. in)和for(.. of)循环语句之间的区别？

通常在JavaScript脚本中, 我们迭代一些内置类的一些对象, 例如Arrays, Dictionary, Strings, Maps等。我们使用循环来迭代对象。 JavaScript支持各种循环：

for循环
for(..in)循环
for(..of)循环
while循环
do-while循环

在本文中, 我们将学习for(..in)和for(..of)循环之间的区别。

for(..in)循环：JavaScript for(..in)语句循环遍历对象的可枚举属性。该循环将遍历对象本身的所有可枚举属性以及对象从其构造函数的原型继承的那些属性。

语法如下：

for (variable in object)
  statement

例子

<!DOCTYPE html>
  <html>
    
  <body>
      <p id="demo"></p>
      <script>
          var person = {
              firstName: "srcmini",
              lastName: "<br>A Computer Science Portal for Geeks ",
              rank: 43
          };
          var userId = "";
          var i;
          for (i in person) {
              userId += person[i];
          }
          document.getElementById("demo").innerHTML = userId;
      </script>
  </body>
    
  </html>

输出:正如你所看到的，for (..in)循环只遍历dictionary对象的属性或值。

srcmini
  A Computer Science Portal for Geeks 43

for (..of)循环:这个for (..of)语句允许循环遍历可迭代的数据结构，如数组、字符串、映射、节点列表等。它调用一个自定义迭代钩子，并在对象的每个属性的值上执行指令。

语法如下：

for (variable of iterable) {
  statement
}

例子：

<!DOCTYPE html>
  <html>
      <body>
          <p id ="demo"></p>
          <script>
          var text = [
              "srcmini",
              " A Computer Science Portal for Geeks ", 
              "43"
              ];
          var userId = "";
          var i;
          for (i of text) {
          userId+=i;
          }
          document.getElementById("demo").innerHTML = userId;
          </script>
      </body>
  </html>

输出:正如你所看到的，for (..of)循环只迭代数组对象的内容。

srcmini A Computer Science Portal for Geeks 43

猜你喜欢