【JS】オブジェクト（連想配列）をコピーする方法

今回はJavaScriptのオブジェクトをコピーする際の注意と、最近知った新しいコピーのやり方を紹介する。

スプレッド構文でオブジェクトをコピーする

まずは正解から。

var hoge = { 
  age: 30 
};
var piyo = {...hoge}

piyo.age = 20;

console.log(hoge.age); // 出力結果: 30 
console.log(piyo.age); // 出力結果: 20

4行目、見慣れない書き方でpiyoにhogeをコピーしているが、これがスプレッド構文と呼ばれる書き方で、以下と同じコードを短縮して書くことができるものだ。

var piyo = { 
  age: 30 
};

オブジェクトのコピーは他の方法でも書くことができるが、調べた限りこれが一番シンプルだ。

間違った例

オブジェクトのコピーについて、一応間違った例も紹介しておく。

var hoge = {
  age: 30
};
var piyo = hoge;

piyo.age = 20;

console.log(hoge.age); // 出力結果: 20
console.log(piyo.age); // 出力結果: 20

4行目、単純にオブジェクトを変数に代入するだけではコピーとならず、piyoとhogeは同じオブジェクトを参照していることになる。