javascript - 为什么我的 JavaScript 对象属性会被其他实例覆盖?

标签 javascript oop inheritance

我创建了一个如下所示的对象。

var BaseObject = function(){

var base = this;
base.prop;

base.setProp = function(val){
    base.prop = val;
}
}

当我调用 setProp 方法时,我得到以下信息。

var a = new BaseObject();
var b = new BaseObject();           

a.setProp("foo");
b.setProp("bar");

console.log(a.prop); // outputs 'foo'
console.log(b.prop); // outputs 'bar'

然后我像这样创建了另一个继承自 BaseObject 的对象。

var TestObject = function(){
    // do something
}

TestObject.prototype = new BaseObject();

当我这样做时,我得到了我意想不到的结果。

var a = new TestObject();
var b = new TestObject();

a.setProp("foo");
b.setProp("bar");

console.log(a.prop); // outputs 'bar'
console.log(b.prop); // outputs 'bar'

我不知道为什么。我最近读了很多关于闭包和原型(prototype)继承的文章,我怀疑我把它们都弄糊涂了。因此,将不胜感激任何关于为什么这个特定示例以其方式工作的指示。

最佳答案

只有一个 BaseObject 实例,所有 TestObject 都继承自该实例。不要使用实例来创建原型(prototype)链!

你想要的是:

var TestObject = function(){
    BaseObject.call(this); // give this instance own properties from BaseObject
    // do something
}
TestObject.prototype = Object.create(BaseObject.prototype);

参见 JavaScript inheritance: Object.create vs new , Correct javascript inheritanceWhat is the reason to use the 'new' keyword at Derived.prototype = new Base有关 new 问题的详细说明。也看看 Crockford's Prototypal inheritance - Issues with nested objects

关于javascript - 为什么我的 JavaScript 对象属性会被其他实例覆盖?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13127589/

相关文章:

javascript - 在 Android Webview 中,我可以修改网页的 DOM 吗?

PHP:是否可以像这样访问静态方法:Object::ChildObject::method()?

javascript - 使用 Babel 扩展 Date 类

javascript - 使用 CSS 更改多个元素?

javascript - 我的 Django 应用程序中带有 Javascript 的 Chronometer 脚本

JavaScript 的类 Java 库/框架

javascript - FUNCTIONS 的继承正在成为一场噩梦

java - 为什么这段代码不调用子类? Java 中的继承

php - 来自 PHP 的 time() 的 JavaScript 可读日期/时间

C++ oop 多个链接器错误