Explain for. . .of loop JavaScript.

Javascript Web Development Object Oriented Programming

The for..of loop allow us to iterate over iterable objects like array, string, array like objects, nodelist etc.

Following is the code for for..of loop in javaScript −

Example

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
   body {
      font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
   }
   .result,.sample {
      font-size: 20px;
      font-weight: 500;
   }
</style>
</head>
<body>
<h1>for..of loop JavaScript</h1>
<div class="sample"></div>
<div style="color: green;" class="result"></div>
<button class="Btn">CLICK HERE</button>
<h3>
Click on the above button to iterate over the above string using for..of loop
</h3>
<script>
   let resEle = document.querySelector(".result");
   let sampleEle = document.querySelector(".sample");
   let str = "Hello";
   sampleEle.innerHTML = str;
   document.querySelector(".Btn").addEventListener("click", () => {
      for (i of str) {
         resEle.innerHTML += i + "<br>";
      }
   });
</script>
</body>
</html>