Array

81 阅读1分钟

常用实例方法

Array.prototype.slice(begin,end)

当没有数组实例时,就需要从原型上拿方法使用。 该方法返回一个新的数组对象,该对象是由 beginend 决定的原数组的浅拷贝(包含 begin 不包含 end)原始数组不会被改变。 slice()方法可以用来将一个类数组对象/集合转换成一个新的数组。ES6可以使用 Array.from() 或扩展运算符实现相同功能。

Array.prototype.slice.call(arguments)

注意 slice 内部会遍历 this ( 数组或类数组对象 ),Array.prototype.slice() 执行时 this 指向的是 Array.prototype, 需要通过 callslicethis 由绑定 Array.prototype 转而绑定到 arguments (可迭代对象)上,从而实现类数组对象转数组操作。

自己实现 slice()

Array.prototype.cusSlice = function (start, end) {
  var arr = this // this是Array实例
  start = start || 0
  end = end || arr.length
  var newArr = []
  for (var i = start; i < end; i++) {
    newArr.push(arr[i])
  }
  return newArr
}

var a = Array.prototype.cusSlice.call([1, 2, 3, 4, 5, 6, 7],2,5)
console.log(a) // [3,4,5]

Array.prototype.reduce()

arr.reduce(
  callback(accumulator,currentValue[, index[, sourceArray]])[,initialValue]
)

// accumulator 累计器
// currentValue 当前值
// currentIndex 当前索引
// sourceArray 源数组
// initialValue 默认值

回调函数第一次执行时,accumulatorcurrentValue 的取值有两种情况:

  1. 如果提供了 initialValueaccumulator 取值为 initialValuecurrentValue 取数组中的第一个值;
  2. 如果没有提供 initialValueaccumulator 取值为数组中的第一个值,currentValue 取数组中的第二个值。

reduce() 应用案例

统计符合条件的数组元素的个数

let arr = [-1,-2,1,2,3]
// callback
function counter(acc,cur) {
  if(cur > 0) {
    cur = 1
  } else {
    cur = 0
  }
  return acc+=cur
}

let result = arr.reduce(counter,0)
result // 3

计算数组元素累加总和

// 设置默认值为0,acc取initialValue
console.log([1,2,3,4].reduce((acc, cur) => acc + cur,0)); // 10
// 不设置默认值,acc取数组第一个:1
console.log([1,2,3,4].reduce((acc, cur) => acc + cur)); // 10
// 设置默认值为5,acc取值5,在5基础上加 5+1+2+3+4=15
console.log([1,2,3,4].reduce((acc, cur) => acc + cur,5)); // 15

计算数组对象元素属性累加总和

//计算书的总价
books:[
  {id:'01',bookName:'JavaScript高级程序指南',price:119},
  {id:'02',bookName:'你不了解的JS',price:100},
  {id:'03',bookName:'JavaScript DOM编程艺术',price:85},
  {id:'04',bookName:'CSS世界',price:75}
]

let result = 0;
this.books.reduce((acc,cur)=>{
  result += cur.price
},0)
return result;