JavaScript For 循环

循环在编程中用于自动执行重复性任务。

例如，假设我们要打印“ Hello World” 10次。可以如下所示进行：

  document.write("Hello World<br>");
  document.write("Hello World<br>");
  document.write("Hello World<br>");
  document.write("Hello World<br>");
  document.write("Hello World<br>");
  document.write("Hello World<br>");
  document.write("Hello World<br>");
  document.write("Hello World<br>");
  document.write("Hello World<br>");
  document.write("Hello World<br>");

而在循环中，该语句只需编写一次，循环将执行10次，如下所示：

for (let i = 0; i < 10; i++) {
document.write("Hello World<br>");
}

For 循环

for循环的语法如下：

for (initialization; condition; final-expression) {
    //待执行的语句
}

initialization 在执行语句之前执行（一次）。

condition 定义了执行语句的条件。

在执行完语句后，每次都会执行 final-expression 。

for (var i = 0; i < 5; i++) {
    document.write("<br>The number is " + i);
}

从上面的示例中，您可以阅读：

• initialization 在循环开始之前设置变量（变量i = 0）。

• condition 定义了循环运行的条件（我必须小于5）。

• 每次执行循环中的代码块时， final-expression都会 增加一个值（i ++）。

在下面的示例中，我们以升序循环遍历一个数组：

var fruits = ['Apple', 'Mango', 'Banana', 'Orange'];
var txt = '';
for (var i = 0; i < fruits.length; i++) {
    txt += fruits[i] + '<br>';
}

在下面的示例中，我们以降序循环遍历一个数组：

var fruits = ['Apple', 'Mango', 'Banana', 'Orange'];
var txt = '';
for (var i = fruits.length -1; i >= 0; i--) {
txt += fruits[i] + '<br>';
}

可选表达式

for循环中的三个表达式都是可选的。例如，我们可以通过在循环外部初始化变量来编写相同的For语句，而不需要初始化表达式。

//在循环外声明变量
var i = 0;
//初始化循环
for (; i < 5; i++) {
document.write(i);
}

在这种情况下，第一个； 表示该语句是指向初始化，条件还是最终表达式，即使省略它也是必要的。

下面，我们还可以从循环中删除条件。我们将使用一个if语句和break来告诉循环在i大于3时停止运行，这与 true 条件相反。

//在循环外声明变量
var i = 0;
//省略初始化和条件
for (; ; i++) {
if (i > 3) {
break;
document.write(i);
}

注意： break如果省略该条件，则必须包含该语句，否则循环将永远无限循环运行，并可能导致浏览器崩溃。

最后，可以通过将最终表达式放在循环末尾来将其删除。两个分号仍必须包含在内，否则循环将无法运行。

//在循环外声明变量
var i = 0;
//省略所有表达式
for (; ;) {
if (i > 3) {
break;
document.write(i);
}

从上面的示例可以看出，包括所有这三个语句通常会产生最简洁易读的代码。但是，知道以后可以省略语句是很有用的。

嵌套循环

您可以嵌套循环，即在另一个循环内循环。

嵌套循环在矩阵乘法中的大多数地方都使用，显示表格和许多其他地方：

var txt = "";
for (var row = 0; row < 10; row++) {
   for (var col = 0; col < row; col++) {
   txt += " * ";
   txt += "<br>";
}

For ...in循环

for...in循环迭代的对象的属性。

为了演示，我们将创建一个简单的 myObj 对象，其中包含一些 name：value 对。

var myObj = {
name: "VISHAL",
age: 22,
height: 175,
city: "New Delhi",
getNothing: function () {return "";}
for (let x in myObj) {
document.write(x);
}

在每次迭代中，将来自对象的一个属性分配给 x， 并且此循环一直进行到对象的所有属性用尽为止。

以下示例实现一个for...in循环并打印Web浏览器的 Navigator 对象：

for (let x in navigator) {
document.write(x);
}

For ... Of循环

for...of语句创建一个循环遍历可迭代对象，包括：内置String，Array，类似Array的对象和用户定义的可迭代对象。

let iterable = [10, 20, 30, 40, 50];
for (let x of iterable) {
document.write(x);
}

在每次迭代中，将来自对象的一个元素分配给 x， 并且此循环持续进行到对象的所有元素用尽为止。

无论for...in和for...of循环迭代的东西。它们之间的主要区别在于它们迭代的内容：

• for...in循环迭代的对象的枚举的属性，以任意的顺序

• for...of循环迭代数据，该迭代的对象定义要遍历

While循环

在while环路和do...while环路将在下一章来解释。