javaScript 数组操作

2020-02-19  本文已影响0人  BitterOutsider

概要

  1. 实现一些常用的数组操作函数。

join

用法:[1, 2, 3].join('-') // "1-2-3"
实现:

Array.prototype.join = function(char){
  let result = this[0] || ''
  for(let i=1; i<this.length; i++){
    result += char + this[i] 
  }
  return result
}

slice

用法:[1, 2, 3, 4].slice(1, 3) // [2, 3]
实现:

Array.prototype.slice = function(startIndex, endIndex){
  console.log(1)
  let result = [],
      start = startIndex || 0,
      end = endIndex || this.length
  for(let i=start; i<end; i++){
    result.push(this[i])
  }
  return result
}

sort

用法:[1,2,3].sort( (a,b)=>{a-b} )
实现:一般源代码使用的是堆排序或是快速排序,这里使用复杂度较大的选择排序

Array.prototype.sort = function(fn){
  let sortFn = fn || function(a,b){return a-b}
  for(let i=0; i<this.length-1; i++){
    for(let j=i+1; j<this.length; j++){
      if( sortFn.call(undefined, this[i], this[j]) < 0 ){
        [this[i], this[j]] = [this[j], this[i]]
      }
    }
  }
}

forEach

用法: 根据函数对每一项做相应操作。
实现:

Array.prototype.forEach = function(fn){
  for(let i=0; i<this.length; i++){
    if(i in this){
      fn.call(undefined, this[i], i, this)
    }
  }
}

forEach 与 for 的区别:

  1. forEach 不能 break。
  2. forEach 用到了函数,所以每次迭代都会有一个新的函数作用域;而 for 循环只有一个作用域。

map

用法: 根据函数对每一项做相应操作,并返回一个新的数组。
实现:

Array.prototype.forEach = function(fn){
  let result = []
  for(let i=0; i<this.length; i++){
    if(i in this){
      result[i] = fn.call(undefined, this[i], i, this)
    }
  }
  return result
}

map 与 forEach 的区别:

  1. map 有返回值,所有 forEach 都可以用 map 来代替。

filter

用法:返回符合传入函数返回值的项
实现:

Array.prototype.forEach = function(fn){
  let result = [],
      temp
  for(let i=0; i<this.length; i++){
    if(i in this){
      if(temp = fn.call(undefined, this[i], i, this)){
        result.push(this[i])
      }
    }
  }
  return result
}

reduce

用法:将每一项通过函数作用与后一项,返回一个结果
实现:

Array.prototype.reduce = function(fn,init){
  let result = init
  for(let i=0; i<this.length; i++){
    if(i in this){
      result = fn.call(undefined, result, this[i], i, this)
    }
  }
  return result
}

map filter reduce 之间的联系

  1. 用 reduce 表示 map
array2 = array.map( value => value + 1 )
可以写作
array2 = array.reduce((result, value)=>{
  result.push(value + 1)
  return result
}, [])
  1. 用 reduce 表示 filter
array2 = array.filter( value => value % 2 === 0 )
可以写作
array2 = array.reduce((result, value)=>{
  if( value % 2 === 0 ){
    result.push(value)
  }
  return result
}, [])
上一篇下一篇

猜你喜欢

热点阅读