JavaScript 逆引き集 | オブジェクトのプロパティ削除

JavaScript JavaScript
スポンサーリンク
スポンサーリンク

「そのプロパティ自体を“なかったことにする”」という発想です

delete obj.key は、JavaScript で オブジェクトから特定のプロパティそのものを削除するための演算子です。 値を nullundefined にするのではなく、「そのキー自体をオブジェクトから取り除く」という動きをします。 業務・実務では「不要な情報を消してからログに残す」「外部に渡す前に機密情報を削る」「一時的なフラグを片付ける」など、情報セキュリティとも深く関わる場面でよく使われます。

初心者の方にとって大事なのは、「値を空にする」と「プロパティを削除する」はまったく別物だと理解することです。ここを押さえると、in 演算子や JSON 化との関係もすっきり見えてきます。

ステップ1:delete が何をしているかを具体的に確認します

まずは基本の動きを見てみます。

const user = { name: "Aki", age: 20, active: true };

console.log(user);
// { name: "Aki", age: 20, active: true }

delete user.age;

console.log(user);
// { name: "Aki", active: true }
console.log('age' in user); // false
JavaScript

ここで起きていることは、

  • user.age というプロパティがオブジェクトから完全に取り除かれる
  • user を表示すると age が消えている
  • 'age' in userfalse になる(存在しない)

という流れです。

もし user.age = undefined とした場合は、

user.age = undefined;
console.log(user);
// { name: "Aki", age: undefined, active: true }
console.log('age' in user); // true
JavaScript

となり、「プロパティは存在するが値が undefined」という状態になります。 delete は「存在そのものを消す」、代入は「値だけを変える」という違いを、まずしっかり区別していただきたいです。

ステップ2:「削除」と「空にする」の違いを深掘りします

この違いは、バリデーションやセキュリティチェックで非常に重要になります。

const obj = { a: 1, b: undefined };

console.log('b' in obj); // true
delete obj.b;
console.log('b' in obj); // false
JavaScript

ここから分かるように、

  • bundefined を入れても「存在する」
  • delete obj.b をすると「存在しない」

という状態になります。

業務で「必須項目が送られてきているか」をチェックするときは、

  • 存在チェック → 'key' in obj
  • 値チェック → obj.key == null など

と分けて考える必要があります。 delete を使うと、「存在チェックで false になる」側に倒れるので、 「このフィールドはもう使わない」「外部に出したくない」という意図を明確にできます。

ステップ3:業務でよくあるパターン — 機密情報を削ってから外部に渡す

情報セキュリティの観点で、delete が最もよく使われるのが「機密情報の削除」です。

例えば、ユーザーオブジェクトからパスワードやトークンを削ってからログに出したい、APIレスポンスとして返したい、という場面です。

function sanitizeUser(user) {
  const safe = { ...user }; // まず浅いコピーを作る
  delete safe.password;
  delete safe.token;
  return safe;
}

const user = {
  id: 1,
  name: "Aki",
  password: "secret",
  token: "abc123"
};

const safeUser = sanitizeUser(user);

console.log(safeUser);
// { id: 1, name: "Aki" }
JavaScript

ここでは、

  1. 元の user を直接いじらないためにスプレッドでコピーを作る
  2. コピー側から passwordtokendelete で削除する
  3. 機密情報を含まないオブジェクトを外部に渡す

という流れになっています。

user.password = undefined のように値だけを空にすると、 「プロパティ名自体は残る」ため、ログや JSON に "password": null のような形で出てしまうことがあります。 それが望ましくない場合は、delete で「プロパティ自体を消す」方が安全です。

ステップ4:ループと組み合わせて「不要なキーを一括削除」するテンプレート

不要なプロパティが複数ある場合、ループと組み合わせて一括削除することができます。

function removeKeys(obj, keys) {
  for (const key of keys) {
    delete obj[key];
  }
  return obj;
}

