JavaScript之原型和原型链

77 阅读1分钟

原型对象

  • 所有的构造函数上面都有属性prototype(原型对象),而原型对象里面有一个属性constructor指向该构造函数。
  • 通过构造函数new出来的实例上面有一个__proto__属性,实例的__proto__属性指向其构造函数的原型对象。
function User(){

}
let u1=new User()
u1.__proto__==User.prototype   //返回true
  • 构造函数都是通过new Function创建的,所以这些构造函数都是Function的实例(包括Object,Array),Object本质上也是构造函数。比如说var obj=new Object()
Object.__proto__==Function.prototype  //返回true,因为Object是构造函数
Array.__proto__==Function.prototype  //返回true
Date.__proto__==Function.prototype;   //返回true

原型链

  • 原型对象也是一个对象
Function.prototype.__proto__==Object.prototype  //返回true

面试题及解析

function User() {}
User.prototype.sayHello = function() {}
var u1 = new User();
var u2 = new User();
//返回true,都是访问的User.prototype上面的函数sayHello
console.log(u1.sayHello === u2.sayHello);   

//返回function User(){} 
console.log(User.prototype.constructor); 

//返回false  User.__proto__==Function.prototype
console.log(User.prototype === Function.prototype);

//返回true
console.log(User.__proto__ === Function.prototype); 

//返回true  Function.__proto__==Function.prototype
console.log(User.__proto__ === Function.__proto__); 

//返回true  都是指向User.prototype
console.log(u1.__proto__ === u2.__proto__); 

//返回false
console.log(u1.__proto__ === User.__proto__); 

//返回true  因为Object.__proto__==Function.prototype  而 //Function.__proto__==Function.prototype
console.log(Function.__proto__ === Object.__proto__); 

//返回false  原型对象也是一个实例对象
console.log(Function.prototype.__proto__ === Object.prototype.__proto__); 

//返回true
console.log(Function.prototype.__proto__ === Object.prototype); 

总结

所有的构造函数都是Function的实例,包括Object,Function,Array
所有的原型对象都是Object的实例
构造函数原型对象里面的constructor属性指向该构造函数
Object的原型对象的__proto__指向null

Function.prototype==Function.__proto__
Object.__ptoto__==Function.prototype
Function.prototype.__proto__==Object.prototype
Object.prototype.__proto__==null

参考资料(本文例子取自该参考资料)

JavaScript之彻底理解原型与原型链