ホームページ > ウェブフロントエンド > jsチュートリアル > JavaScriptのコンストラクターとは何ですか?コンストラクターインスタンスの使い方を詳しく解説

JavaScriptのコンストラクターとは何ですか?コンストラクターインスタンスの使い方を詳しく解説

伊谢尔伦
リリース: 2017-07-25 13:20:39
オリジナル
2188 人が閲覧しました

コンストラクターとは何ですか?

Java、C++、PHP などの一部のオブジェクト指向言語では、コンストラクターが非常に一般的です。 Javascript では、コンストラクターはまず通常の関数であり、new 演算子を使用して呼び出すことができ、特殊な型のオブジェクトを生成します。

// "Benjamin" is a constructor
var benjamin = new Benjamin("zuojj", "male");
ログイン後にコピー

上の例では、benjamin は Benjamin オブジェクトですが、どのようにインスタンス化されるのでしょうか?

function Benjamin(username, sex) {
    this.username = username;
    this.sex = sex;
}
var benjamin = new Benjamin("zuojj", "male");
//Outputs: Benjamin{sex: "male",username: "zuojj"}
console.log(benjamin);
ログイン後にコピー

ご覧のとおり、「Benjamin」コンストラクターは単に渡されたパラメーターを受け取り、それを this オブジェクトに割り当てます。これは、コンストラクターが new 演算子によって呼び出されるときに、コンストラクターの this オブジェクトに new 演算によって返されるオブジェクトが割り当てられるためです。
これは、上記のコードが以下と同等であることを意味します:

benjamin = {
 "username": "zuojj",
 "sex": "male"
}
ログイン後にコピー

コンストラクターを使用する理由

コンストラクターを使用する理由は次のとおりです:
1. コンストラクターを使用すると、これらのオブジェクトはすべて同じ基本構造を使用して作成できます
2コンストラクターを使用すると、「benjamin」オブジェクトが「Benjamin」関数のインスタンスとして明示的にマークされます

function Benjamin(username, sex) {
    this.username = username;
    this.sex = sex;
}
var benjamin = new Benjamin("zuojj", "male");
var ben = {
 "username": "zuojj",
 "sex": "male"
}
//Outputs: true
console.log(benjamin instanceof Benjamin);
//Outputs: false
console.log(ben instanceof Benjamin);
ログイン後にコピー

3。コンストラクターを使用すると、複数のインスタンスで共有するためのパブリック メソッドを定義できるようになります

function Benjamin(username, sex) {
    this.username = username;
    this.sex = sex;
}
Benjamin.prototype.getName = function() {
 return this.username;
}
var benjamin = new Benjamin("zuojj", "male");
var ben = new Benjamin("lemon", "female");
//Outputs: zuojj
console.log(benjamin.getName());
//Outputs: lemon
console.log(ben.getName());
ログイン後にコピー

3. 注意事項

1. new キーワード
new キーワードを使用するかどうかは、new キーワードを使用しない場合でも、このオブジェクトに大きな影響を与えます。このオブジェクトはグローバル オブジェクト (ブラウザのウィンドウとノードのグローバル) を指します。したがって、コンストラクターを定義するときは、関数名の最初の文字を大文字にすることをお勧めします。
2. 呼び出された関数に明示的な return 式がない場合、暗黙的にこのオブジェクト、つまり新しく作成されたオブジェクトが返されます。それ以外の場合は、オブジェクトを返す場合にのみ影響します。注意する必要があるのは:

a) new Bar() は、数値のリテラル値 2 ではなく、新しく作成されたオブジェクトを返します。 したがって、 new Bar().constructor === Bar ですが、数値オブジェクトが返された場合、結果は異なります;

b) ここで取得された new Test() は、関数によって返されたオブジェクトであり、 new キーワードによって新しく作成されたものではありません。以下に示すオブジェクト:

function Bar() {
    return 2;
}
var bar = new Bar();
//返回新创建的对象
//Outputs: Bar {} 
console.log(bar);
function Test() {
    this.value = 2;
    return {
        foo: 1
    };
}
var test = new Test();
//返回的对象
//Outputs: Object {foo: 1} 
console.log(test);
ログイン後にコピー

以上がJavaScriptのコンストラクターとは何ですか?コンストラクターインスタンスの使い方を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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