js中遍历数组的api

前言:在开发遍历数组是经常做的事情,用for i 这种方法不仅又长而且逼格不高

const arr=[1,2,3];

/*
 forEach(function(v,k,arr){})
 forEach:用于遍历数组,他的参数是个function,function中又3个参数,第一个是循环的单个元素,第二个
是循环单个元素的下标,第三个是原数组,forEach是不会改变原数组的
*/
 
/** 结果是:
item: 1 ,index: 0 ,arr: (3) [1, 2, 3]
item: 3 ,index: 1 ,arr: (3) [1, 2, 3]
item: 3 ,index: 2 ,arr: (3) [1, 2, 3]
*/

arr.forEach((v,k,arr)=>{
  console.log("item:",v,",index:",k,",arr:",arr);
});


/**
 map(function(v,k,arr){})
 map的作用和参数跟forEach一样,map与forEach不同的是,它会生成一个新的数组,并不会改变原数组
*/

/** 结果是:
item: 1 ,index: 0 ,arr: (3) [1, 2, 3]
item: 3 ,index: 1 ,arr: (3) [1, 2, 3]
item: 3 ,index: 2 ,arr: (3) [1, 2, 3]
*/
arr.map((v,k,arr)=>{
  console.log("item:",v,",index:",k,",arr:",arr);
});

/**
  filter(function(v,k,arr){},thisValue)
  filter的作用是遍历数组并且可以根据条件过滤元素,它的参数跟forEach一样的,它返回一个新数组并
不会改变原数组,thisValue可选。对象作为该执行回调时使用，传递给函数，用作 "this" 的值。如果省略了 thisValue ,"this" 的值为 "undefined"
 */

/**
  结果是:[3]
*/
arr.filter((v,k,arr)=>{
// 过滤元素小于2 
return v>2
});


/**
 every(function(v,k,arr){});
 every用于数组元素进行逻辑判断,它返回布尔值,every(每个的意思)判断数组的每个元素是否条件,每个元素全部
满足则返回true,否则返回false
*/

const bool1=arr.every((v,k,arr)=>{
//判断每个元素是否大于0,全部大于返回true,否则返回false  
return v>0
});
//结果为:true
conosole.log(bool1);

const bool2=arr.every((v,k,arr)=>{
//判断每个元素是否小于1,全部大于返回true,否则返回false  
return v<2
});
//结果为:false
console.log(bool2);


/**
some(function(v,k,arr){}) 
some用于数组元素进行逻辑判断,它的作用跟返回值都跟every方法一样,some判断数组中每个元素是否满足条件,
但some与every的区别是:some遍历的元素中只要有一项元素满足条件就返回true(every要求所有元素都满足条件才
返回ture),如果所有元素都不满足那当然是返回false了
*/
const bool3=arr.every((v,k,arr)=>{
//判断每个元素是否大于0,全部大于返回true,否则返回false  
return v>0
});
//结果为:true
conosole.log(bool3);

const bool4=arr.every((v,k,arr)=>{
//判断每个元素是否小于1,全部大于返回true,否则返回false  
return v<2
});
//结果为:true,毕竟还是有条件满足的嘛
console.log(bool4);

const bool5=arr.every((v,k,arr)=>{
//判断每个元素是否小于1,全部大于返回true,否则返回false  
return v<0
});
//结果为:false,所有元素都不满足
console.log(bool5);

/**
reduce(function(total,v,index,arr){})
reduce方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值,它可以做
一些数值的累加、累乘等等,	total参数是必需的,它是初始值或者计算结束后的返回值。
 */
const sum=arr.reduce((total,v,index,arr)=>{
return total+v
});
//累加结果是:6
console.log(sum);

const ride=arr.reduce((total,v,index,arr)=>{
return total*v
});
//累乘结果是:6
console.log(ride);

/**
 for in 遍历
*/
const arrObj=[
     {name:"z",age:12},
     {name:"w",age:10}
]
//直接遍历数组的话,普通数组只能遍历值,遍历出来元素类型是string,如果是对象数组的话遍历出来的是下标,
//类型还是string

//结果: 0 1
for(let s in arrObj){
  console.log(s);
}

//遍历下标
for(let k in [1,2,3].keys()){
        //结果是:0,1,2
        console.log(k);
}
 //遍历元素值
 for(let v in [1,2,3].values()){
        //结果是1,2,3  
	  console.log(v)
 }



/**

  for of 遍历:可以遍历数据中途使用break、return、continue,而且可以遍历map、set这个数据结构
 */
 for(let k of [1,2,3].keys()){
 //0,1,2
console.log(k);
}

for (let v of [1,2,3].values()){
  //1,2,3
  console.log(v);
}

for (let [k,v] of arrObj.entries()){
     //0,{name:"z",age:12}
     //1,{name:"w",age:10}
     console.log(k,v);
}