美文网首页
javaScript 数组操作

javaScript 数组操作

作者: BitterOutsider | 来源:发表于2020-02-19 15:25 被阅读0次

概要

  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
}, [])

相关文章

  • javascript数组操作

    javascript数组操作 今天针对javascript的数组的一些常见操作进行一些讲解,希望对给为开发者有帮助...

  • JavaScript数组去重

    JavaScript中数组的常用操作之数组去重 方法一 方法二

  • JavaScript中数组操作常用方法

    1.检JavaScript中数组操作常用方法测数组 1)检测对象是否为数组,使用instanceof 操作符 2)...

  • JavaScript数组操作

    定义一个空数组:var arr = [];在数组中添加元素:arr = ['苹果','香蕉','梨','橘子','...

  • Javascript数组操作

    使用JS也算有段时日,然对于数组的使用,总局限于很初级水平,且每每使用总要查下API,或者写个小Demo测试下才算...

  • javaScript 数组操作

    概要 实现一些常用的数组操作函数。 join 用法:[1, 2, 3].join('-') // "1-2-3"实...

  • vue 中数组和json的响应式

    一. vue 中数组操作的响应式 1. Vue 中javaScript 数组响应式操作的方法 push()方法响应...

  • JavaScript查找数组

    JavaScript中数组的常用操作之查找数组 Array.includes() 方法 array.include...

  • JavaScript数组的遍历

    JavaScript中数组的常用操作之数组的遍历 for..of 循环 for(const item of ite...

  • 浅谈JS清空数组的4种方法(转载)

    数组是JavaScript中的十分常用且重要的数据类型,而删除数组元素是一种常见的数组操作,JavaScript中...

网友评论

      本文标题:javaScript 数组操作

      本文链接:https://www.haomeiwen.com/subject/dzjnfhtx.html