JavaScript之干货（三）--- 数组（二）&&循环(for while) &&跳出循环(break、continue)

4.3二维数组

之前讲过一维数组：

我们知道一维数组是一个方括号[ ],那么二维数组就是在一维数组内继续添加方括号[ ],即数组内部继续添加数组;

// 定义一个一维数组
let arr = [];
// 给一维数组里面添加数组,这一步很关键,如果不添加数组`[]`就直接使用
arr[0] = [];
arr[0][0] = '宇智波佐助';
arr[0][1] = '男';
arr[0][2] = '下忍';
arr[0][3] = 12;
// 给一维数组里面添加数组
arr[1] = [];
arr[1][0] = '春野樱';
arr[1][1] = '女';
arr[1][2] = '下忍';
arr[1][3] = 12;
// 给一维数组里面添加数组
arr[2] = []
arr[2][0] = '漩涡鸣人';
arr[2][1] = '男';
arr[2][2] = '下忍';
arr[2][3] = 12;
console.log(arr);

arr[0] =[];表示给一维数组里面添加数组,这一步很关键,如果不在一维数组里添加数组就直接使用arr[0][0]会报错,因为你做的arr[0]操作有效,arr[0][0]无效,因为没有选到数组,还做数组操作,就是错误的.

5.1 for循环

let peppaFamily = ['佩奇', '乔治', '猪妈妈', '猪爸爸'];

for(let i = 0; i < peppaFamily.length; i++) {
  console.log(peppaFamily[i]);
}
// 输出:
// 佩奇
// 乔治
// 猪妈妈
// 猪爸爸

要循环访问数组，除了上面这种写法， js 中还有
两个跟 “for” 相关的写法可供选择：for…in 和 for…of。

for……in：循环语法

let peppaFamily = ['佩奇', '乔治', '猪妈妈','猪爸爸'];
//for...in 循环会访问数组中的每一项，这里的 i 对应数组中每一项的下标。
for(let i in peppaFamily) {
  console.log(peppaFamily[i]);
}
// 输出:
// 佩奇
// 乔治
// 猪妈妈
// 猪爸爸

for……of：循环语法

let peppaFamily = ['佩奇', '乔治', '猪妈妈','猪爸爸'];
//for...of 循环也会访问数组中的每一项，这里的 item 对应数组中每一项。
for(let item of peppaFamily) {
  console.log(item);
}
// 输出:
// 佩奇
// 乔治
// 猪妈妈
// 猪爸爸

两者的区别：for…in 循环遍历的结果是数组元素的下标，而 for…of 遍历的结果是元素的值。

5.2 while循环

除了 for 循环外，js 中还有其他的循环方式，这里我们学习 while 循环。
while 有“当”的意思，“当”满足某个条件的时候，就执行一些内容，while 语句的语法如下：

let peppaFriends = ['小狗丹尼', '小猫坎迪', '狐狸弗雷迪', '小狼温蒂', '大象艾米丽', '小兔瑞贝卡', '小羊苏西'];

let i = 0;
while (i < peppaFriends.length ) {
  console.log(peppaFriends[i]);
  i++;
}

注意：初始条件写在 while 循环外，更新条件的表达式写在执行内容里。

5.3 do…while循环

两者的区别在于先判断还是先执行：

写法一：while 先判断，后执行。
写法二：do…while，先 “do” (执行)，后 while (判断)。
但因为 do…while 是先执行后判断的，所以一定会执行一次 do 之后的内容。比如：

let i = 0;

do {
  console.log(i); // 输出：0
  i++;
} while (i < 0 );

5.4 跳出循环

跳出整个循环：breakbreak/continue

let num = [1, 1, 2, 3, 5, 8, 13, 21, 34, 55, 89, 144, 233, 377, 610, 987, 1597, 2584, 4181, 6765, 10946, 17711, 28657, 46368];

for(let i = 0;i < num.length;i++) {
  if (num[i]%5 === 0) {
    console.log(num[i]);
    // 用 break 跳出循环
    break;
  }
}

// 循环之后的语句
console.log("循环之后的语句");

break 的作用就是跳出循环，不管循环有没有结束都不会再继续下去，而是直接执行循环之后的语句。

如果我们要把数组中所有不能被5整除的元素做统一处理，比如除以5并打印，那么我们在遇到能被 5 整除的数字时，应该不作处理直接进行下一次循环。

跳过循环中的某一次迭代，我们可以使用“continue”。
迭代：每一次对过程的重复被称为一次“迭代”。

let num = [1, 1, 2, 3, 5, 8, 13, 21, 34, 55, 89, 144, 233, 377, 610, 987, 1597, 2584, 4181, 6765, 10946, 17711, 28657, 46368];

for(let i = 0;i < num.length;i++) {
  if (num[i]%5 === 0) {
    // 用 continue 跳出符合条件的这一次迭代
    console.log("跳过了第" + (i + 1) + "个数：" + num[i]);
    continue;
  }
  const handledNum = num[i] / 5;
  console.log(handledNum);
}

// 循环之后的语句
console.log("循环之后的语句");

break 和 continue 的区别
break 是终止整个循环，而 continue 是结束当前迭代，进入下一次迭代，并不会终止循环。

break案例如下：

let num = [1, 1, 2, 3, 5, 8, 13, 21, 34, 55, 89, 144, 233, 377, 610, 987, 1597, 2584, 4181, 6765, 10946, 17711, 28657, 46368];

for(let i = 0;i < num.length;i++) {
  if (num[i]%5 === 0) {
    console.log(num[i]);
    // 用 break 跳出循环
    break;
  }
}

continue案例如下：

let num = [1, 1, 2, 3, 5, 8, 13, 21, 34, 55, 89, 144, 233, 377, 610, 987, 1597, 2584, 4181, 6765, 10946, 17711, 28657, 46368];

for(let i = 0;i < num.length;i++) {
  if (num[i]%5 === 0) {
    // 用 continue 跳出符合条件的这一次迭代
    console.log("跳过了第" + (i + 1) + "个数：" + num[i]);
    continue;
  }
  const handledNum = num[i] / 5;
  console.log(handledNum);
}