JSコンストラクタとインスタンス化およびプロトタイプ導入の関係

1. コンストラクタとインスタンス化

オブジェクト指向プログラミングの場合、最初のプロセスは抽象化 => 次にインスタンス化です。たとえば、人を抽象化すると、その人の基本的な情報がわかります。名前、年齢、性別など

まず抽象化し、抽象化が完了したらインスタンス化します。

2. コンストラクターとインスタンス化の関係は何ですか?

//このカスタムコンストラクタは抽象関数Person(name,age,sex){内にあります

    this.name=名前;

    this.age=年齢;

    this.sex=セックス;

    this.say=関数(){

        console.log("私の名前は",name)

    }

}

// このプロセスはインスタンス化です。let per1=new Person('司藤',300,'女');

per1.say(); //呼び出し //let per1=new Person('司藤',300,'女');

上記のコード行を通じて。

次のような結論を導き出すことができます。
コンストラクターとインスタンスオブジェクトの関係は次のとおりです。
インスタンスオブジェクトはコンストラクターを通じて作成する必要があります。
同時に、インスタンスオブジェクトのコンストラクタはコンストラクタであることがわかります。
この記述が正しいことを証明しましょう。上記のコードは変更されません。

console.log( per1.constructor===Person ) //trueを返す

完全に説明してください:インスタンスオブジェクトのコンストラクターはコンストラクターであるという記述は正しいです。

3. per1.say は per2.say と等しいですか?

 関数 Person(名前,年齢,好み) {

    this.name=名前;

    this.age=年齢;

    this.like=いいね;

    this.say=関数(){

        console.log('食事を抜くことができます');

    }

}

var per1=new Person("司藤",300,'玩');

var per2=new Person('白浅','10000','玩');

per1.say();

per2.say();

console.log( per1.say == per2.say ) //false

4. per1.sayはper2.sayによって導き出された結論と等しくない

console.log( per1.say == per2.say ) //falseなので
結論を導き出すことができます。
つまり、per1.say() と per2.say() は同じメソッドを呼び出しません。
内容は同じですか？
console.log( per1.say()==per2.say() ) //true
説明内容は同等

5. サンプルコードの問題

5.1 コードの問題

関数 Person(名前,年齢,好み) {

    this.name=名前;

    this.age=年齢;

    this.like=いいね;

    this.say=関数(){

        console.log('食事を抜くことができます');

    }

};

(var インデックス = 0; インデックス < 100; インデックス++) {

    var per=new Person("司藤",300,'玩');

    パー.say();

}

このコード:メモリ内に 100 個のスペースが開きます。各スペースには say メソッドがあります。しかし、それぞれの方法は異なります。しかし、出力は同じです。つまり、実行ロジックは同じです。その結果、スペースが無駄になります。そのため、このプロジェクトではスペースの無駄が生じます。

最適化できますか？

5.2 スペースの無駄を解消するためにコードを最適化する

関数comSay(){

    // 同じロジックを実行します console.log('食事を抜くことができます')

};



関数 Person(名前,年齢,好み) {

    this.name=名前;

    this.age=年齢;

    this.like=いいね;

    this.say=comSay; //括弧を追加しないでください};

var per1=new Person("司藤",300,'玩');

var per2=new Person('白浅','10000','玩');

console.log( per1.say==per2.say ) //true

こうすることでスペースを節約できます。呼び出されるたびに同じメソッドになります。

5.3 この方法を使用すると、プロトタイプ法も使用できます。

関数 Person(名前,年齢,好み) {

    this.name=名前;

    this.age=年齢;

    this.like=いいね;

};

Person.prototype.comSay=function(){

    console.log('食事を抜くことができます')

}

var per1=new Person("司藤",300,'玩');

var per2=new Person('白浅','10000','玩');

console.log( per1.comSay==per2.comSay ) //true

// プロトタイプを通じてデータ共有も解決できる

プロトタイプの役割:データ共有とスペース節約。

JS コンストラクタとインスタンス化の関係とプロトタイプの導入についての記事はこれで終了です。JS コンストラクタとインスタンス化の関係とプロトタイプの導入についての詳細は、123WORDPRESS.COM の過去の記事を検索するか、以下の関連記事を引き続き閲覧してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。

以下もご興味があるかもしれません: