原型和原型链是js的重要概念,也是面试中经常出现的高频考点,如果你对原型和原型链不够了解,下面将会让你对它有一个深入的理解
1. 首先什么是原型,每个函数都有一个属性叫做prototype,这就是人们常说的原型,一般情况下,prototype是一个Object对象,另外prototype还有一个属性constuctor,它指向构造函数本身。
function test(){
}
console.log(test.prototype.constructor ==test)//true
2.在了解原型链之前还需要了解一个概念叫做隐式原型,所有的对象都有一个隐式原型__proto__,它指向创建该函数的原型
function test(){
}
var obj = new test();//创建对象
console.log(obj.__proto__===test.prototype);//true
obj对象是由test函数创建出来的,所有obj的隐式原型指向构造它的函数test的原型
3.原型链,知道了__proto__的指向,原型链的问题也就迎刃而解了。
obj的__proto__是test函数的原型,而上面我们就知道函数原型一般都是Object对象,所以它也有一个隐式原型Object.prototye,Object.prototye也有隐式原型null.
function test(){
}
var obj = new test();//创建对象
console.log(obj.__proto__.__proto__);//Object.prototye
console.log(obj.__proto__.__proto__.__proto__);//null
向上面这样由隐式原型串联起来的链就叫做原型链。
4.原型链的应用
当我们访问对象成员时,首先看看自身有没有,如果自身没有就会查看它的隐式原型上面有没有,按照原型链一层一层找,直到null为止。
obj的隐式原型等于构造他的函数的原型,知道这一点,如果是新手一定会解决他的一个困扰(反正我以前困扰过)
function test(){
}
var obj = new test();//创建对象
test.prototype.method = function(){
console.log("这是一个方法")
}
obj.method();
控制台打印“这就是一个方法”,说明obj对象能够使用test原型上的方法method,这是为什么呢?而且
function test(){
this.method = function(){
console.log("这是一个方法")
}
创建这样的test函数,在里面添加方法也能够让obj对象使用method方法,但大家常见的都是在原型上添加方法。
原因:
1.obj的原型就是test.prototype,在他身上添加方法,obj能够通过原型链访问,所以能够调用method方法。
2.通过test.prototye.method生成的方法是在原型链上的,每一次通过函数创建对象时不用新创建method方法,只需要调用原型链上的方法就行,能够节省内存空间
function test(){
}
var obj1 = new test();//创建对象
var obj2 = new test();
test.prototype.method = function(){
console.log("这是一个方法")
}
console.log(obj1.method===obj2.method)//true
5.了解上面这些就算是对原型和原型链有个比较全面的了解,下面还有一些细节来帮助你避坑
a.所有对象都是通过new函数创建出来的。
b.所有函数都是对象
c.所有对象都是引用类型
d.Funtion的隐式原型等于Funtion的原型
e.Object原型指向null