Inheritance Patterns/Prototype

18656 ワード

プロタイプは超浩!

Prototype (Prototype Object)


モデル青写真を作成するためのプロトタイプオブジェクト(Orignial Form)
Prototypeオブジェクトは、constructorおよび__proto__の基本プロパティです.
constructorPrototypeオブジェクトとともに作成される関数を指します.この関数が実行されると、各役割ドメインに作成された一意のexecutioncontextnewキーワードを使用してインスタンスが作成されると、インスタンスはthisになります.__proto__(Prototype link)オブジェクトを生成するときにその祖先の関数となるPrototypeオブジェクトを指します.
function Cat() {}
Cat.prototype.feet = 4;
Cat.prototype.tail = 1;

const Moo = new Cat();
const Raegi = new Cat();
__protoプロパティのおかげで、Mooにはfeetというプロパティはありませんが、Moo.feetを実行すると4という値が参照されます.
Mooオブジェクトは、feetを直接持たないため、feetプロパティが見つかる前に、親プロトコルタイプが参照されます.(見つからない場合はundefinedを返します.)

Prototype Chain

__proto__プロパティで親プロトタイプに関連付けられたシェイプ

Class


抽象的に属性と動作を変数とメソッドとして定義することで、データを作成します.
  • クラスは、オブジェクトを作成するためのconstructorを有する.
  • 
    function Cat(name, color, age, sound) { // Cat: class
      this.name = name; // this 객체: 여기서는 
      this.color = color;
      this.age = age;
      this.sound = sound;
    } // 생성자 함수(constructor)
    
    Cat.prototype.cry = function() {
      console.log(`${this.name}이 "${this.sound}"하고 운다.`);
    }
    
    let Yatong = new Cat('야통','grey','3','이얏호응');
    Yatong.color; //'grey'
    Yatong.cry(); // '야통이 "이얏호응"하고 운다.' 
  • は、モデルベースのインスタンス(レプリカ)を作成するための構造化モデルを作成する.
  • constructor:classでオブジェクトを作成および初期化する特別な方法

    プロトタイプとクラスの違い


    クラス定義は、実行時にインスタンス化できるタイプであり、プロトタイプはオブジェクトインスタンス自体です.
    エヴァン・ゲリオンを例にとると...

  • プロトタイプ:秒


  • 例:2号機、3号機...


  • クラス:イワの作成に必要なコンポーネント(LCL、ATフィールド...)設計図、含む
  • Instance


    クラスで定義されたプロパティと動作を含む、実際のメモリに割り当てられたデータ

    Instantiation Patterns


    インスタンスを作成するモード

    Functional Instantiation


    関数を使用してクラスを作成する方法funcitonalメソッドは、インスタンスを作成するたびにsomeInstanceにすべてのメソッドを割り当てます.したがって、各インスタンスはメソッドと同じ数のメモリを消費します.
    const Cat = function() {
      const catInstance = {};
      catInstance.age = 0;
      catInstance.old = function() {
        this.age += 1;
      }
      return catInstance;
    };
    
    const Yatong = Cat();
    const Marilyn = Cat();
    Yatong.old(); // console.log(Yatong.age) => 1
    const Cat = function(age) {
      const catInstance = {};
      catInstance.age = age;
      catInstance.old = function() {
        this.age += 1;
      }
      return catInstance;
    };

    Functional Shared

    Functional Shared方式を使用すると、オブジェクトのsomeMethodsというメソッドのメモリアドレスのみが参照されるため、メモリ効率が向上します.
    const extend = function(to, from) {
      for (let key in from) {
        to[key] = from[key];
      }
    };
    
    const someMethods = {};
    someMethods.old = function() {
      this.age += 1;
    };
    const Car = function(age) {
      const catInstance = {
        age: age,
      };
      extend(catInstance, someMethods);
      return catInstance;
    };

    Prototypal Instantiation

  • 機能共有方式と同様にコード
  • を記述する.
    const someMethods = {};
    someMethods.old = function() {
      this.age += 1;
    };
    const Cat = function(age) {
      const catInstance = Object.create(someMethods); // 
      catInstance.age = age;
      return catInstance;
    };
    
    const Yatong = Cat(3);
    const Marilyn = Cat(2)

    Object.create

    Object.createは、特定のオブジェクトをプロトタイプとするオブジェクトを生成する関数(本書)である

    Pseudoclassical


    1)コードを記述する.
    const Cat = function(age) {
      this.age = age;
    };
    
    Cat.prototype.old = function() { // 메소드를 프로토타입으로 만든다. ```Object.create```
      this.age += 1;
    };
    3)インスタンスを作成するたびに、newオペレータが追加されます.
    const Yatong = new Cat(3);
    const Marilyn = new Cat(2)