Bucle For de JavaScript

El bucle se utiliza en la programación para ejecutar tareas repetitivas automáticamente.

Por ejemplo, supongamos que queremos imprimir "Hello World" 10vez. Puede hacerlo de la siguiente manera:

　　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>");

En el bucle, la declaración solo se debe escribir una vez, y el bucle se ejecutará10La vez, como se muestra a continuación:

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

Bucle For

La sintaxis del bucle for es la siguiente:

for (initialization; condition; final-expression) {
　　　　//La declaración por ejecutar
}

initializationSe ejecuta antes de ejecutar la declaración (una vez).

conditionSe define la condición de ejecución de la declaración.

Después de ejecutar la declaración, se ejecutaráfinal-expression.

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

A partir del ejemplo anterior, puede leerse:

• initialization Se establece la variable antes de que comience el bucle (variable i = 0).

• condition Se define la condición de ejecución del bucle (debo ser menor que5)

• Cada vez que se ejecuta el bloque de código en el bucle,final-La expresión siempreAumentar un valor (i ++)

En el siguiente ejemplo, recorremos un array en orden ascendente:

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);
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);
}

En cada iteración, se asigna una propiedad del objeto ax,Y este bucle continúa hasta que se agoten todas las propiedades del objeto.

El siguiente ejemplo implementa un bucle for...in y imprime las propiedades del navegador web.NavigatorObjeto:

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

Bucle For...Of

La sentencia for...of crea un bucle que recorre objetos iterables, incluyendo: String integrado, Array, objetos similares a Array y objetos iterables definidos por el usuario.

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

En cada iteración, se asigna un elemento del objeto ax,Y este bucle continúa hasta que se agoten todos los elementos del objeto.

Independientemente de lo que itere for...in y for...of, la principal diferencia entre ellos radica en lo que iteran:

• Iteración de propiedades enumeradas del objeto en bucle for...in, en cualquier orden

• Iteración de datos en bucle for...of, el objeto iterado debe definirse para ser recorrido

Bucle while

La estructura de bucle while y do...while se explicará en el siguiente capítulo.