为什么实例对象调用方法的值不会随原型的改变而改变

看书看到的例子:

var Car = function (wheelCount) {
    this.wheels = wheelCount || 4;
}

Car.prototype.odometer = 0;

Car.prototype.drive = function (miles) {
    this.odometer += miles;
    return this.odometer;
}

var tesla = new Car();

Car.prototype.odometer = 200;

tesla.drive(10) //210

Car.prototype.odometer = 2000;

tesla.drive(10) //220

第二次调用tesla.drive(10)时是220而不是2010,我的理解是因为实例化对象在调用函数以后其内部创建了自己的odometer变量环境就与原型无关了,书上没有说明原因不知道我理解的对不对,还望指教。谢谢。

回复
阅读 3.7k
6 个回答

你的代码

var tesla = new Car();

Car.prototype.odometer = 200;

tesla.drive(10) //210 (经过这次drive,在tesla上创建了odometer属性)

Car.prototype.odometer = 2000;(这个只改了原型)

tesla.drive(10) //220(这个操作的是属性)

这样改一下,因为在原型里面用this.xxx =yyy 赋值,如果不存在会创建对象的属性,下一次再操作原型,显示的就是属性的值,而不是原型上的值。

这是你要的效果

var Car = function (wheelCount) {
  this.wheels = wheelCount || 4;
}

Car.prototype.odometer = 0;

Car.prototype.drive = function (miles) {
  **this.__proto__.odometer** += miles;
  console.log(this.odometer);
};

var tesla = new Car();

Car.prototype.odometer = 200;

tesla.drive(10) //210   

Car.prototype.odometer = 2000;

tesla.drive(10) //2010

你这里的this.odometer是+=,分解之后其实是this.odometer=this.odometer+xx。
也就是this.odometer=this.__proto__.odometer+xx。
所以是取原型的值来设置对象的属性值。

操作的是对象的odometer属性不是原型上的odometer吧

进过2次实验 和 scort的回答。我是这么理解的:
testla没有drive方法,drive是testla原形的方法,所以this指代的是Car
1.首先Car对象是没有odometer属性的;odometer是Car原形的属性,所以第一次调用drive的时候,由于car还没有odometer属性,会读取car原形的odometer,同时会给car生成一个odometer的属性,
2.之后再调用drive由于已经有了odometer属性所以不会再读取car原形的odometer属性了;

clipboard.png
如图你可以发现2次car对象的属性发生了变化,这也是为什么我2次实验结果会有差异的原因

this.odometer += miles;赋值的时候由于本身没有odometer会自身创建一个属性,所以下一次调用的时候就调用自身的odometer是210

drive方法中,this.odometer += miles;语句中的this是实例化对象,即tesla。
你return的也是tesla的odometer属性。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