🦔

オブジェクト操作チートシート

に公開
2

自分用チートシートです。

オブジェクトの作成

方法 説明
オブジェクトリテラル 最も一般的で推奨される方法。 let obj = { key: 'value', num: 123 };
new Object() 基本的なオブジェクトを作成。 let obj = new Object();
Object.create() 既存のオブジェクトをプロトタイプとして新しいオブジェクトを作成。 let proto = { greet: 'Hello' };
let obj = Object.create(proto);

プロパティのアクセスと設定

方法 説明 結果
ドット記法 (.) プロパティ名が静的で有効な識別子の場合。 obj.key; value'
ブラケット記法 ([]) プロパティ名が動的、スペースを含む、または変数である場合。 obj['key'];let prop = 'num'; obj[prop]; value'123
プロパティの設定 既存のプロパティを上書き、または新しいプロパティを追加。 obj.key = 'new_value';obj.newProp = 'something'; { key: 'new_value', num: 123 } { key: 'value', num: 123, newProp: 'something' }

プロパティの削除

メソッド/演算子 説明 結果
delete 演算子 オブジェクトからプロパティを削除する。 delete obj.key; { num: 123 }

オブジェクトのコピー

JavaScriptのオブジェクトは参照型であり、変数間で同じインスタンスを共有する共有渡しのような挙動をするため、単純な代入ではコピーにはなりません。

方法 説明 bcd''def'
スプレッド構文 (...) シャローコピー(浅いコピー)を作成する最も一般的で簡単な方法。 let newObj = { ...obj }; bcd''bcd' (自動で順番入れ替え)
Object.assign() シャローコピーを作成。複数のオブジェクトをマージも可能。 let newObj = Object.assign({}, obj);let merged = Object.assign({}, obj1, obj2); bcd'
JSON.parse(JSON.stringify(obj)) ディープコピー(深いコピー)の簡単な方法。ただし、関数や Date オブジェクトなどは失われる。 let newObj = JSON.parse(JSON.stringify(obj));
構造化クローン (structuredClone()) ディープコピーの新しい標準的な方法(ES2022)。関数など一部の型はコピー不可。 let newObj = structuredClone(obj); 結果

プロパティの列挙と反復処理

メソッド/構文 説明 12
Object.keys() オブジェクトのキー(プロパティ名)の配列を返す。 Object.keys(obj); TRUE
Object.values() オブジェクトの値の配列を返す。 Object.values(obj); TRUE
Object.entries() オブジェクトのキーと値のペアの配列を返す。 Object.entries(obj); TRUE
for...in ループ オブジェクトの列挙可能なプロパティを反復処理。継承プロパティも含む可能性があるため注意。 for (let k in obj) { console.log(k, obj[k]); } 6
for...of ループ Object.entries() などと組み合わせて使うと便利。 for (const [key, value] of Object.entries(obj)) { console.log(key, value); }

オブジェクトの比較

方法 説明 結果
厳密等価 (===) 同じメモリ参照を指す場合に true。 obj1 === obj2; (参照が同じか) true または false
プロパティの比較(手動) 全プロパティの比較を行う関数を自作する必要がある。 JSON.stringify(obj1) === JSON.stringify(obj2); (簡易的な比較だが制約あり) true または false

プロパティの存在チェック

方法 説明 結果
in 演算子 オブジェクトに特定のプロパティが存在するか(継承プロパティも含む)。 key' in obj; TRUE
hasOwnProperty() オブジェクト自身のプロパティとして存在するか。継承プロパティは含まない。 obj.hasOwnProperty('key'); TRUE
obj.key !== undefined プロパティの値が undefined でないか。プロパティが存在しない場合も undefined になるため注意。 obj.key !== undefined; TRUE

オブジェクトのマージ

方法 説明 結果
スプレッド構文 (...) 後に書かれたオブジェクトのプロパティが優先される。 let merged = { ...obj1, ...obj2 }; obj1とobj2のプロパティをマージ。重複は後者が優先。
Object.assign() 第二引数以降のオブジェクトが第一引数にマージされる。第一引数が変更されるので注意。 Object.assign(targetObj, sourceObj1, sourceObj2); targetObjにsourceObjの内容が追加される。

オブジェクトの不変性の確保

メソッド 説明 変更後の状態
Object.freeze() オブジェクトを変更不可にする(プロパティの追加、変更、削除を禁止)。 Object.freeze(obj); オブジェクトが凍結され、変更不可。
Object.seal() 既存のプロパティの変更は可能だが、追加/削除は禁止。 Object.seal(obj); オブジェクトにプロパティの追加/削除不可。

Discussion

junerjuner

JavaScriptのオブジェクトは参照渡しのため

それは 参照型 なだけで参照渡しなわけではないのではないでしょうか?

敢えて言うならば参照渡しではなく、共有渡し、 もしくは インスタンスが共有される為 あたり。

takaatakaa

ご指摘頂きありがとうございます。
参照型であり同じオブジェクトを操作できるという直感的な説明として「参照渡し」と表現しておりましたが、厳密に言うと「共有渡し」の方が適切かと思いますので修正させていただきます。
丁寧なご指摘、ありがとうございました!