JavaScript数组方法-高阶函数

数组方法-高阶函数

高阶函数是对其他函数进行操作的函数,可以将它们作为参数或通过返回它们.

高阶函数是一个函数,它接收函数作为参数或者将函数作为输出返回

1. forEach 方法 循环

• 用法: 遍历数组,可以对每个值做一些操作

• 参数用法:

  1. 参数1:必需;当前的元素(类似于,for 循环中的 i)
  2. 参数2:可选;当前遍历元素的索引值
  3. 参数3:可选;当前元素所属的数组对象

• var arr = ['a','b','c','d']
  //普通写法
  arr.forEach(function(ele,i,array){
      console.log(ele); //当前的元素
      console.log(i); //当前的元素的索引值
      console.log(array); //当前的元素的数组对象
  })
  //箭头函数
  arr.forEach((ele,i,array)=>{
      console.log(ele); //当前的元素
      console.log(i); //当前的元素的索引值
      console.log(array); //当前的元素的数组对象
  })
  

2. map 方法 执行操作

• 用法:对数组中的每一个元素运行指定函数,返回每次调用函数的结果,将其组成一个新数组

• 特点:不改变元数组,返回一个新数组

• 注意:

  1. map 不会对空数组进行检测
  2. map 不会改变原数组

• 参数用法:

  1. 参数1:必需;当前的元素(类似于,for 循环中的 i)
  2. 参数2:可选;当前遍历元素的索引值
  3. 参数3:可选;当前元素所属的数组对象

• var arr = ['1','2','3','4']
  var fresh =  arr.map((ele,i,array)=>{
    	return ele*2  //对每个元素乘2
  })
  

3. filter 方法 过滤

• 用法:对数组中的元素进行过滤筛选,将满足条件的元素组成新数组返回

• 特点:将满足条件的元素返回新数组

• 参数用法:

  1. 参数1:必需;当前的元素(类似于,for 循环中的 i)
  2. 参数2:可选;当前遍历元素的索引值
  3. 参数3:可选;当前元素所属的数组对象

• //写法一
  var arr = ['张三','李四','王五','张三丰','王小六'];
  var fresh = arr.filter((ele,i,array)=>{
      return /^王/.test(ele) //筛选出所有姓王的名字
  }) 
  //写法二
  var ages = [32,33,55,16,8,40];
  function fn(age){
      return age >= 18
  }
  var greater = ages.filter(fn)
  

4. some 方法 判断返回布尔值

• 用法: 查找数组中是否有满足指定条件的元素,然后返回布尔值

• 参数用法:
  1. 参数1:必需;当前的元素(类似于,for 循环中的 i)
  2. 参数2:可选;当前遍历元素的索引值
  3. 参数3:可选;当前元素所属的数组对象

• //数据复杂时,使用比较好
  var isHas = arr.some((ele)=>{
      return ele.属性 > 10
  })
  

5.every 方法 判断返回布尔值

• 查找数组内的所有元素是否都通过了条件判断，返回布尔值
• 参数用法:
  1. 参数1:必需;当前的元素(类似于,for 循环中的 i)
  2. 参数2:可选;当前遍历元素的索引值
  3. 参数3:可选;当前元素所属的数组对象

const numbers = [2, 4, 6, 8];

// 检查数组中的所有数字是否都是偶数
const allEven = numbers.every(num => num % 2 === 0);
console.log(allEven); // 输出: true

// 如果数组中有奇数
const mixedNumbers = [2, 4, 5, 8];
const notAllEven = mixedNumbers.every(num => num % 2 === 0);
console.log(notAllEven); // 输出: false

6. find 方法 查找元素,

• 用法:查找满足添加的第一个元素,返回该元素

• 注意:找到第一个满足的条件时,就不会在继续查找其他元素

• 参数用法:

  1. 参数1:必需;当前的元素(类似于,for 循环中的 i)
  2. 参数2:可选;当前遍历元素的索引值
  3. 参数3:可选;当前元素所属的数组对象

•  var arr = [55,10,3,6,88,22]
   var item = arr.find((ele,i,array)=>{
       return ele > 11
   })
  

7. findIndex 方法 查找返回索引

• 用法:查找满足条件的第一个索引,返回该元素的索引

• 注意:找到第一个满足的条件时,就不会在继续查找其他元素

• 参数用法:

  1. 参数1:必需;当前的元素(类似于,for 循环中的 i)
  2. 参数2:可选;当前遍历元素的索引值
  3. 参数3:可选;当前元素所属的数组对象

•  var arr = [55,10,3,6,88,22]
   var item = arr.findIndex((ele,i,array)=>{
       return ele > 11
   })
  

8.reduce 方法

• reduce() 方法对数组中的每个元素执行一个由您提供的 reducer 函数（升序执行），将其结果汇总为单个返回值。reduce 可以接受一个初始值，如果没有提供初始值，那么第一次迭代将使用数组的第一个元素作为初始值，并从第二个元素开始迭代。
• 参数用法:
  1. 参数1:可选;初始值
  2. 参数2:必需;当前的元素(类似于,for 循环中的 i)
  3. 参数3:可选;当前遍历元素的索引值
  4. 参数4:可选;当前元素所属的数组对象

const numbers = [1, 2, 3, 4];

// 计算数组中所有数字的和
const sum = numbers.reduce((acc, curr) => acc + curr, 0);
console.log(sum); // 输出: 10

// 计算数组中所有数字的乘积
const product = numbers.reduce((acc, curr) => acc * curr, 1);
console.log(product); // 输出: 24

// 使用 reduce 来扁平化数组
const flatArray = [[1, 2], [3, 4], [5, 6]].reduce((acc, curr) => acc.concat(curr), []);
console.log(flatArray); // 输出: [1, 2, 3, 4, 5, 6]

9. from 方法 数组转换

• 用法:把类数组转换为真正的浅拷贝数组,返回转换后的新数组

• 参数:

  1. 参数1: 要转换的数据(类数组)
  2. 参数2:回调函数,用来对每个元素进行操作,将处理好的值放入新的数组中

•  var arr = Array.from('123456',(ele)=>{
       return ele*2
   })
   console.log(arr)