关于常用循环遍历获取数据

一、for循环(常用于数组的循环遍历）

let arr = [1,2,3];
for (let i=0; i<arr.length; i++){
 console.log(i,arr[i])
}
// 0 1
// 1 2
// 2 3

二、for in（主要用于遍历普通对象，也可遍历数组）

let obj = {name:'张',age:'三'}
for(let i in obj){
 console.log(i,obj[i])  //i 代表对象的 key 值，obj[i] 代表对应的 value
}
// name 张
// age 三


//***用于遍历数组时，i 输出为字符串形式 若要进行数字运算可用 parseInt(i) 转换为 number 类型

三、while 循环（对一个值或表达式是否达到要求来使用）

var arr = [1,2,3];
var i = 0;
while(arr[i]){
   i++;
   console.log(i)
}
console.log('end : ' + i);

//数组arr[i]有值则判断为true就进while继续循环，arr[i]无值则false就跳出循环

for(var i = 0; arr[i]; i++) {
　　console.log(i);
}
console.log('end : ' + i);

//这种形式也一样

//二者大致功能相同，使用场景可能有所区别，一般for用来循环遍历数组，而while一般是对一个值或表达式是否达到要求来使用的

里面的for循环也可以这样写：

let i=0;
for (;arr[i];){  //这里两个;代表空语句，就是什么都不做。当arr数组，索引为 i 的那个元素的值，非0(真)时循环。
   console.log(arr[i]) i++; 
}; 

//for(var i=0;i<10;i++ )  //其中var i=0 可以在循环体外定义，i++ 可以写在循环体内，所以for循环也可以简化为 for(;i<10;)

四、do while循环

let i = 3;
do{
 console.log(i)
 i--;
}
while(i>0)
// 3
// 2
// 1

//do while 循环是 while 循环的一个变体，它首先执行一次操作，然后才进行条件判断，是 true 的话再继续执行操作，是 false 的话循环结束。

五、forEach（只能遍历数组）

具体介绍：https://www.runoob.com/jsref/jsref-foreach.html

let arr = [1,2,3];
arr.forEach(function(i,index){
 console.log(i,index)
})
// 1 0
// 2 1
// 3 2

var numbers = [65, 44, 12, 4];
/** 参数             描述
**  currentValue    必需。当前元素value
**  index     可选。当前元素的索引值。
**  arr     可选。当前元素所属的数组对象。
**/
numbers.forEach(function(item,index,arr){
　　arr[index] = item * 10;//得到乘以10以后的值
   console.log(numbers); //***改变了原数组
})

forEach(): 没有返回值，本质上等同于 for 循环，对每一项执行 function 函数。forEach 是改变原数组。

forEach() 在所有元素调用完毕之前是不能停止的，本身是不支持 continue 与 break 语句的。

不支持 continue，用 return false 或 return true 代替。不支持 break，用 try catch/every/some 代替：

//1、实现 continue：

  //forEach() 使用 return 语句实现 continue 关键字的效果：

  var arr = [1,2,3,4,5];
　
  arr.forEach(function (item) {

    if (item === 3) {

        return;
    }
    console.log(item);
  });

  //最后输出：1 2 4 5   说明：item为3的元素跳过

  var arr = [1,2,3,4,5];

  arr.some(function (item) {
    if (item === 3) {
          return;  // 不能为 return false
    }
  　console.log(item);
  });

  //最后输出：1 2 4 5 false

//2、实现 break：

  var arr = [1, 2, 3, 4, 5];

  arr.every(function (item) {
        console.log(item);
        return item !== 3;
  });

  //最后输出： 1 2 3 false   说明：输出3后直接跳出循环

六、map()（只能遍历数组）

let arr = [1,2,3];
let arr2= arr.map(function(i){
 console.log(i)
 return i*2;
})
console.log("新数组：",arr2)
//1 2 3
//新数组： [2,4,6]

注意：map是返回一个新数组，原数组不变。

七、filter()（遍历数组）

let arr = [1,2,3];
let arr2= arr.filter(function(item){
 return item > 1;
})
console.log(arr2);
//[2,3]
//返回通过过滤的元素，不改变原来的数组

八、some() 与every() （遍历数组）

let arr = [1,2,3];
arr.some(function(i){
 return i>1;  // 检测数组中是否有元素大于1
})
//true

let arr2= [1,2,3];
arr2.every(function(i){
 return i>1;  // 检测数组中元素是否都大于1
})
// false

九、reduce()与reduceRight()（遍历数组）

reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。

let arr = [1,2,3];
let arr2 = arr.reduce(function(i,j){
 return i+j;
})
// 6

reduceRight()方法,和 reduce() 功能是一样的，它是从数组的末尾处向前开始计算。

let arr = [1,2,3];
let arr2= arr.reduceRight(function(i,j){
 return i+j;
})
// 6

十、for of 循环

let arr = ['name','age'];
for(let i of arr){
 console.log(i)
}
// name
// age

es6 中新增的语句，用来替代 for in 和 forEach，允许遍历数组、字符串、映射、集合等可迭代的数据结构，但要注意兼容性。

十一、用switch 判断条件时

switch case 如果循环就是break 如果是判断就是return false;

 // 如果循环   跳出用break
 switch(num){
     case 1: xxxx
         break;
     case 2:xxxx
         break;
     default:
          break;
 }
//是判断就用  return false;
switch(num){
     case 1: xxxx
         return false;
      case 2:xxxx  
        return false;
     default: 
         return false;
}