【前端技术】es6常用数组方法

• • find方法
  • findIndex方法
  • filter方法
  • map方法
  • every方法
  • some方法
  • forEach方法

数组方法中常用箭头函数，使用时注意箭头函数中this是否与全局的一致

有返回值：

• 数组：filter，map
• 其他类型：find（具体值），findIndex（索引），every / some（true/ false ）

无返回值：forEach

按照列表顺序查找第一个满足条件的数据，找到后直接返回。

通用写法，回调函数有三个参数（当前元素，当前元素索引，被查找的数组）,查找是可以按照元素或者元素索引来判断，同样返回第一个匹配的元素。加上大括号之后必须使用return将结果返回出来。

let userList = [6,2,4,5,6,7,8,9]
let num = userList.find((value,index,arr)=>{
   return index > 5
 })
 console.log(num) // 8

示例为查找大于2的第一个数，没有找到时返回undefined

let userList = [1,2,3,4,5,6,7,8,9]
let num = userList.find(value=>value >2)
console.log(num) // 3

与find方法相同，只不过返回的是列表的索引，当没有找到时返回 -1 ，回调函数也是三个参数。

let userList = [1,2,4,5,6,7,8,9]
let num = userList.findIndex(value=>
    value > 5
)
console.log(num) // 4

与find使用方法相同，接收三个参数，不同地方是返回数组，数组内是满足条件的元素，原数组不受影响。函数加上大括号之后就需要使用return返回，当不满足条件时，返回的是空数组[]

let userList = [1,2,4,5,6,7,8,9]
let resList = userList.filter(value=>
   value > 5
)
console.log(resList) // [6, 7, 8, 9]

遍历数组中每一个元素，通过制定的方法进行处理，并返回处理后的数组。

let userList = [1, 2, 4, 5, 6, 7, 8, 9];
let resList = userList.map((value) => {
  if (value > 5) {
    return value;
  } else {
    return '';
  }
});
console.log(resList); // ['', '', '', '', 6, 7, 8, 9]

检测数组中所有元素是否都符合条件，是则返回true，否则返回false。

let userList = [1, 2, 4, 5, 6, 7, 8, 9];
let res = userList.every((value) => {
  return value >5  // 当5改成0 时，返回结果为true
});
console.log(res); // false

检测数组中是否存在符合条件的元素，是则返回true，否则返回false。

let userList = [1, 2, 4, 5, 6, 7, 8, 9];
let res = userList.some((value) => {
  return value >5  // 当5 改成 10 时，返回结果为false
});
console.log(res); // true

循环遍历数组的元素，相当于for循环，无返回值

let userList = [1, 2, 4, 5, 6, 7, 8, 9];
let res = userList.forEach((value) => {
  console.log(value) // 循环打印 1 2 3 4 5 6 7 8 9
});
console.log(res); // undefined