理解JS的原型和原型链
1.prototype
在JavaScript中,每个函数都有一个prototype属性,这个属性指向函数的原型对象
function Student(name, age, sex) {
this.name = name;
this.age = age;
this.sex = sex;
}
Student.prototype.sayHi = function () {
console.log('大家好,我是' + this.name);
}
var s1 = new Student('lilei', 18, '男')
s1.sayHi();//输出Student.prototype的方法
当调用对象的属性或者方法的时候,先去找对象本身的属性/方法 ,如果对象没有该属性或者方法。此时去调用原型中的属性/方法
所有引用类型(除了null)的_proto_属性指向它构造函数的prototype
console.log(s1.__proto__ === Student.prototype);//true
//Object.getPrototypeOf(s1)返回对象__proto__指向的prototype
console.log(Object.getPrototypeOf(s1)===Student.prototype)//true
实例之间的关系图
补充
通过Object.create()创建的对象使用第一个参数作为原型
通过对象直接量的对象使用Object.prototype作为原型
通过new创建的对象使用构造函数的prototype属性作为原型
2.constructor
在原型对象中有一个属性constructor 指向该关联的构造函数
console.log(Student.prototype.constructor===Student)//true
s1本身没有 它是从s1.__proto__找到constructor 的
s1.__proto__===Student.prototype
console.log(s1.constructor === Student);//true
var arr = [];
console.log(arr.constructor === Array);//true
3.原型的原型
每个对象都可以有一个原型_proto_,这个原型还可以有它自己的原型,以此类推,形成一个原型链。查找特定属性的时候,我们先去这个对象里去找,如果没有的话就去它的原型对象里面去,如果还是没有的话再去向原型对象的原型对象里去寻找… 这个操作被委托在整个原型链上,这个就是我们说的原型链了。
// Student构造函数的原型对象
var o = s1.__proto__;
console.log(o);// Student.prototype
console.log(o.__proto__);//Object.prototype
var o1 = o.__proto__;
console.log(o1.__proto__);//null