Computer >> Máy Tính >  >> Lập trình >> Javascript

Sự khác biệt giữa vòng lặp for ... in và for ... of trong JavaScript là gì?

Sự khác biệt giữa vòng lặp for ... in và for ... of

Cả hai vòng lặp đều lặp lại một cái gì đó. Sự khác biệt chính giữa chúng là ở những gì chúng lặp lại.

1) for ... trong vòng lặp

Vòng lặp này lặp qua thuộc tính có thể liệt kê của một đối tượng theo một thứ tự tùy ý. Nó chỉ quan tâm đến thuộc tính chứ không quan tâm đến giá trị.

Trong ví dụ sau bằng cách sử dụng for ... in lặp lại các thuộc tính của mảng được lặp lại. Vì nó là một mảng, Chỉ mục là một thuộc tính quan trọng nên chỉ mục của mỗi và mọi phần tử sẽ được lặp lại và hiển thị trong đầu ra. Ngoài lập chỉ mục, một số thuộc tính được kế thừa như " inherProp2 "," inherProp1 "cũng được hiển thị.

Ví dụ-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>

Đầu ra

0
1
2
anotherOrg  // own property
inherProp2 // inherited property
inherProp1 // inherited property


Trong ví dụ sau, vì hasOwnProperty () được sử dụng, chỉ các thuộc tính riêng, chẳng hạn như chỉ mục và các thuộc tính khác được hiển thị ở nơi là thuộc tính kế thừa, chẳng hạn như " inherProp1 "và" inherProp2 "không được hiển thị.

Ví dụ-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>

Đầu ra

0
1
2
anotherOrg

2) Vòng lặp for ... of

Không giống như cho ... trong vòng lặp, for ... of vòng lặp lặp qua các giá trị mà đối tượng xác định sẽ được lặp lại.

Trong ví dụ sau, các thuộc tính như ' Apple ',' Microsoft 'và' Tesla 'được hiển thị trong đầu ra bằng cách sử dụng for ... of vòng lặp.

Ví dụ

<html>
<body>
<script>
   var org = ["Apple", "Microsoft", "Tesla"]
   for (var key of org) {
   document.write(key);
   document.write("</br>");
}
</script>
</body>
</html>

Đầu ra

Apple
Microsoft
Tesla