JavaScriptのプロトタイプとプロトタイプチェーン

  • JavaScriptは、各インスタンスオブジェクト(オブジェクト)は、プライベート属性(と呼ばれているプロト)そのプロトタイプオブジェクトのコンストラクタ関数(プロトタイプ)を指します。

  • プロトタイプオブジェクトは、独自のプロトタイプオブジェクト(持つプロトをオブジェクトのプロトタイプがヌルであるまで)層。定義により、無ヌルプロトタイプチェーン内の最後のリンクとしてのプロトタイプ。

  • ほとんどすべてのオブジェクトは、プロトタイプの上の鎖のJavaScriptオブジェクトインスタンスに配置されています。

例のコンストラクタ

// 构造函数 Person()
function Person(name) {
    this.name = name; // 这里 name 是实例属性
}

Person.prototype.name = 'cedric'; // 这里 name 是原型属性
Person.prototype.age = '18';  // 这里 age 是原型属性


Object.prototype.address = 'shanghai';

// 创建一个Person的实例
var person1 = new Person('tom');
person1.name; // tom,  获取实例对象的属性时,如果在实例属性上存在,就直接读取,此时不管原型属性上是否还有相同的属性,这就是属性屏蔽

person1.age; // 18, 没有age的实例属性,所以就去实例的原型上找到age

person1.address; // shanghai, person1的原型Person上也没有找到 address, 所以就去Person的原型Object上面去找到address

person1.sex; // undefined, person1的原型Person上也没有找到 sex, 所以就去Person的原型Object上面去, 也没找到sex

person1.hasOwnProperty('name'); // true

プロトタイプチェーン

JavaScriptは、各インスタンスオブジェクト(オブジェクト)は、そのプロトタイプオブジェクトのコンストラクタ関数(プロトタイプ)を指す(プロトと呼ばれる)のプライベート属性を持っています。プロトタイプオブジェクトが自身のプロトタイプオブジェクト(プロト)を有し、オブジェクトのプロトタイプがヌルになるまでアップ層。定義により、無ヌルプロトタイプチェーン内の最後のリンクとしてのプロトタイプ。

ほとんどすべてのオブジェクトは、プロトタイプの上の鎖のJavaScriptオブジェクトインスタンスに配置されています。

person1 ----> Person.prototype ----> Object.prototype ----> null
person1.__proto__ === Person.prototype;  // true, person1 的原型是:Person.prototype 对象
Person.prototype.__proto__ === Object.prototype;  // true, Person.prototype 的原型是: Object.prototype 对象

constructor

新しい人(で作成されたオブジェクト)は、人物からプロトタイプ受信constructor機能自体人を指す属性を、

Person.prototype.constructor === Person; // true

person1.constructor  === Person; // true

person1.constructor === Person.prototype.constructor; // true

Object.getPrototypeOf()

このメソッドは、Object.getPrototypeOfの返しプロト値を、あなたはプロトタイプオブジェクトを取得することができます

Object.getPrototypeOf(person1) === person1.__proto__; // true
Object.getPrototypeOf(person1) === Person.prototype; // true

hasOwnProperty

メソッドのhasOwnPropertyを、属性インスタンスのプロパティかどうかを決定します

person1.hasOwnProperty('name'); // true
person1.hasOwnProperty('age'); // fasle

instanceofは

特定のコンストラクタかどうかに基づいて、instanceofのインスタンス

person1 instanceof Person;  // true

isPrototypeOf

isPrototypeOf()メソッドは、オブジェクトが別のオブジェクトのプロトタイプであるか否かを判断することができます

Person.prototype.isPrototypeOf(person1); // true

ES6クラス

class Person {
    constructor(name) {
        this.name = name;
    }

    hello() {
        alert('Hello, ' + this.name + '!');
    }
}


// Student 需要name和grade两个参数,需要通过super(name)来调用父类的构造函数,否则父类的name属性无法正常初始化。
// Student 已经自动获得了父类 Student 的 hello 方法,我们又在子类中定义了新的 myGrade 方法。
class Student extends Person {
    constructor(name, grade) {
        super(name);
        this.grade = grade;
    }

    myGrade() {
        console.log('Grade is ', this.grade);
    }
} 

おすすめ

転載: www.cnblogs.com/cckui/p/11459791.html