const payload = {
  username: "Aki",
  debug: true,
  tempId: "xyz",
  extra: "something"
};

removeKeys(payload, ['debug', 'tempId']);

console.log(payload);
// { username: "Aki", extra: "something" }
JavaScript

このテンプレートは、

  • デバッグ用フラグを消す
  • 一時的な ID を消す
  • 内部用のメタ情報を消す

といった場面でそのまま使えます。

セキュリティ的には、「外部に出してはいけないキーのリスト」を明示的に持ち、 それを delete で削る設計にしておくと、意図しない情報漏えいを防ぎやすくなります。

ステップ5:パフォーマンスと設計上の注意点

delete は便利ですが、いくつか注意点もあります。

1. パフォーマンス面の注意

古い JavaScript エンジンでは、delete を多用するとオブジェクトの内部構造が最適化されず、 パフォーマンスに影響することがあると言われていました。 最近の環境ではかなり改善されていますが、 「大量のオブジェクトに対して頻繁に delete を行う」ような設計は、 場合によっては避けた方がよいこともあります。

代替として、

  • 新しいオブジェクトを作り、必要なプロパティだけをコピーする
  • Object.fromEntriesObject.entries を使ってフィルタリングする

といった方法もあります。

function pick(obj, allowedKeys) {
  return Object.fromEntries(
    Object.entries(obj).filter(([key]) => allowedKeys.includes(key))
  );
}
JavaScript

このように「必要なものだけを選ぶ」設計は、 「不要なものを消す」設計よりも安全で分かりやすいことが多いです。

2. 配列に対する delete の注意

配列に対して delete arr[index] を使うと、要素は消えますが「穴」が空きます。

const arr = [1, 2, 3];
delete arr[1];

console.log(arr);      // [1, empty, 3]
console.log(arr.length); // 3
JavaScript

配列から要素を削除したい場合は、splice を使う方が一般的です。

arr.splice(1, 1); // index 1 を1つ削除
JavaScript

delete は「オブジェクトのプロパティ削除」に向いていて、 「配列の要素削除」にはあまり向いていないことを覚えておいてください。

ステップ6:実務で使える汎用テンプレート関数

最後に、業務でそのまま使えるテンプレートをいくつかまとめます。

機密フィールドを削除するサニタイズ関数

function sanitizeForLog(obj, secretKeys) {
  const copy = { ...obj };
  for (const key of secretKeys) {
    delete copy[key];
  }
  return copy;
}

const user = {
  id: 1,
  name: "Aki",
  password: "secret",
  token: "abc123"
};

console.log(sanitizeForLog(user, ['password', 'token']));
// { id: 1, name: "Aki" }
JavaScript

一時フィールドを片付ける関数

function cleanupTempFields(obj) {
  const tempKeys = ['debug', 'tempId', 'traceId'];
  for (const key of tempKeys) {
    delete obj[key];
  }
  return obj;
}
JavaScript

このように、「削るべきキーのリスト」をコードとして持っておくことで、 どの情報が外部に出ない設計なのかが明確になります。

まとめ:delete は「プロパティ自体を消して、存在をなかったことにする」ための道具です

delete obj.key は、

  • オブジェクトから特定のプロパティそのものを削除し
  • 'key' in objfalse にし
  • 値を undefined にするのとは違い、「存在自体を消す」動きをし
  • 機密情報や一時情報を外部に出す前に削る場面で大活躍し
  • 配列には向かず、パフォーマンスや設計面では「必要なものだけを選ぶ」アプローチも検討すべき

という特徴を持っています。

「このプロパティは、もうこのオブジェクトに存在していてほしくない」と感じた瞬間に、 まず delete obj.key を思い出していただきたいです。 そのうえで、「値を空にするのか」「存在を消すのか」を意識して選ぶことが、 安全で意図の明確な業務コードを書くための大事な一歩になります。

タイトルとURLをコピーしました