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

问题描述

问 题

看书看到的例子：

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变量环境就与原型无关了，书上没有说明原因不知道我理解的对不对，还望指教。谢谢。

解决方案

你的代码

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

这篇关于javascript - 为什么实例对象调用方法的值不会随原型的改变而改变的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！