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

JavaScriptのObject.freeze()とconstの違いとは？主な相違点をサンプルコード付きで解説

JavaScriptにおけるObject.freeze()とconstの最大の違いは、前者がオブジェクトの変更（ミュータビリティ）を防げるのに対し、後者は変更を防げないという点です。それぞれの特徴を詳しく見ていきましょう。

constの基本動作

constはletとほぼ同じ挙動を持ちます。constで宣言した変数は再代入不可となり、一度値を代入すると別の値を割り当て直すことはできません。また、varが関数スコープであるのに対し、constで宣言された変数はブロックスコープになります。

しかし、constには重要な弱点があります。それはオブジェクトの変更（ミュータビリティ）を防げないという点です。constで宣言したオブジェクトでも、そのプロパティは自由に書き換えられてしまいます。「constで代入した変数は二度と変わらない」という理解は半分しか正しくなく、オブジェクトの中身までは守ってくれません。そのため、オブジェクト自体の変更を防ぎたい場合は、constだけでは不十分です。

サンプルコード

次の例では、personオブジェクトのCountryプロパティには初期値として"India"が設定されていますが、constで宣言しているにもかかわらず、後から"England"に書き換えられてしまいます。

<html>
<body>
<script>
    const person = {
      "name" : "Suresh",
      "Country" : "India",
      "Designation" : "Mayor"
    }
    person.Country = "England"
    document.write(person.Country);
</script>
</body>
</html>

実行結果

England

Object.freeze()メソッド

Object.freeze()メソッドは、オブジェクトにイミュータビリティ（不変性）をもたらします。一度フリーズされたオブジェクトは、プロパティの追加・削除・変更が一切できなくなります。

次の例では、Countryプロパティの値を"India"から"England"に変更しようとしていますが、オブジェクトがフリーズされているため、値は"India"のまま維持されます。なお、非厳格モードでは変更操作が静かに無視され、厳格モード（"use strict"）ではTypeErrorが発生する点にも注意してください。

サンプルコード

<html>
<body>
<script>
    const person = {
      "name" : "Suresh",
      "Country" : "India",
      "Designation" : "Mayor"
    }
    Object.freeze(person);
    person.Country = "England"
    document.write(person.Country);
</script>
</body>
</html>

実行結果

India

まとめ：使い分けのポイント

  • const：変数への再代入を防ぐ。ただし、オブジェクトのプロパティは変更可能。
  • Object.freeze()：オブジェクトのプロパティ変更・追加・削除を防ぐ。ただし、変数への再代入は別の問題。
  • 両者を組み合わせれば、再代入もプロパティ変更も防げる、より堅牢なイミュータブルなコードを実現できます。
  1. JavaScriptにおける関数とメソッドの違いとは？わかりやすく解説

    JavaScriptにおいて、関数とメソッドは本質的には同じものです。両者の違いは、メソッドがオブジェクトのプロパティとして定義された関数であるという点にあります。つまり、独立して定義されたものを「関数」、オブジェクトに紐づけられたものを「メソッド」と呼びます。 JavaScriptの関数の基本形 まず、一般的な関数の定義方法を見てみましょう。 function functionname(param1, param2){ // 処理内容 } JavaScriptのメソッドの例 メソッドは、オブジェクトに関連付けられた関数です。次の例では、employeeオブジェクトの中にdetails

  2. JavaとJavaScriptの違いとは？歴史・技術・使い分けを徹底解説

    ウェブ開発者のジェレミー・キースは2009年、「JavaとJavaScriptの関係は、ハムとハムスターの関係のようなものだ」と語りました。この比喩がどれほど正確かは議論の余地がありますが、その本質は的確です。共通する言語的ルーツを持つにもかかわらず、JavaとJavaScriptはまったく異なる2つのプログラミング言語なのです。年月とともに両者の重なりも多少増えましたが、今なおJavaScriptはウェブサイトにインタラクティブ性をもたらすフロントエンド言語の主流であり続け、Javaはサーバーサイドやアプリケーション開発で人気を保っています。開発者を採用したい方、プログラミングを学びたい方