ホームページ > ウェブフロントエンド > jsチュートリアル > オブジェクトを作成するための Js OOP プログラミングの詳細な解釈

オブジェクトを作成するための Js OOP プログラミングの詳細な解釈

亚连
リリース: 2018-05-19 16:33:23
オリジナル
1315 人が閲覧しました

ここで、オブジェクトを作成するための Js OOP プログラミングについての包括的な理解を提供します。今からそれを皆さんと共有し、皆さんの参考にしてください。

オブジェクト指向は、現実世界を理解して抽象化する方法であり、コンピュータープログラミング技術が一定の段階まで発展した結果です。

オブジェクトの意味

オブジェクトには、車、人、動物、テキスト、フォーム、または存在するものなどがあります。

オブジェクトには以下があります:

属性 -------オブジェクトのいくつかの特定のプロパティ。
メソッド-----オブジェクトができること。
イベント ------- オブジェクトに起こる事柄に応答することができます。

人間のオブジェクトを作ることでオブジェクト指向を理解することができます

人:

2本の手、2本の足、1つの頭で、走ることもできます。

手、足、頭は人間の属性であり、走ることは人間の方法です。

まず、最も単純な方法を使用してオブジェクトを作成しましょう

var person = {
      head: "one",
      hand: "two",
      foot: "two",
      run : function(){
        console.log("running");
      }
    }
ログイン後にコピー

この方法は、別個のオブジェクトを作成するため、まったく実用的ではありません。また、このオブジェクトは共通のデータ構造とは何の関係もありません。

次に、コンストラクターを使用してオブジェクトを作成します

var Person = function(){//注意,首字母大写
      this.head = "one",
      this.hand = "two",
      this.foot = "two",
      this.run = function(){
        alert("running");
      }
    }
    var Joan = new Person();
    document.write(Joan.run())// "running"
ログイン後にコピー

これは、コンストラクターを使用して作成されたオブジェクトです。次に、別のコード行を追加して確認します

var Niki = new Person();
    alert(Joan==Niki) //false;
ログイン後にコピー

はい、オブジェクト インスタンスが 2 つ作成されました。

JavaScript のすべての関数には、prototype 属性があります。関数がコンストラクターとして使用される場合、この属性は new を通じて自動的に呼び出され、オブジェクトのプロトタイプが作成されます

console.log(Joan)
ログイン後にコピー

__proto__: person があることがわかります。 __proto__ は Joan のプロトタイプ チェーンです。

JS がオブジェクト (通常のオブジェクトであっても関数オブジェクトであっても) を作成するときに使用される __proto__ という組み込み属性があります。プロトタイプ オブジェクトを作成した関数オブジェクトを指すプロトタイプ オブジェクト。

プロトタイプ チェーンについては、『JavaScript Advanced Programming』という本に詳しく書かれています。興味のある方は、オンラインでPDFドキュメントもご覧いただけます。ただし、この本を購入してオリジナル版をサポートすることをお勧めします。

その後、prototype のプロトタイプ プロパティへの変更は、変更前に作成されたか後に作成されたかに関係なく、new Person() で構築されたすべてのインスタンス オブジェクトに適用できます。 詳細は次のとおりです。

var Person = function(){//注意,首字母大写
      this.head = "one",
      this.hand = "two",
      this.foot = "two"
    }
    Person.prototype.run = function(){
      alert("running");
    }
    var Joan = new Person();
    Joan.run()// "running"
    alert(Joan.__proto__===Person.prototype)//'true'
ログイン後にコピー

プロトタイプで作成されたメソッドを呼び出すことができ、Joan のプロトタイプ チェーンが person のプロトタイプを指していることがわかります。

もう一度見てください:

var Niki = new Person();//"runing"
     Person.prototype.run = function(){
       alert("running running")
     }
     Joan.run()//"running running"
     Niki.run()//"running running"
ログイン後にコピー

見てください、Person のプロトタイプ メソッドを変更してください。同じプロトタイプ メソッドの実行がすべてのインスタンスで共有されるため、new Person() によって作成されたオブジェクト インスタンス内のすべてのメソッドが変更されています。プロトタイプの応用です。

上記は私があなたのためにまとめたものです。

関連記事:

JavaScript 回文番号判定の詳しい説明と実装コード (グラフィックチュートリアル)

JavaScript の文字セットのエンコードとデコードを詳しく解説 (グラフィックチュートリアル)

ネイティブ js の実装ホリデータイムカウントダウン機能(コード付き)

以上がオブジェクトを作成するための Js OOP プログラミングの詳細な解釈の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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