手写实现数组方法之 map、reduce、filter、find、findInex、every 和 some

一、map 方法

1. map 方法，返回一个由回调函数的返回值组成的新数组。
2. map 的实现，代码如下所示：

export function map(arr, callback) {
  // 声明一个空的数组
  let result = [];
  // 遍历数组
  for(let i=0;i<arr.length;i++) {
    // 执行回调
    result.push(callback(arr[i], i));
  }
  // 返回结果
  return result;
}

3. 手写函数 map 的应用，代码如下所示：

// 声明一个数组
const arr = [1,2,3,4,5];

// map 方法
const result = map(arr, (item,index) => {
   console.log(index);
   return item * 10;
 });
console.log(result);

二、reduce 方法

1. reduce 方法，从左到右为每个数组元素执行一次回调函数，并把上次回调函数的返回值放在一个暂存器中，传给下次回调函数，并返回最后一次回调函数的返回值。
2. reduce 的实现，代码如下所示：

export function reduce(arr, callback, initValue) {
  // 声明变量
  let result = initValue;
  // 执行回调
  for(let i=0;i<arr.length;i++) {
    // 执行回调
    result = callback(result, arr[i]);
  }
  // 返回最终的结果
  return result;
}

3. 手写函数 reduce 的应用，代码如下所示：

 // 声明一个数组
 const arr = [1,2,3,4,5];

 // reduce 函数调用
  let result = arr.reduce(function(res, value){
    return res + value;
  }, 0);
  console.log(result);
  let result = reduce(arr, function(res, value){
    return res + value;
  }, 10);

三、filter 方法

1. filter 方法，将所有在过滤函数中返回 true 的数组元素放在一个新数组中并返回。
2. filter 的实现，代码如下所示：

export function filter(arr, callback) {
  // 声明空数组
  let result = [];
  // 遍历数组
  for(let i=0;i<arr.length;i++) {
    // 执行回调
    let res = callback(arr[i], i);
    // 判断 如果为真则压入到 result 结果中
    if (res) {
      result.push(arr[i]);
    }
  }
  // 返回结果
  return result;
}

3. 手写函数 filter 的应用，代码如下所示：

 // 声明一个数组
 const arr = [1,2,3,4,5];

//filter 函数调用
const result = arr.filter(item => item % 2 === 1);
const result = filter(arr, item => item % 2 === 0);
console.log(result);

四、find 方法

1. find 方法，找到第一个满足测试函数的元素并返回那个元素的值，如果找不到，则返回 undefined。
2. find 的实现，代码如下所示：

export function find(arr, callback) {
  // 遍历数组
  for(let i=0;i<arr.length;i++) {
    // 执行回调
    let res = callback(arr[i], i);
    // 判断
    if (res) {
      // 返回当前正在遍历的元素
      return arr[i];
    }
  }
  // 如果没有遇到满足条件的 返回 undefined
  return undefined;
}

3. 手写函数 find 的应用，代码如下所示：

 // 声明一个数组
 const arr = [1,2,3,4,5,1000,1200];
 
// find 函数调用
const result = arr.find(item => {
  return item > 1000;
});
const result = find(arr, (item,index) => {
  return item > 1000;
});
console.log(result);

五、findIndex 方法

1. findIndex 方法，找到第一个满足测试函数的元素并返回那个元素的索引，如果找不到，则返回 -1。
2. findIndex 的实现，代码如下所示：

export function findIndex(arr, callback) {
  // 遍历数组
  for(let i=0;i<arr.length;i++) {
    // 执行回调
    let res = callback(arr[i], i);
    // 判断
    if (res) {
      // 返回当前正在遍历的元素索引
      return i;
    }
  }
  // 如果没有遇到满足条件的 返回 -1
  return -1;
}

3. 手写函数 findIndex 的应用，代码如下所示：

// findIndex 函数调用
const arr2 = [1,2,3,4,5,6,10,23,8,1200];
const result = arr2.findIndex(item => {
  return item > 1000;
});
const result = findIndex(arr2, (item,index) => {
  return item > 1000;
});
console.log(result);

六、every 方法

1. every 方法，如果数组中的每个元素都满足测试函数，则返回 true，否则返回 false。
2. every 的实现，代码如下所示：

export function every(arr, callback) {
  // 遍历数组
  for(let i=0;i<arr.length;i++) {
    // 执行回调 如果回调执行返回结果为 false
    if (!callback(arr[i], i)) {
      return false;
    }
  }
  // 如果都满足条件则返回 true
  return true;
}

3. 手写函数 every 的应用，代码如下所示：

 // every 函数调用
const arr3 = [1,2,3,4,5,100,43,89];
const result = arr3.every(item => {
  return item > 10;
});

const result = every(arr3, (item, index) => {
  return item > 10;
});

console.log(result);

七、some 方法

1. some 方法，如果数组中至少有一个元素满足测试函数，则返回 true，否则返回 false。
2. some 的实现，代码如下所示：

export function some(arr, callback) {
  // 遍历数组
  for(let i=0;i<arr.length;i++) {
    // 执行回调 如果回调执行返回结果为 true
    if (callback(arr[i], i)) {
      return true;
    }
  }
  //如果都满足条件则返回 false
  return false;
}

3. 手写函数 some 的应用，代码如下所示：

// some 函数调用
const arr3 = [1,2,3,4,5,100,43,89];
const result = arr3.some(item => {
  return item > 50;
});

const result = some(arr3, (item, index) => {
  return item > 50;
});

console.log(result);