《JavaScript高级程序设计》的学习笔记
引用的是阮一峰老师的课程:《JavaScript 标准参考教程(alpha)》http://javascript.ruanyifeng.com/oop/prototype.html
constructor属性表示原型链和构造函数的关联,如
构造函数:
//构造函数Person
function Person(name) {
this.name = name;
}
构造函数的prototype属性指向了它的原型对象,即Person.prototype,原型对象自动获得一个constructor属性,该属性指向了构造函数Person.
所以,如果修改了原型对象,那么原型对象的constructor属性就会同时被修改,以防止引用出错。
//构造函数Person()
function Person(name) {
this.name = name;
}
//构造函数的原型对象添加方法sayName()
Person.prototype.sayName = function() {
alert(this.name);
};
//修改构造函数的原型对象为一个Object对象。
Person.prototype = {
method: function() {}
};
var p1 = new Person("张三");
p1.sayName();//报错Uncaught TypeError: p1.sayName is not a function
这里,首先新建了一个构造函数Person(),然后为为该构造函数的原型对象新添了方法sayName(),接着,修改了该构造函数的原型对象,该对象是一个Object对象,该Object对象的constructor属性指向的是Object()构造函数,而不是Person()构造函数,所以,当构造函数Person()的实例调用sayName()方法时,因为该实例本身没有该方法,所以它向它的原型对象进行搜索,它的原型对象为一个Object()对象,该对象显然没有sayName()方法。也就是说,该实例和Person()之前的原型对象没有了联系,之前的原型对象的方法也就不能被查询到。
所以,修改原型对象时,一般要同时修改construtor属性的指向。
//避免这种写法
Person.prototype = {
mathod1: function() {}
}
//较好的写法
Person.prototype = {
constructor: Person,
method2: function() {}
}
//更好的写法
Person.prototype.method3 = function() {}
题外话,如果确实想使用之前原型对象的方法sayName(),可以将之前的原型对象用变量保存起来,然后修改实例的proto属性值为保存之前原型对象的变量。
//构造函数Person()
function Person(name) {
this.name = name;
}
//构造函数的原型对象添加方法sayName()
Person.prototype.sayName = function() {
alert(this.name);
};
//保存一开始的Person的原型对象
var initialPersonPrototype = Person.prototype;
//修改构造函数的原型对象为一个Object对象。
Person.prototype = {
method: function() {}
};
var p1 = new Person("张三");
//修改当前实例的__proto__属性值为之前的原型对象,也就是说将当前实例的原型对象指向了之前的原型对象。
p1.__proto__ = initialPersonPrototype;
p1.sayName();