数据与Javascript中的继承冲突
Data conflict with inheritance in Javascript
我正试图用JavaScript开发一个lib,但我遇到了继承问题。以下是我尝试做的事情的一个简化示例:
Fruit = function () {
this.colors = [];
}
Lemon = function () {
this.colors.push("yellow");
}
Lemon.prototype = new Fruit();
在这里,我想创建一个类Lemon,继承自一个类Fruit中,每个水果都包含一个颜色列表。
但当我尝试实例化一些柠檬并像这样打印它们的颜色时:
var lemon1 = new Lemon();
console.log(lemon1.colors);
var lemon2 = new Lemon();
console.log(lemon1.colors);
console.log(lemon2.colors);
我得到这个输出:
["yellow"]
["yellow", "yellow"]
["yellow", "yellow"]
所以我可以看到问题是属性"colors"是Lemon对象的每个实例之间共享的一个数组。
如何为每个柠檬实例制作不同的颜色数组,并在Fruit类中进行定义?
像这样:
Fruit = function () {
this.colors = [];
}
Lemon = function () {
Fruit.call(this);
this.colors.push("yellow");
}
Lemon.prototype = Object.create(Fruit);
从Lemon
构造函数调用Fruit
构造函数:Fruit.call(this);
。此外,我们使用Object.create(Fruit)
来创建对象,而不是调用构造函数来创建原型。
运行您的示例将给出具有上述定义的以下内容。
> var lemon1 = new Lemon();
> console.log(lemon1.colors);
[ 'yellow' ]
> var lemon2 = new Lemon();
> console.log(lemon1.colors);
[ 'yellow' ]
> console.log(lemon2.colors);
[ 'yellow' ]
我补充道:
> Object.is(lemon1.colors, lemon2.colors)
false
这表明Lemon
实例的colors
属性值具有不同的Array
s。
相关文章:
- 从控制器继承了隔离的作用域以生成可重用的指令
- Javascript-ID冲突的几率
- 两个指令创建新的继承的和隔离的作用域-元素得到哪个
- 当使用控制器作为语法时,如何从父指令继承属性
- 以jquery方式继承Javascript
- 导致内容安全策略(CSP)冲突错误的本地jquery.js文件
- JavaScript对象不是从原型链继承的
- 使用Object.create()的角度服务继承
- Pg承诺性能提升:在冲突中
- 数据与Javascript中的继承冲突
- Angular ng控制器与ng应用程序冲突
- 返回按钮代码段的Jquery冲突
- JavaScript对象继承问题
- 调试一个简单的jQuery函数;想知道是否与其他代码冲突
- 使用JavaScript和HTML5画布进行冲突检测
- Javascript嵌套函数属性继承
- javascript对象原型与jquery冲突
- jQuery与导航菜单上的mouseover事件冲突.
- 为什么不't htmlCollection从数组继承
- 使用多接口继承的Typescript名称冲突/冲突