MyObject.prototype.reduce 回调无法访问数组方法

array method(s) inaccessible with MyObject.prototype.reduce callback

因此,我正在尝试一些原型制作,并已成功在原型上实现 forEach 以处理其对象数组。箭头函数回调工作正常,我认为同样的事情可能适用于 .reduce(),但是,如您所见,适用于普通数组的符号不适用于我的 ArraySet 原型。附带说明一下,箭头符号中的相同功能不起作用。

我对这里发生的事情的理解缺少什么,以便我可以解决这个问题并继续前进?

function ArraySet(items) {
  // this._items = []
  this._items = items
}

ArraySet.prototype.forEach = function forEach(cb) {
   return this._items.forEach(cb);
}
  
ArraySet.prototype.reduce = function reduce(cb) {
  return this._items.reduce(cb);
}

let arr = new ArraySet([{
    key1: 'property2',
    key3: 'propertyx'
  },
  {
    key1: 'property4',
    key3: 'propertyy'
  },
  {
    key1: 'climate change',
    key3: 'propertyx'
  },
  {
    key1: 'climate change',
    key3: 'propertyx'
  },
])

arr.forEach(el => {
    console.log(el)
});

x = arr.reduce(function (map, obj) {
    if (obj.key3 === 'propertyx'){
        map.push(obj.key1)
    }
    return map
}, []) //<-- final argument is the instantiating literal of the reigning map type: [], {}, ''

编辑: 多亏了 Maheer Ali 的回答详细说明了传播运算符 (...) 的使用,问题很容易解决。 Maheer 出色地扩展了适用于相同方法的其他功能。

深入探究原因,我在扩展运算符出现之前了解到。apply() 通常用于函数调用,以确保所有必需的参数在执行中可用。扩展运算符已经从适用性发展到数组(如参数列表),因为它被引入也包括对象。它还可以复制数组,替换 arr.splice().

这里是对 MDN 上的一个示例的改编:

function myFunction(v, w, x, y, ...z) {
  console.log(v + ' ' + w + ' ' + x + ' ' + y + ' ' + z)
}
var args = [0, 1];
myFunction(-1, ...args, 2, ...[3, 8]);

更多内容可参考 material:Spread Syntax

reduce()有两个参数,一个是回调函数,另一个是累加器的初始值。所以你需要为方法使用剩余参数,然后将所有参数传递给 reduce()

注意:reduce() 中你通常传递第二个参数。在forEach()map()中还有第二个可选参数。该参数将 this 绑定到传递给特定 method.If 的回调,您需要使用它确保与 reduce()

相同

查看下面的工作片段

function ArraySet(items) {
  // this._items = []
  this._items = items
}

ArraySet.prototype.forEach = function forEach(cb) {
   return this._items.forEach(cb);
}
  
ArraySet.prototype.reduce = function reduce(...args) {
  return this._items.reduce(...args);
}

let arr = new ArraySet([{
    key1: 'property2',
    key3: 'propertyx'
  },
  {
    key1: 'property4',
    key3: 'propertyy'
  },
  {
    key1: 'climate change',
    key3: 'propertyx'
  },
  {
    key1: 'climate change',
    key3: 'propertyx'
  },
])

arr.forEach(el => {
    console.log(el)
});

x = arr.reduce((map, obj) => {
    if (obj.key3 === 'propertyx'){
        map.push(obj.key1)
    }
    return map
}, []) //<-- final argument is the instantiating literal of the reigning map type: [], {}, ''

console.log(x)

On a side note, the same function in arrow notation does not work

箭头函数没有自己的 this 绑定。他们使用父作用域的 this。因为你在你的方法中使用 this 所以你不能使用箭头函数。原型方法永远不能用箭头函数来写。