原型链
定义
原型链是由原型对象组成,每个对象都有 __proto__
属性,指向了创建该对象的构造函数的原型, __proto__
将对象连接起来组成了原型链.是一个用来实现继承和共享属性的有限的对象链.
- 属性查找机制: 当查找对象的属性时,如果实例对象自身不存在该属性,则沿着原型链往上一级查找,找到时则输出,不存在时,则继续沿着原型链往上一级查找,直至最顶级的原型对象 Object.prototype,如还是没找到,则输出 undefined;
- 属性修改机制: 只会修改实例对象本身的属性,如果不存在,则进行添加该属性,如果需要修改原型的属性时,则可以用: b.prototype.x = 2;但是这样会造成所有继承于该对象的实例的属性发生改变.
prototype
:原型
_proto__
:原型链(连接点)
获取原型
- es5
console.log(person.__proto__)
+ es6
console.log(Object.getPrototypeOf(person))
从属关系
prototype
->函数的一个属性:对象{}
__proto__
->对象 Object 的一个属性:对象{}
对象的__proto__
保存着该对象的构造函数的prototype
原型链
var Person=function(){
this.a=1
}
Person.prototype.b=2
Object.prototype.c=3
var person=new Person()
// 原型链
console.log(person.__proto__===Person.prototype)//true
console.log(Person.prototype.__proto__===Object.prototype)//true
console.log(Object.prototype.__proto__)//null
// 特殊情况
console.log(Object.__proto__===Function.prototype)//true
console.log(Function.__proto__===Function.prototype)//true
//由此得出
console.log(Function.__proto__===Object.__proto__)//true
console.log(person.a)
console.log(person.b)
console.log(person.c)
//属性是否存在
//1.检查是否存在自身而不是原型链
console.log(person.hasOwnProperty('a'))//true
console.log(person.hasOwnProperty('b'))//false
console.log(person.hasOwnProperty('c'))//false
//2.检查是否存在原型链
console.log('a' in person)//true
console.log('b' in person)//true
console.log('c' in person)//true
console.log("------")
console.log(person.constructor==Person)//true
console.log(Person.prototype.constructor==Person)//true
拓展
构造函数,原型和实例关系
- 原型(prototype): 一个简单的对象,用于实现对象的 属性继承.可以简单的理解成对象的爹.在 Firefox 和 Chrome 中,每个 JavaScript 对象中都包含一个
__proto__
(非标准)的属性指向它爹(该对象的原型),可 obj.__proto__
进行访问. - 构造函数: 可以通过 new 来 新建一个对象 的函数.
- 实例: 通过构造函数和 new 创建出来的对象,便是实例. 实例通过
__proto__
指向原型,通过 constructor 指向构造函数.
constructor(指向构造函数)
未修改原型
var Person=function(){
this.a=1
}
var person=new Person()
//此时的constructor
console.log(person.constructor===Person)//true
console.log(person.constructor)
修改了原型
var Person=function(){
this.a=1
}
+Person.prototype={
+ b:2
+ }
var person=new Person()
//此时的constructor
console.log(person.constructor===Person)//false
如何解决,重定向下指向
var Person=function(){
this.a=1
}
Person.prototype={
b:2
+ constructor:Person
}
var person=new Person()
//此时的constructor
console.log(person.constructor===Person)//false
评论区