減少和 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 }