高阶函数

Posted on | In

高阶函数

高阶函数可以把函数作为参数传递给另一个函数，可以把函数作为另一个函数的返回结果。

函数作为参数

1
2
3
4
5
6
7
8
9
10
11
12
13
14
// 模拟forEach函数

function forEach (array, fn) {
  for(let i = 0; i < array.length; i++) {
    if (array[i]) {
      fn(array[i])
    }
  }
}

const arr = [1, 2, 3, 4, 5, 6]
forEach(arr, function (item) {
  console.log(item)
})
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
// 模拟filter函数

function filter (array, fn) {
  let results = []
  for(let i = 0; i < array.length; i++) {
    if (fn(array[i])) {
      results.push(array[i])
    }
  }
  return results
}

const arr1 = [1, 2, 3, 4, 5, 6]
const r = filter(arr1, function (item) {
  return item % 2 === 0
})
console.log(r)

函数作为参数，可以让函数更加灵活。调用函数方法，不需要考虑函数内部实现的细节。

函数作为返回值

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
function once (fn) {
  let done = false
  return function () {
    if (!done) {
      // 函数已经被执行
      done = true
      // 通过apply调用，当前this传入，当前arguments传递给fn
      fn.apply(this, arguments)
    }
  }
}

let pay = once(function (money) {
  console.log(money)
})
pay(10)
pay(10)
pay(10)

模拟常用的高阶函数

  • map
1
2
3
4
5
6
7
8
9
10
11
// 遍历数组中的每个值，返回新的数组
const map = (array, fn) => {
  let results = []
  for (let value of array) {
    results.push(fn(value))
  }
  return results
}
let arr = [1, 2, 3, 4]
arr = map(arr, v => v*v)
console.log(arr)
  • every
1
2
3
4
5
6
7
8
9
10
11
12
13
// 遍历数组中的每个值, 所有值的判断条件为true,则返回true
const every = (array, fn) => {
  let result = true
  for (let value of array) {
    result = fn(value)
    if (!result) break
  }
  return result
}

let arr = [1, 2, 3, 4]
let r = every(arr, v => v > 2)
console.log(r)
  • some
1
2
3
4
5
6
7
8
9
10
11
12
13
// 遍历数组中的每个值, 所有值的判断条件其中有一个为true,则返回true
const some = (array, fn) => {
  let result = false
  for (let value of array) {
    result = fn(value)
    if (result) break
  }
  return result
}

let arr = [1, 2, 3, 4]
let r = some(arr, v => v > 2)
console.log(r)

高阶函数意义

  1. 抽象可以帮我们屏蔽细节，只关注与我们的目标。
  2. 高阶函数是用来抽象通用的问题。
  3. 使代码更简洁