Prototype Chain

Prototype

JavaScriptのすべてのオブジェクトには、親オブジェクトがあり、接続されています.親オブジェクトはPrototypeと呼ばれます.これにより、親オブジェクトの構成とメソッド(オブジェクト向けプログラミングでの継承概念など)が使用可能になります.

__proto__

オブジェクトを作成すると、__proto__という名前のオブジェクトが同時に作成されます.したがって、すべてのオブジェクトに内部属性__proto__があります.

__proto__親関数のPrototypeを表示します.

オブジェクトの__proto__propertyは、そのオブジェクトを継承する親オブジェクトを指します.オブジェクトは、親オブジェクトのプロパティを使用することもできます.親オブジェクトは__proto__で指定されます.この機能により、Prototype Chainが許可されます.

Prototype Chainingとは、JavaScriptエンジンがPropertyまたはメソッドにアクセスしようとしたときに、オブジェクトに見つかったPropertyまたはメソッドがない場合、__proto__が指すリンクに従って親オブジェクトのプロシージャまたはメソッドを順に参照することを意味します.チェーンの終点はObjectです.プロトタイプ

Constructor

Constructorは、任意のオブジェクトを作成するコンストラクション関数で、最初のアルファベットは大文字で始まります.コンストラクション関数もオブジェクトなので、その値は__proto__propertyです.

コンストラクション関数によって作成されたオブジェクトは、インスタンスを模倣します.instanceを模倣するオブジェクトは関数ではないのでprototypeはありません.

Object.create()

Object.createの最初のパラメータであるPrototypeオブジェクトに基づいてPrototypeを作成します.

var Animal = function Animal(){}

Animal.prototype.eat = function() {
  console.log('먹는중')
}

var Dog = function Dog(){}

Dog.prototype = Object.create(Animal.prototype);
let dog1 = new Dog();
Dog.prototype.sound = function() {
  console.log('왈왈')
}

dog1.sound() // output: '왈왈'
dog1.eat()  // output: '먹는중'
// 이렇게하면 dog1이 자신의 __proto__인 Dog.prototype의 메소드를 사용할 수 있을 뿐더러 Object.create()를
//사용하여 Dog.prototype에 Animal.prototype의 복사본의 메소드를 사용할 수 있게 해두었기때문에 Animal의
//메소드인 eat까지 사용할 수 있게 됩니다.

でもObject.create()の問題はdog 1.__proto__をするとDogが現れるはずですが、Animalが現れます.
Objectのためcreate()を使用してコピーしたコンストラクション関数がAnimalを表示しているためです.
だからDogprototype.constructor = Dog; このようにコンストラクション関数を再設定する必要があります.

extendsとsuper

// Person 이라는 class를 만들고
class Person {
    constructor(name, age, job) {
        this.name = name;
        this.age = age;
        this.job = job;
    }

    whoAmI() {
        console.log(`저는${this.age}살 ${this.name}이고 직업은 ${this.job}입니다.`)
    }
}

class Tom extends Person {}
// extends를 사용하면 Tom이라는 class가 Person의 메소드나 속성을 가져다가 사용할 수 있습니다.

const tom = new Tom('tom', 20, '교사');
tom.whoAmI(); // output: 저는20살 tom이고 직업은 교사입니다.
// tom이라는 인스턴스를 만들어 Person의 whoAmI라는 함수를 실행할 수 있습니다

class Jamie extends Person {
    whoAmI() {
        super.whoAmI(); // super를 사용하면 부모객체의 메소드를 사용할 수 있습니다.
        console.log('취미는 수영입니다'); // 부모객체 메소드를 사용하고 추가로 작성할 수 있습니다.
    }
}

const jamie = new Jamie('jamie', 24, '비서');
jamie.whoAmI(); // output: 저는24살 jamie이고 직업은 비서입니다.
                         //취미는 수영입니다

整理する

Personというコンストラクション関数を作成する場合、プロパティはPrototype(同時に作成されたPerson.Prototypeオブジェクトを指す).
関数を作成すると同時に、Person.コンストラクション関数(Personコンストラクション関数)を指すprototypeという名前のオブジェクトを作成します.このような属性があります.
kimという名前のインスタンスオブジェクトを作成した場合は、__proto__(Person.prototype)を表します.このような属性があります.
最終的には、上位オブジェクトはObjectです.

extends

クラス式に使用して、クラスを他のクラスのサブクラスにします.

super

親オブジェクトを呼び出す関数です.