JavaScript 数组相关方法实现

144 阅读1分钟

map 每一项都执行运算法则

Array.prototype.myMap = function(fn){
  var arr = this;
  var res = [];
  for( var i = 0; i < arr.length; i++ ){
    res.push(fn(arr[i],i,arr));
  }
  return res;
}

var arr = [1,2,3];
console.log(arr.myMap(item=>item*3)); // (3) [3, 6, 9]

filter

Array.prototype.myFilter = function(fn){
  var arr = this;
  var res = [];
  for( var i = 0; i < arr.length; i++ ){
    if( fn(arr[i],i,arr) ){
      res.push(arr[i],i,arr);
    }
  }
  return res;
}
var arr = [1,2,3,4,5,6];
console.log(arr.myFilter(item=>item>3)); // (3) [4, 5, 6]

reduce

Array.prototype.myReduce = function(fn,initValue){
  var arr = this;
  var res = initValue ? initValue : arr[0];
  for( var i = initValue?1:0; i < arr.length; i++ ){
    res = fn(res,arr[i],i,arr);
  }
  return res;
}
var arr = [1,2,3];
console.log(arr.myReduce((a,b)=>a*b,2)); // 12
  • 循环中调用第一个参数的函数,第一个参数是上一次的结果,第二个参数是数组当前循环索引的元素

every 每一项都满足条件

Array.prototype.myEvery = function(fn){
  var arr = this;
  var res = true;
  for( var i = 0; i < arr.length; i++ ){
    if(!fn(arr[i],i,arr)){
      res = false;
      break;
    }
  }
  return res;
}
var arr = [1,2,3,4,5,6];
console.log(arr.myEvery(item=>item>3)); // false
console.log(arr.myEvery(item=>item>0)); // true

some 只要其中一项满足条件即可

Array.prototype.mySome = function(fn){
  var arr = this;
  var res = false;
  for( var i = 0; i < arr.length; i++ ){
    if(fn(arr[i],i,arr)){
      res = true;
      break;
    }
  }
  return res;
}
var arr = [1,2,3,4,5,6];
console.log(arr.mySome(item=>item>3)); // true
console.log(arr.mySome(item=>item>6)); // false

find 找到第一个符合条件的数组元素

Array.prototype.myFind = function(fn){
  var arr = this;
  var res;
  for( var i = 0; i < arr.length; i++ ){
    if(fn(arr[i],i,arr)){
      res = arr[i];
      break;
    }
  }
  return res;
}
var arr = [1,2,3,4,5,6];
console.log(arr.myFind(item=>item>3)); // 4
console.log(arr.myFind(item=>item>6)); // undefined

findIndex 找到第一个符合条件的数组元素索引

Array.prototype.myFindIndex = function(fn){
  var arr = this;
  var res;
  for( var i = 0; i < arr.length; i++ ){
    if(fn(arr[i],i,arr)){
      res = i;
      break;
    }
  }
  return res;
}
var arr = [1,2,3,4,5,6];
console.log(arr.myFindIndex(item=>item>3)); // 3
console.log(arr.myFindIndex(item=>item>6)); // undefined

includes 数组是否包含某个值

Array.prototype.myIncludes = function(item){
  var arr = this;
  var res = false;
  for( var i = 0; i < arr.length; i++ ){
    if( arr[i] == item ){
      res = true;
      break;
    }
  }
  return res;
}
var arr = [1,2,3];
console.log(arr.myIncludes(3)); // true
console.log(arr.myIncludes(6)); // false

flat 数组扁平化

Array.prototype.myFlat = function(){
  var res = arguments[0] || [];
  var arr = this;
  for( var i = 0; i < arr.length; i++ ){
    if(Array.isArray(arr[i])){
      arr[i].myFlat(res);
    }else{
      res.push(arr[i]);
    }
  }
  return res;
}
var arr = [1,2,3,[4,[5,[6]]],7,8,[9],10];
console.log(arr.myFlat()); // (7) [1, 2, 3, 4, 5, 6, 7, 8,9 ,10 ]
  • 重点在于遍历外层数组时判断某个元素本身是不是数组,如果是数组就递归调用自身,并把结果数组当参数传入。