vue中常用的十种迭代数组方法

1.arr.map(回调函数)

方法名:映射数组
回调函数的执行次数===arr.length
回调函数的返回值:回调函数的返回值是每次映射之后的元素.如果没有return返回的是undefined
map方法的返回值:映射之后的新数组

let arr=[1,2,3,4,5,6]
let newArr=arr.map( item => item*2 )
console.log(newArr) //[2,4,6,8,10,12]

2.arr.filter(回调函数)

let arr=[1,2,3,4,5,6]
let newArr=arr.filter( item => item>3 )
console.log(newArr) //[4,5,6]

方法名:筛选数组
回调函数的执行次数===arr.length
回调函数的返回值:(1). return true 说明当前元素满足筛选条件,把当前元素放入newArr中
(2). retuen false 说明当前元素不满足筛选条件,不会把当前元素放入newArr中
fliter方法的返回值:筛选后的新数组

3.arr.forEach(回调函数)

let arr=[1,2,3,4,5,6]
arr.foreach(item => console.log(item)) //打印1,2,3,4,5,6.总共打印六次

方法名:遍历数组,类似于for循环
回调函数的执行次数===arr.length
回调函数的返回值:无
forEach方法的返回值:无

4.arr.some(回调函数)

let arr=[1,2,3,4,5.6]
let bool=arr.some(item => item>5) 
console.log(bool)  //true

方法名:判断数组中是否有符合条件的元素
回调函数的执行次数 != arr.length(大多数情况下小于数组的长度)
回调函数的返回值:
(1): return true 结束循环已经找到了满足条件的元素
(2): return false 循环继续还没有找到符合条件的元素
forEach方法的返回值:(1).true 有满足条件的元素
(2).false 没有符合条件的元

5.arr.every(回调函数)

let arr=[1,2,3,4,5,6]
let bool=arr.every(item => item>5) 
console.log(bool)  //false

方法名:判断数组中是否所有的元素都符合条件
回调函数的执行次数 != arr.length(大多数情况下小于数组的长度)
回调函数的返回值:(1): return true 结束继续,说明当前元素符合条件
(2): return false 循环结束,说明找到了不符合条件的元素
forEach方法的返回值:(1).!true 所有的元素都符合条件
(2).false 有一个不符合条件的元素

6.arr.findIndex(回调函数)

let arr=[1,2,3,4,5,6]
let index=arr.findIndex(item => item==3) 
console.log(index)  //2

方法名:查找元素下标
回调函数的执行次数 != arr.length(大多数情况下小于数组的长度)
回调函数的返回值:(1): return true 循环结束,说明当前元素符合查找条件
(2): return false 循环继续,说明当前元素不符合查找条件
forEach方法的返回值:(1).下标 arr[下标]是符合查找条件的第一个元素
(2). -1 没有一个符合条件的元素

7.arr.find(回调函数)

let arr=[1,2,3,4,5,6]
let ele=arr.findIndex(item => item==3) 
console.log(ele)  // 3 打印的是元素本身不是下标

方法名:查找元素
回调函数的执行次数 != arr.length(大多数情况下小于数组的长度)
回调函数的返回值:(1): return true 循环结束,说明当前元素符合查找条件
(2): return false 循环继续,说明当前元素不符合查找条件
arr.find方法的返回值:(1).元素 符合查找条件的第一个元素
(2). undefined 说明没有一个符合条件的元素

8.arr.reduce(回调函数,初始值)

let arr=[1,2,3,4,5,6]
let result=arr.reduce((sum,item) => {
 return sum+=item
},0) //初始值一般给0
console.log(result)  // 21 

方法名:数组累加器方法
参数有两个:第一个参数是回调函数 : ( 上一次值,当前值,下标 ) => { }第二参数是计算的初始值,一般为0.
回调函数的返回值:回调函数中返回的值会赋值给下一次的"上一次值"
arr.reduce方法的返回值:最后一次的 “上一次值”

9.arr.includes(‘要检测的值’)

let arr=[1,2,3,4,5,6]
let result=arr.includes(7) 
console.log(result)  // false 

方法名:检测数组中是否存在某个值
arr.reduce方法的返回值:
true 数组中存在这个值
false: 数组中不存在这个值

10.arr.indexOf(‘要检测的值’)

let arr=[1,2,3,4,5,6]
let result=arr.index0f(6) 
console.log(result)  // 5

方法名:检测数组中是否存在某个值
arr.reduce方法的返回值:
下标 : 值所在数组中元素的下标
-1 : 值在数组中不存在