導入:なぜオブジェクトの変更を制限する必要があるのか?
JavaScriptで開発をしていると、意図せずデータが書き換えられてしまい、バグが発生することがあります。特に、設定値や定数として定義したオブジェクトが途中で変更されると、予期せぬ挙動を招く原因になります。
そこで重要なのが「オブジェクトを凍結(Freeze)する」という考え方です。今回は、そのオブジェクトが現在「凍結されているか(変更不可の状態か)」を確認できる便利なメソッド「Object.isFrozen」について解説します。
基礎知識:オブジェクトの「凍結」とは?
JavaScriptのオブジェクトは、初期状態ではプロパティの追加・削除・値の変更が自由に行えます。しかし、Object.freeze()メソッドを使うと、そのオブジェクトを「凍結」し、変更不可能な状態にできます。
Object.isFrozenは、引数に渡したオブジェクトが「凍結済みであるかどうか」を真偽値(true または false)で返すメソッドです。
実装:Object.isFrozenを使ってみよう
基本的には、Object.freeze()で固めたオブジェクトに対して使用します。これを使うことで、プログラムの途中で「この設定オブジェクトは今、安全に使える状態かな?」というチェックを行うことができます。
サンプルプログラム
以下のコードをコピーして、ブラウザのコンソールやNode.jsで実行してみてください。
// 1. 通常のオブジェクトを作成
const settings = { theme: "dark" };
// まだ凍結していないので、isFrozenはfalse
console.log("凍結されているか:", Object.isFrozen(settings)); // false
// 2. オブジェクトを凍結する
Object.freeze(settings);
// 凍結したので、isFrozenはtrueになる
console.log("凍結後の状態:", Object.isFrozen(settings)); // true
// 3. 凍結されているか確認してから操作する安全な関数
function updateTheme(obj, newTheme) {
if (Object.isFrozen(obj)) {
console.log("エラー: このオブジェクトは凍結されているため変更できません!");
} else {
obj.theme = newTheme;
console.log("テーマを変更しました:", obj.theme);
}
}
updateTheme(settings, "light"); // 凍結されているため変更不可
応用・注意点:現場で役立つポイント
1. 浅い凍結(Shallow Freeze)
Object.freeze()は「一段階目」のプロパティしか凍結しません。オブジェクトの中に別のオブジェクト(ネストされたオブジェクト)がある場合、その内側のオブジェクトは変更できてしまいます。完全に固めたい場合は、再帰的に凍結する処理が必要です。
2. 厳格モード(strict mode)での挙動
凍結されたオブジェクトに対して値を代入しようとした場合、通常は何も起きませんが、’use strict’(厳格モード)を使用している場合はエラー(TypeError)が発生します。開発時には必ず厳格モードを使用して、意図しない変更を早期に発見できるようにしましょう。
3. デバッグの判断材料として
APIから受け取った重要なデータや、グローバルな設定値がどこかで書き換えられていないか調査する際、このメソッドをログ出力に仕込むことで、状態管理のデバッグが非常にスムーズになります。ぜひ活用してください。