孤独プログラマー譚

孤独死が近い。

JavaScript オブジェクトの結合

オブジェクトの結合について、情報整理。
 
 
以下、既存のオブジェクトに、別のオブジェクトを結合する場合。
ES6で書けない時はjQueryを使う。

var nogizaka1 = {
  shiraishi: 'mai',
  akimoto: 'manatsu',
}
var nogizaka2 = {
  hori: 'miona',
  suzuki: 'ayane',
}

// jQueryのメソッド
$.extend(nogizaka1, nogizaka2)
console.log(nogizaka1)
// {shiraishi: "mai", akimoto: "manatsu", hori: "miona", suzuki: "ayane"}

// ES6
Object.assign(nogizaka1, nogizaka2)
console.log(nogizaka1)
// {shiraishi: "mai", akimoto: "manatsu", hori: "miona", suzuki: "ayane"}

 
 
以下、結合して新しいオブジェクトを生成する場合。

// jQueryのメソッド
var nogizaka3 = $.extend({}, nogizaka1, nogizaka2)
console.log(nogizaka3)
// {shiraishi: "mai", akimoto: "manatsu", hori: "miona", suzuki: "ayane"}

// ES6
var nogizaka3 = Object.assign({}, nogizaka1, nogizaka2)
console.log(nogizaka3)
// {shiraishi: "mai", akimoto: "manatsu", hori: "miona", suzuki: "ayane"}

// ES6 スプレッド演算子
var nogizaka3 = { ...nogizaka1, ...nogizaka2 }
console.log(nogizaka3)
// {shiraishi: "mai", akimoto: "manatsu", hori: "miona", suzuki: "ayane"}

スプレッド演算子を積極的に使いたい。