WEB开发

JavaScript 原型、原型链与原型继承

2020-01-07  本文已影响0人  情有千千节

原型,原型链与原型继承

用自己的方式理解原型,原型链和原型继承

javascript——原型与原型链

JavaScript中的原型与原型链

JS重点整理之JS原型链彻底搞清楚

基本概念和原型链

  1. Prototype(原型对象)

每个函数都有, 指向其原型对象

  1. _proto_

这是除了null都有的属性, 指向其原型

  1. constructor

每个原型都有, 指向构造函数(函数)

原型链

实例和原型

function Person() {}

Person.prototype.name = 'Kevin';

var person = new Person();

person.name = 'Daisy';
console.log(person.name) // Daisy  实例覆盖原型

delete person.name;
console.log(person.name) // Kevin

在这个例子中,我们给实例对象 person 添加了 name 属性,当我们打印 person.name 的时候,结果自然为 Daisy。但是当我们删除了 person 的 name 属性时,读取 person.name,从 person 对象中找不到 name 属性就会从 person 的原型也就是 person._proto_ ,也就是 Person.prototype中查找,幸运的是我们找到了 name 属性,结果为 Kevin。

如果原型上依然没找到,就会继续到原型的原型上去找直到null为止

原型继承

如果让原型对象等于另一个类型的实例,此时的原型对象将包含一个指向另一个原型的指针(proto),另一个原型也包含着一个指向另一个构造函数的指针(constructor)。

function Animal(){  
    this.type = "animal";  
}  
Animal.prototype.getType = function(){  
    return this.type;  
}  
  
function Dog(){  
    this.name = "dog";  
}  
Dog.prototype = new Animal();  //此步骤为继承 父 中的属性
  
Dog.prototype.getName = function(){  
    return this.name;  
}  s
  
var xiaohuang = new Dog();
//原型链关系  
xiaohuang.__proto__ === Dog.prototype  
Dog.prototype.__proto__ === Animal.prototype  
Animal.prototype.__proto__ === Object.prototype  
Object.prototype.__proto__ === null 
上一篇 下一篇

猜你喜欢

热点阅读