javascript - 如果将函数作为 'target' 参数传递，则 Object.assign 输出是否有所不同

Question

我有以下代码，可以成功执行，但我不太确定这是如何发生的。

var obj = Object.assign(
  (...args) => ({
    a: 1
  }),
  { toString: () => 'type' }
);
console.log(obj); // f type

为什么上面的输出不是

{ 
  f: () => {
    return {a: 1}
  }, 
  toString: () => 'type'
}

谁能详细解释一下上面的内容吗？

Answer 1

Object.assign 将多个源对象的所有可枚举自身属性的值复制到目标对象:

Object.assign({ a: 'foo' }, { b: 'bar' });
// => { a: 'foo', b: 'bar' }

在您给定的示例中，目标对象是箭头函数。在 Javascript 中，函数只是对象(具有自己的可枚举属性)，您可以放心添加其他属性。

示例中的源对象是一个包含属性 toString 和函数值的对象。您实质上是将此属性复制到目标函数中。

当您 console.log 结果对象时，会自动调用 toString 并将其结果记录到控制台。由于该对象实际上是一个函数，因此您将看到 f 类型 的奇怪输出。不过，其显示方式取决于浏览器。

回答您关于为什么返回的对象看起来不像您所写的问题:您扩展了函数本身。如果您为给定函数创建一个具有属性 f 的新对象，您将获得所需的结果:

const obj = Object.assign({
  f: (...args) => ({
    a: 1
})}, {
  toString: () => 'type'
});
  
console.log(obj);