1、什么是原型
1)定义
JS中,每个实例对象( object )都有一个私有属性(称之为 proto )指向它的构造函数的原型对象(prototype )。该原型对象也有一个自己的原型对象( proto ) ,层层向上直到一个对象的原型对象为 null。根据定义,null 没有原型,并作为这个原型链中的最后一个环节。
JS中的所有引用类型(Object、Array、RegExp、Date、Function)都有__proto__属性,对于引用类型而言原型即为__proto__属性;
var obj = {};
console.log(obj)
var arr =[''];
console.log(arr)
返回结果:
对于JS中的所有函数,原型即为prototype原型对象。构造函数的prototype原型对象本身也自带__proto__属性,指向Object的prototype原型对象。
function fn() {
console.log('22')
}
function Star(uname,age) {
this.uname = uname;
this.age = age;
}
console.log(fn.prototype);
console.log(Star.prototype);
返回结果:
2)关系
对象的__proto__属性指向其构造函数的prototype对象。
function Star(uname,age) {
this.uname = uname;
this.age = age;
}
var per = new Star();
console.log(per.__proto__ === Star.prototype);//true
3)原型的作用
将对象的属性和方法建立在原型这个公共区域中,即可对所有对象实现方法和属性共享,从而实现对象之间的方法与属性的继承。
function Star(uname,age) {
this.uname = uname;
this.age = age;
this.sing = function() {
console.log('sing a song');
}
}
var a = new Star('a',18);
var b = new Star('b',19);
console.log(a.sing === b.sing);//false
function Star(uname,age) {
this.uname = uname;
this.age = age;
}
Star.prototype.sing = function()
{
console.log('sing a song');
}
var a = new Star('a',18);
var b = new Star('b',19);
console.log(a.sing === b.sing);//true
2、什么是原型链
1)原型链定义
在JavaScript中万物都是对象,对象和对象之间也有关系,并不是孤立存在的。对象之间的继承关系,在JavaScript中是通过prototype对象指向父类对象,直到指向Object对象为止,这样就形成了一个原型指向的链条,专业术语称之为原型链。(摘自大佬https://github.com/ljianshu/Blog/issues/18)
2)指向关系
对象的原型属性指向其构造函数的原型对象;
构造函数的原型对象的原型属性指向Object的原型对象;
Object的原型对象的原型属性为null。
见下图。
3)访问机制
当访问一个对象的属性或方法时,会先在对象自身里找,如果有会直接使用。如果没有会在对象__proto__属性指向的构造函数的原型对象prototype中去找,如果有会直接使用。如果还是没有,则继续往构造函数prototype的__proto__属性指向的Object的原型对象prototype里去找,如果有会直接使用,如果没有会返回undefined。
参考:
https://blog.csdn.net/xiaoermingn/article/details/80745117
https://github.com/ljianshu/Blog/issues/18
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Inheritance_and_the_prototype_chain
有不对的地方,欢迎指正。比心