JS双重for循环详解

1. 引言

在 JavaScript 编程中，双重 for 循环是非常常见且重要的一种控制结构。它允许我们在一个循环内执行另一个循环，从而对多维数据进行操作或者进行一些需要嵌套循环进行的任务。本文将详细介绍 JS 中双重 for 循环的使用方法和常见应用场景。

2. 双重for循环的基本语法

双重 for 循环基本的语法形式如下：

for (let i = 0; i < length1; i++) {
    for (let j = 0; j < length2; j++) {
        // 循环体
    }
}

其中，length1 和 length2 表示循环的次数，可以是数字或者通过计算得到的变量。在每次迭代时，内部的 for 循环都会完全执行一遍。

3. 双重for循环的应用场景

双重 for 循环能够处理多维数组和矩阵，以及其他需要使用嵌套循环的问题。下面将介绍几个常见的应用场景。

3.1. 访问多维数组的元素

当我们需要遍历和操作多维数组时，双重 for 循环可以起到很大的作用。例如，下面的示例代码展示了如何遍历一个二维数组并打印出每个元素的值：

let array = [[1, 2, 3], [4, 5, 6], [7, 8, 9]];
for (let i = 0; i < array.length; i++) {
    for (let j = 0; j < array[i].length; j++) {
        console.log(array[i][j]);
    }
}

代码运行结果如下：

3.2. 生成九九乘法表

双重 for 循环也被广泛应用于生成九九乘法表。下面的示例代码展示了如何使用双重 for 循环生成一个简单的九九乘法表：

for (let i = 1; i <= 9; i++) {
    let row = '';
    for (let j = 1; j <= i; j++) {
        row += ` ${i} *$ {j} = ${i * j}\t`;
    }
    console.log(row);
}

代码运行结果如下：

1 * 1 = 1
2 * 1 = 2   2 * 2 = 4
3 * 1 = 3   3 * 2 = 6   3 * 3 = 9
4 * 1 = 4   4 * 2 = 8   4 * 3 = 12  4 * 4 = 16
5 * 1 = 5   5 * 2 = 10  5 * 3 = 15  5 * 4 = 20  5 * 5 = 25
6 * 1 = 6   6 * 2 = 12  6 * 3 = 18  6 * 4 = 24  6 * 5 = 30  6 * 6 = 36
7 * 1 = 7   7 * 2 = 14  7 * 3 = 21  7 * 4 = 28  7 * 5 = 35  7 * 6 = 42  7 * 7 = 49
8 * 1 = 8   8 * 2 = 16  8 * 3 = 24  8 * 4 = 32  8 * 5 = 40  8 * 6 = 48  8 * 7 = 56  8 * 8 = 64
9 * 1 = 9   9 * 2 = 18  9 * 3 = 27  9 * 4 = 36  9 * 5 = 45  9 * 6 = 54  9 * 7 = 63  9 * 8 = 72  9 * 9 = 81

3.3. 多重循环的排序算法

在排序算法中，通常需要使用多重循环来进行比较和交换操作，以达到排序的目的。下面是一个简单的冒泡排序算法的示例代码：

let array = [5, 3, 8, 1, 2];
for (let i = 0; i < array.length - 1; i++) {
    for (let j = 0; j < array.length - i - 1; j++) {
        if (array[j] > array[j + 1]) {
            let temp = array[j];
            array[j] = array[j + 1];
            array[j + 1] = temp;
        }
    }
}
console.log(array);

代码运行结果如下：