JavaScript手写函数-第二篇

129 阅读2分钟

数组的高阶函数

在当前很火的函数式编程中,操作数组也有了很多函数式方法,以下就是手写这些高阶函数

forEach 函数

循环遍历数组

const arr = [1, 2, 5, 6, 8, 10];
function foreEach (arr, fn) {
  for (let i = 0;i < arr.length;i++) {
    fn(arr[i]);
  }
}
foreEach(arr, item => {
  console.log(`输出的是${item}`);
})

filter 函数

根据条件过滤数组中的元素,返回新数组,函数中返回 true 则返回元素,为 false 则过滤数组

const arr = [1, 2, 5, 6, 8, 10];
function filter (array, fn) {
  let result = [];
  for (let i = 0;i < array.length;i++) {
    if (fn(array[i], i, array)) {
      result.push(array[i]);
    }
  }
  return result;
}
const nArr = filter(arr, (item, index, data) => {
  return item % 2 === 0;
})
console.log(nArr);

map 函数

操作数组中的元素,返回新数组,返回的长度跟原数组相同

const arr = [1, 2, 5, 6, 8, 10];
const map = (array, fn) => {
  let result = [];
  for (let value of array) result.push(fn(value));
  return result;
}
const nArr = map(arr, item => {
  return item * item;
})
console.log(nArr)

every 函数

检测数组所有元素是否都符合指定条件

  • 如果有一个不符合条件则返回 false,并且不再向下遍历
  • 全部符合条件则返回 true
const arr = [1, 2, 5, 6, 8, 10];
const every = (array, fn) => {
  let result = true;
  for (let value of array) {
    result = fn(value);
    if (!result) {
      break
    }
  }
  return result;
}
const nArr = every(arr, item => {
  return item > 0;
})
console.log(nArr)

some 函数

与 every 相反,检测数组所有元素是否都符合指定条件

  • 只要有一个符合条件则返回 true,并且不再向下遍历
  • 全部不符合条件则返回 false
const arr = [1, 2, 5, 6, 8, 10];
const some = (array, fn) => {
  let result = false;
  for (let value of array) {
    result = fn(value);
    if (result) {
      break;
    }
  }
  return result;
}
const nArr = some(arr, item => {
  return item < 0;
})
console.log(nArr)

find 函数

遍历数组,返回第一个满足条件的值

const arr = [1, 2, 5, 6, 8, 10];
const find = (array, fn) => {
  let result = undefined;
  for (let value of array) {
    if (fn(value)) {
      result = fn(value);
      break;
    }
  }
  return result;
}
const nArr = find(arr, item => {
  if (item > 30) {
    return item;
  }
})
console.log(nArr)

reduce 函数

函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值

const arr = [1, 2, 5, 6, 8, 10];
const reduce = (array, fn, val = 0) => {
let vSum = val;
for (let i = 0; i < array.length; i++) {
  vSum = fn(vSum, array[i]);
}
return vSum;
}

const nArr = reduce(arr, (sum, item) => {
return sum * item;
}, 1)
console.log(nArr);