减少和 object 解构/赋值

Question

假设我有两个简单的对象，我想创建第三个对象来加入它们的属性。 这非常有效：

(()=>{
  const a1 = {a: 2, b: 3}
  const b1 = {a: 100, c: 5}
  return {...a1, ...b1}
})()
// { a: 100, b: 3, c: 5 }

但是一旦我尝试使用.reduce创建一个从 b1 派生的新的 object ，它就会停止工作。 为了简单起见，让我们创建一个 reduce function，它只是制作 b1 object 的浅表副本：

 let r = (()=>{ const a1 = {a: 2, b: 3} const b1 = {a: 100, c: 5}, b2 = Object.entries(b1).reduce((acc, [key, value])=>Object.defineProperty(acc, key, {value}), {}) console.log(b2) // {a: 100 c: 5} return {...a1, ...b2} })() console.log(r);// { a: 2, b: 3 }

我有一种感觉，关于.reduce function 有一些我不明白的地方。 我该怎么做才能解决这个问题？

Answer 1

默认情况下，使用defineProperty创建的属性是不可枚举的，因此它们不会包含在传播中。

修理：

b2 = Object.entries(b1).reduce((acc, [key, value]) =>
  Object.defineProperty(acc, key, {value, enumerable: true})
, {})

Answer 2

您应该将该属性标记为可枚举

Object.defineProperty(acc, key, {value, enumerable: true});

为什么不直接使用 function Object.assign ，它很简单。

 let r = (()=> { const a1 = {a: 2, b: 3}; const b1 = {a: 100, c: 5}; const b2 = Object.entries(b1).reduce((acc, [key, value]) => Object.assign(acc, {[key]: value}), {}) console.log(b2); // {a: 100 c: 5} return {...a1, ...b2} })() console.log(r); // { a: 2, b: 3 }

Answer 3

一种解决方法是使用Object.assign创建b1的副本，例如：

 let r = (()=>{ const a1 = {a: 2, b: 3} const b1 = {a: 100, c: 5} const b2 = Object.assign({}, b1) console.log(b2) // {a: 100 c: 5} return {...a1, ...b2} })() console.log(r); // { a: 100, b: 3, c: 5 }