JavaScript オブジェクトの結合

updated Sep 28, 2021created Sep 28, 2021

Object.assign()

js
const userConfig = { name: "田中太郎", age: 22 }; const additionalConfig = { age: 30, role: 1 }; Object.assign(userConfig, additionalConfig); console.log("✅ userConfig: ", userConfig); // ✅ userConfig: {name: '田中太郎', age: 30, role: 1} console.log("✅ additionalConfig: ", additionalConfig); // ✅ additionalConfig: {age: 30, role: 1}
  • 第一引数userConfigに結合される
  • 同じObjectKeyがある場合は第二引数に渡したObjectの値で上書きされる
  • 第3引数以降も設定できる

スプレッド構文

js
const userConfig = { username: "田中太郎", age: 22 }; const shopConfig = { shopname: "山田雑貨店", role: 1 }; const config = { ...userConfig, ...shopConfig }; console.log("✅ config: ", config); // ✅ config: {username: '田中太郎', age: 22, shopname: '山田雑貨店', role: 1}

まとめたい時

js
function bundleConfig() { ...色々処理 const userConfig = this.userConfig; const shopConfig = this.shopConfig; const config = { ...userConfig, ...shopConfig }; ...色々処理 return config; }

ドキュメント

Object.assign() - JavaScript | MDN