プロパティの削除とは何か
オブジェクトから不要になったキーと値のペアを取り除くのが「削除」です。JavaScriptでは delete 演算子を使ってプロパティを消します。削除すると、そのキーはオブジェクトから完全に消え、存在確認(in)や列挙(Object.keys)にも出てこなくなります。
基本構文と戻り値(成功かどうかを見分ける)
delete オブジェクト.キー または delete オブジェクト["キー"] の形で使います。delete は「削除に成功したか」を真偽値で返します。削除可能なら true、削除不可能(設定で消せない)なら false が返り、strict モードでは一部のケースで例外が投げられます。
const user = { name: "太郎", age: 20 };
console.log(delete user.age); // true(削除成功)
console.log("age" in user); // false(もう存在しない)
console.log(user); // { name: "太郎" }
JavaScriptここが重要です:delete は「消えたかどうか」の結果を返します。削除できない場合は false(strict では例外)なので、必要なら戻り値で成否をチェックできます。
例題で理解する(ドット記法・ブラケット記法・列挙から消える)
ドット記法とブラケット記法の削除
const settings = { theme: "dark", "fav-color": "blue" };
delete settings.theme; // ドット記法
delete settings["fav-color"]; // ブラケット記法(記号を含むキーにも対応)
console.log(Object.keys(settings)); // [](どちらも消えた)
JavaScriptキーが文字通りの識別子ならドット、動的なキーや記号を含むキーはブラケットを使います。削除後は Object.keys にも出てきません。
ネストしたプロパティの削除
const user = { profile: { city: "東京", zip: "100-0000" } };
delete user.profile.zip; // 内側のキーだけ消す
console.log(user.profile); // { city: "東京" }
delete user.profile; // 入れ物ごと消す
console.log(user.profile); // undefined
JavaScript入れ子の場合、必要なレベルのキーを指定します。上位を消すと中身もまとめて消えます。
配列での delete の注意点(穴が空く・長さは変わらない)
delete は配列の要素にも使えますが、「要素を空にする」だけで、配列の長さは変わりません。結果として“穴(empty)”ができ、走査や処理が歪みます。要素を取り除いて詰めたいなら splice を使うのが定石です。
const arr = [10, 20, 30];
delete arr[1];
console.log(arr); // [10, <1 empty item>, 30]
console.log(arr.length); // 3(長さはそのまま)
arr.splice(1, 1); // ← こちらが推奨(詰める)
console.log(arr); // [10, 30]
console.log(arr.length); // 2
JavaScriptここが重要です:配列から“消す”目的なら splice。delete は「場所だけ空にする」ため、後工程で困りやすく、性能的にも配列の最適化を崩すことがあります。
削除できないプロパティと設定(configurable の深掘り)
JavaScriptの各プロパティには「属性」があり、configurable: false のプロパティは削除できません。通常の代入で作られるプロパティは削除可能ですが、Object.defineProperty で configurable: false にすると削除が禁止されます。
const config = {};
Object.defineProperty(config, "version", {
value: "1.0.0",
writable: false,
enumerable: true,
configurable: false
});
console.log(delete config.version); // false(削除不可)
JavaScriptここが重要です:Object.freeze(obj) はすべてのプロパティを「書き換え不可&削除不可」に、Object.seal(obj) は「削除不可」にします。外部から消されたくないデータには、属性で守りを固めましょう。
delete と undefined の違い(“消す”か“空の値にする”か)
キーを完全に消すのが delete、値だけ空にするのが代入(obj.key = undefined)です。見た目は似ても、性質が違います。
const user = { name: "太郎", age: 20 };
user.age = undefined; // 値だけ空にする
console.log("age" in user); // true(キーは存在)
console.log(Object.keys(user)); // ["name", "age"]
delete user.age; // キーごと消す
console.log("age" in user); // false
console.log(Object.keys(user)); // ["name"]
JavaScriptここが重要です:存在判定を正しく扱いたい(列挙からも消したい)なら delete。単に「まだ値が決まっていない」状態を示したいなら undefined を使います。
グローバルや識別子への delete の挙動(言語仕様の“ハマり所”)
宣言された変数や関数宣言は delete できません。特に var で作られたグローバルは、グローバルオブジェクトの「削除不可プロパティ」になりがちで、delete は失敗します。let/const で宣言した識別子はそもそもオブジェクトのプロパティではないため、delete の対象外です。
var g = 1;
console.log(delete g); // false(ブラウザでは window.g は削除不可が多い)
let h = 2;
// console.log(delete h); // 常に効果なし(識別子は削除対象外)
// ただし、明示的に作ったプロパティは削除可能
window.temp = 123;
console.log(delete window.temp); // true
JavaScriptここが重要です:delete は「オブジェクトのプロパティ」を消すためのもの。識別子(変数そのもの)や削除不可のプロパティには効きません。
まとめ
delete はオブジェクトからプロパティを「キーごと」取り除き、列挙や存在判定からも消します。配列要素には穴を開けるだけなので、詰めたいなら splice を使います。削除不可(configurable: false)なプロパティは消えず、freeze/seal で守りを固められます。undefined 代入は「値を空にする」だけでキーは残るため、目的に応じて使い分けましょう。戻り値や存在判定を活用して、消え方・残り方を正しくコントロールできるようになると、堅牢で意図通りのデータ操作ができるようになります。
