for循环

for语句是一种先测试循环语句（即先检测退出条件，再执行循环体内的代码）

「1.语法结构」

for(初始化变量; 条件表达式; 操作表达式 ){                                          //循环体 }

运算符	描述
初始化变量	通常被用于初始化一个计数器,该表达式可以使用var关键字声明新的变量，这个变量帮我们来记录次数。
条件表达式	用于确定每一次循环是否能被执行，如果结果是true就继续循环，否则退出循环
操作表达式	每次循环的最后都要执行的表达式。通常用于更新计数器变量的值

三个表达式都可以省略，但是表达式之间的分号不能省略。都省略的话就创造了一个无穷循环。 

「2.执行流程」

1. 初始化变量，初始化操作在整个 for 循环只会执行一次。
2. 执行条件表达式，如果为true，则执行循环体语句，否则退出循环，循环结束。
3. 执行操作表达式,此时第一轮结束。
4. 第二轮开始，直接去执行条件表达式（不再初始化变量），如果为 true ，则去执行循环体语句，否则退出循环。
5. 继续执行操作表达式，第二轮结束。
6. 后续跟第二轮一致，直至条件表达式为假，结束整个 for 循环。

「3.用法」

1.for循环用于遍历数组，不能直接遍历对象，需要用Object.key()属性转化

//for循环遍历数组
var arr = [1,2,3,4,5]
for (let i = 0; i < arr.length; i++) {
    console.log(arr[i]);    
}

  

//for循环遍历对象
var obj = {a:1,b:2,c:3}  //对象
 
var obj2 = Object.keys(obj) //用Object.key()属性转化为数组类型
console.log(obj2);
 
for (let i = 0; i < obj2.length; i++) {
    console.log(obj2[i]+':'+obj[obj2[i]]);    
}

 

2.能使用break,continue语句跳出循环。

 for (var i = 1; i <= 5; i++) {
     if (i == 3) {
         console.log('这个包子有虫子，扔掉');
         continue; // 跳出本次循环，跳出的是第3次循环
       }
      console.log('我正在吃第' + i + '个包子呢');
 }

for (var i = 1; i <= 5; i++) {
   if (i == 3) {
       break; // 直接退出整个for 循环，跳到整个for下面的语句
   }
   console.log('我正在吃第' + i + '个包子呢'); 
}

---

 for...in循环

        for..in语句是一种严格的迭代语句，用于枚举对象中的非符号键属性(包括它的原型链上的可枚举属性)，我们可以简单理解为它适合遍历对象的属性。

这里我们简单了解一下Symbol类型

       symbol 是一种基本数据类型 （primitive data type）。Symbol()函数会返回symbol类型的值，该类型具有静态属性和静态方法。它的静态属性会暴露几个内建的成员对象；它的静态方法会暴露全局的symbol注册，且类似于内建对象类，但作为构造函数来说它并不完整，因为它不支持语法："new Symbol()"。

每个从Symbol()返回的symbol值都是唯一的。一个symbol值能作为对象属性的标识符；这是该数据类型仅有的目的。

这里的非符号键指不是 Symbol 的键，在任何迭代中，键为 Symbol 都会被忽略。只能使用 Object.getOwnPropertySymbols 获取所有的 Symbol 键。

「1.语法结构」

for(var 变量  in  数组名或集合名)  //变量中存放的数组或集合的索引          {             数组名[变量]          }

「2.用法」

let obj = {
    name: '刘备',
    sex: '男',
    age: 28,
    sleep: function () { },
    eat: function () { }
}
for (attr in obj) {//遍历obj对象的所有属性
    console.log(attr);
}

 for...of循环

for...of语句是一种严格的迭代语句，用于遍历可迭代对象的元素。

「1.语法结构」

for(var 变量 of 数组名或集合名) //变量中存放的是数组或集合中的元素          {              console.log(变量);          }

「2.用法」

1.遍历数组

let arr=[12,22,32,42,52,62]
  for (k of arr) {//遍历数组对象的所有属性
    console.log(k);//12, 22, 32, 42, 52, 62
}

  

2.遍历对象（无法直接遍历对象）

var person = {name:'张三',age:22,gender:'男'}
var obj = Object.keys(person);  //for...of也不能直接遍历对象，跟for一样需要转换
for(var value of obj){
    console.log(value+':'+person[value]);
}

---

 forEach方法

forEach() 方法用于调用数组的每个元素，并将元素传递给回调函数。

「1.语法结构」

arr.forEach(function(k){  //依次从数组中取出元素放在k中,然后将k作为参数传递给函数          console.log(k);        })

注意: forEach() 对于空数组是不会执行回调函数的。 

forEach() 本身是不支持的 continue 与 break 语句的，我们可以通过some 和 every 来实现。

some() 方法用于检测数组中的元素是否满足指定条件（函数提供）。

some() 方法会依次执行数组的每个元素：

• 如果有一个元素满足条件，则表达式返回true , 剩余的元素不会再执行检测。
• 如果没有满足条件的元素，则返回false。

注意： some() 不会对空数组进行检测。

注意： some() 不会改变原始数组。

every() 方法用于检测数组所有元素是否都符合指定条件（通过函数提供）。

every() 方法使用指定函数检测数组中的所有元素：

• 如果数组中检测到有一个元素不满足，则整个表达式返回 false ，且剩余的元素不会再进行检测。
• 如果所有元素都满足条件，则返回 true。

注意： every() 不会对空数组进行检测。

注意： every() 不会改变原始数组。

 

「2.用法」

遍历数组

var arr = ['金','木','水','火','土']
arr.forEach(function (value) {  //参数1：value---正在遍历的元素
    console.log(value);
})
 
arr.forEach(function (value,index) { //参数2：index---元素的索引
    console.log(index);
})
 
arr.forEach(function (value, index,Array) { //参数3：Array---正在遍历的数组
    console.log("Array="+arr);
})

---

比较

• for循环、for...in循环和for..of循环能中断循环(使用break,continue)；forEach不可以。
• for循环、for..of循环和forEach不能直接遍历对象，for...in可以。
• for...in遍历数组时会跳过空位，如果有原型属性，原型属性也会被访问。
•  for...in遍历的是数组的索引，for...of遍历数组元素值。
•  for...of不能循环普通的对象，需要通过和Object.keys()搭配使用。
• 如果for...in要迭代的变量是null或undefined,则不执行循环体。
• forEach（value，index，Array）不能同时遍历多个集合,在遍历的时候无法修改和删除集合数据。被调用时，不会改变原数组，也就是调用它的数组。
• forEach与for当循环遍历为空的数组时，forEach会跳过为空的值，for不会跳过为空的数据，会直接显示undefined。两者都能识别出NULL。

参考文章