TIL # 2022.01.17

6171 ワード

Javascript # prototype


📝今日習った内容


Javascriptは、オブジェクトを継承するためにプロトタイプと呼ばれる方法を使用します.したがってJavascriptもプロトタイプベースの言語です.プロトタイプベースの言語とは、すべてのオブジェクトが継承方法と属性としてプロトタイプオブジェクトを持つテンプレートです.
正確には、継承されたプロパティおよびメソッドは、各オブジェクトの成長プロトタイプではなく、プロパティに定義されます.
class Human {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  sleep() {
    console.log(`${this.name}은 잠에 들었습니다`);
  }
}

let kimcoding = new Human('김코딩', 30);

// 실습해보세요
Human.prototype.constructor === Human; // true
Human.prototype === kimcoding.__proto__; // true
Human.prototype.sleep === kimcoding.sleep; // true
Personクラスを定義し、person 1というインスタンスを作成します.
class Person {
  // 속성과 메소드 정의
  constructor(first, last, age, gender, interests) {
  this.first = first;
  this.last = last;
  this.age = age;
  this.gender = gender;
  this.interests = interests;
  }
}

let person1 = new Person('Harry', 'Kane')
person()で定義されたperson 1のプロトタイプオブジェクトのメンバー-年齢、性別、興味が上に表示されます.さらに、-watch、valueOfなどの他のメンバーも、Person()のプロトタイプオブジェクトObjectで定義されています.これはプロトタイプチェーンが機能する証拠です.すなわち,person 1はPerson classの属性と方法を持つので,person 1である.コンソールウィンドウに入力すると、そのような画像が表示されます.

では、person 1がObjectで定義したメソッドを呼び出すとどうなるか見てみましょう.
person1.valueof()
コンソールウィンドウでこの操作を実行すると、
  • ブラウザは、person 1オブジェクトにvalueof()メソッドがあるかどうかを最初にチェックします.
  • 確認後、ない場合はperson 1のprototypeオブジェクト(Person()作成者のprototype)にvalueOf()メソッドがあるかどうかを確認します.
  • もここにはないので、Person()作成者のプロトタイプオブジェクト(オブジェクト()作成者のプロトタイプ)にvalueOf()メソッドがあるかどうかを確認して呼び出す.