JavaScript
 Computer >> コンピューター >  >> プログラミング >> JavaScript

JavaScriptオブジェクトからプロパティを削除する方法｜delete演算子の使い方

JavaScriptのオブジェクトからプロパティを削除するには、delete演算子を使用します。delete演算子を使うと、指定したプロパティがオブジェクトから完全に取り除かれます。

なお、単にプロパティに undefined を代入した場合と異なり、delete演算子を使えばプロパティそのものをオブジェクトから削除できる点に注意してください。

サンプルコード

<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Object Properties Example</h1>
<h2 class="sample">athlete.name</h2>
<script>
    let athlete = {
        name: "James Anderson",
        sport: "Cricket",
        trophies: "15"
    };
    document.querySelector( ".sample" ).innerHTML = `${athlete.name} who plays ${athlete.sport} has ${athlete.trophies} trophies`;
    delete athlete.trophies;
    document.querySelector( ".sample" ).innerHTML += ` <br> ${athlete.name} who plays ${athlete.sport} has ${athlete.trophies} trophies`;
</script>
</body>
</html>

コードの解説

このコードでは、アスリートの情報を格納した athlete オブジェクトを作成しています。まず、名前（name）・競技種目（sport）・トロフィー数（trophies）を含む状態でブラウザに情報を表示します。

続いて delete athlete.trophies; を実行することで、trophies プロパティをオブジェクトから削除しています。削除後にもう一度同じ形式で情報を表示すると、trophies の値が存在しなくなり undefined と表示されることが確認できます。

実行結果

上記のコードを実行すると、次のような出力が得られます。

JavaScriptオブジェクトからプロパティを削除する方法｜delete演算子の使い方

  1. JavaScriptで配列から値を指定して要素を削除する方法

    JavaScriptで配列から特定の値を持つ要素を削除するには、まずindexOf()メソッドでその値のインデックス（位置）を取得し、次にsplice()メソッドを使って該当する要素を取り除きます。 削除の基本的な手順 indexOf()で削除したい値のインデックスを取得する インデックスが見つかった場合（-1より大きい場合）、splice(index, 1)でその位置の要素を1つ削除する サンプルコード 以下のコードを実行して、実際の動作を確認してみましょう。 <html> <body> <script> var array = [10, 30, 40

  2. JavaScript関数からオブジェクトを返す方法をわかりやすく解説

    JavaScriptの関数からオブジェクトを返すには、return文を使用します。オブジェクト内のプロパティやメソッドにアクセスする際は、thisキーワードを活用すると便利です。この記事では、実際のコード例を使いながら、JavaScript関数からオブジェクトを返す基本的な方法を解説します。基本的な考え方JavaScriptでは、オブジェクトの中にメソッド（関数）を定義できます。そのメソッド内でreturn文を使えば、処理結果や値を呼び出し元に返すことができます。また、thisキーワードを参照することで、同じオブジェクト内の他のプロパティにアクセス可能です。サンプルコード以下のコードでは、従業