面试题 | 走进数组中方法的实现

430 阅读1分钟

一、实现数组的filter方法

  1. 注释 该函数接受 3 个参数:
  • 项目值(value)
  • 项目索引(index)
  • 数组本身(array)

filter() 方法创建一个包含通过测试的数组元素的新数组。

  1. 用法
let arry = [1,2,3,4,5].filter((value)=>{
    retuen value > 2;
})

在上面的例子中,回调函数不使用 indexarray 参数,因此可以省略它们

  1. 实现方法
Array.prototype.filter = function(fn) {
  let arr = [];
  for(let i = 0; i < this.length; i++) {
    fn(this[i]) && arr.push(this[i]);
  }
  return arr;
};

二、实现数组的every方法

  1. 注释 该函数接受 3 个参数:
  • 项目值(value)
  • 项目索引(index)
  • 数组本身(array) every() 方法检查所有数组值是否通过测试。
  1. 用法
let flag = [1,2,3,4,5].every((value) => {
  return value > 1;
});

console.log(flag); // false
  1. 实现方法
Array.prototype.every = function(fn) {
  for(let i = 0; i < this.length; i++) {
    if(!fn(this[i])) {
      return false
    }
  }
  return true;
};

三、实现数组的map方法

  1. 注释 该函数接受 3 个参数:
  • 项目值(value)
  • 项目索引(index)
  • 数组本身(array)

map() 方法通过对每个数组元素执行函数来创建新数组。

map()方法不会对没有值的数组元素执行函数。

map() 方法不会更改原始数组。

  1. 用法
let array =[1,2,3,4,5].map((value) => {
  return value * 2;
});

console.log(array);  // [2,4,6,8,10]
  1. 实现方法
Array.prototype.map = function(fn) {
  let arr = [];
  for(let i = 0; i < this.length; i++) {
    arr.push(fn(this[i], i, this));
  }
  return arr;
};

四、实现数组的some方法

  1. 注释 该函数接受 3 个参数:
  • 项目值(value)
  • 项目索引(index)
  • 数组本身(array) some() 方法检查某些数组值是否通过了测试。
  1. 用法
let flag = [1,2,3,4,5].some((value) => {
  return value > 1;
});

console.log(flag); // true
  1. 实现方法
Array.prototype.some = function(fn) {
  for(let i = 0; i < this.length; i++) {
    if (fn(this[i])) {
      return true;
    }
  }
  return false;
};

五、实现数组的find方法

  1. 注释 该函数接受 3 个参数:
  • 项目值(value)
  • 项目索引(index)
  • 数组本身(array) find() 方法返回通过测试函数的第一个数组元素的值。
  1. 用法
let item = [1,2,3,4,5].find((value) => {
  return value > 1;
});

console.log(value); // 2
  1. 实现
Array.prototype.find = function(fn) {
  for(let i = 0; i < this.length; i++) {
    if (fn(this[i])) return this[i];
  }
};

六、实现数组的forEach方法

  1. 注释 该函数接受 3 个参数:
  • 项目值(value)
  • 项目索引(index)
  • 数组本身(array) forEach() 方法为每个数组元素调用一次函数(回调函数)
  1. 用法
[1,2,3,4,5].forEach((value, index, array) => {
  console.log(value, index, array)  
});
  1. 实现方法
Array.prototype.forEach = function(fn) {
  for(let i = 0; i < this.length; i++) {
    fn(this[i], i, this);
  }
};

七、实现数组的reduce方法

  1. 注释 函数接受 4 个参数:
  • 总数(初始值/先前返回的值)(total)
  • 项目值(value)
  • 项目索引(index)
  • 数组本身(array) reduce() 方法在每个数组元素上运行函数,以生成(减少它)单个值。

reduce() 方法在数组中从左到右工作。另请参见 reduceRight()。

reduce() 方法不会减少原始数组。

  1. 用法
let total =[1,2,3,4,5].reduce((prev, next, currentIndex, array) => {
  return prev + next;
}, 0);

console.log(total); // 15
  1. 实现方法
Array.prototype.reduce = function(fn, prev) {
  for(let i = 0; i < this.length; i++) {
    // 初始值不传时的处理
    if (typeof prev === 'undefined') {
      // 明确回调函数的参数都有哪些
      prev = fn(this[i], this[i+1], i+1, this);
      ++i;
    } else {
      prev = fn(prev, this[i], i, this)
    }
  }
  // 函数的返回结果会作为下一次循环的 prev
  return prev;
};