ホームページ > ウェブフロントエンド > jsチュートリアル > JavaScript でオブジェクトを作成する (3 つの方法)

JavaScript でオブジェクトを作成する (3 つの方法)

藏色散人
リリース: 2019-04-04 10:08:47
オリジナル
2497 人が閲覧しました

構文の観点から見ると、JavaScript は柔軟なオブジェクト指向言語です。この記事では、JavaScript でオブジェクトをインスタンス化するさまざまな方法を紹介します。

JavaScript はクラスレス言語であり、関数はクラスをシミュレートするために特定の方法で使用されることに注意することが重要です。 (推奨: 「javascript チュートリアル」)

関数をクラスとして使用する:

JavaScript でオブジェクトをインスタンス化する最も簡単な方法の 1 つ。従来の JavaScript 関数を定義し、 new キーワードを使用して関数のオブジェクトを作成します。関数のプロパティとメソッドは、this キーワードを使用して作成されます。

<script> 
    function copyClass(name, age) { 
        this.name = name; 
        this.age = age; 
        this.printInfo = function() { 
            console.log(this.name); 
            console.log(this.age); 
        } 
    } 
  
// 创建copyClass对象并初始化参数。
var obj = new copyClass("Vineet", 20); 
  
//调用copyClass的方法。
obj.printInfo(); 
</script>
ログイン後にコピー

出力:

Vineet
20
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

説明: OOP のクラスには、いくつかのパラメーターといくつかのメンバー関数という 2 つの主要コンポーネントがあります。このメソッドでは、name と age という 2 つのパラメータを持つクラスのような関数 (このキーワードは、クラスの名前と age を、指定されたパラメータの名前と age に区別するために使用されます) と printInfo メソッドを宣言します。これらのパラメータの値を出力します。次に、copyClass オブジェクト obj を作成し、初期化し、そのメソッドを呼び出します。

オブジェクト リテラルの使用:

リテラルは、オブジェクトを定義するためのより小さくて簡単な方法です。以下では、リテラルを使用して、前のオブジェクトとまったく同じオブジェクトをインスタンス化します。

<script> 
    var obj = { 
        name : "", 
        age : "", 
        printInfo : function() { 
            console.log(this.name); 
            console.log(this.age); 
        } 
    } 
  
// 初始化参数。
obj.name = "Vineet"; 
obj.age = 19; 
  
// 使用对象的方法。
obj.printInfo(); 
</script>
ログイン後にコピー

出力:

Vineet
20
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

説明: このメソッドは前のメソッドと同じように機能しますが、関数内でパラメーター (名前と年齢) とメソッド (printInfo) をバンドルする代わりに、それらをオブジェクト自体にバンドルするには、オブジェクトを初期化し、メソッドを使用するだけです。

関数のシングルトンの使用:

3 番目の方法は、他の 2 つの方法を組み合わせたものです。関数を使用してシングルトン オブジェクトを定義できます。

<script> 
    var obj = new function() { 
        this.name = ""; 
        this.age = ""; 
        this.printInfo = function() { 
            console.log(this.name); 
            console.log(this.age); 
        }; 
    } 
  
obj.name = "Vineet"; 
obj.age = 20; 
  
obj.printInfo(); 
</script>
ログイン後にコピー

出力:

Vineet
20
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

説明: これは、最初の 2 つのメソッドを組み合わせたものです。メソッドとパラメーターを関数にバンドルしますが、個別の関数は宣言しません (方法 1) の copyClass と同様に、代わりに関数構造体を使用してオブジェクトを宣言するだけです。

以上がJavaScript でオブジェクトを作成する (3 つの方法)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート