Javascript 菱形继承结构

标签 javascript inheritance

使用节点但在 JavaScript 中寻找绕过菱形继承的方法:

var util = require('util');

function Base(example_value) {
  console.log(example_value);
  this.example_property = example_value;
  this.example_method = function() { ... };
}

function Foo(settings) {
  var f = settings.f;
  Base.call(x);
  this.settings = settings;
}

util.inherits(Foo, Base);

function Bar(settings) {
  var b = settings.b;
  Base.call(b);
  this.settings = settings;
}

util.inherits(Bar, Base);

var foo = new Foo({f: 'bar'});
// 'bar' gets printed and I can call methods from Base..
foo.example_method();
var bar = new Bar({b: 'foo'});
// 'foo' gets printed and I can call methods from Base..
bar.example_method();

这里没有问题..但是我需要在另一个包罗万象的对象中制作 Foo 和 Bar(和 Base)中可用的所有内容:

function Top(settings) {
  Foo.call(this, settings);
  Bar.call(this, settings);
}

util.inherits(Top, Foo);
util.inhertis(Top, Bar);

var top = new Top({some: 'value'});

'value' 被打印了两次,这不是我想要的。像这样进行继承可能不是最好的方法,因此寻找替代方案/建议来处理这种菱形结构。

附言没有包括原始代码,但进行了修改以希望简化 - 我已经手工完成了这个,不要认为有任何错误,但我试图传达的要点应该在那里。

最佳答案

你能使用委托(delegate)吗?

function Top(settings) {
  this.foo = new Foo(settings);
  this.bar = new Bar(settings);
}

Top.prototype.conflictingMethod = function() {
   // use either this.foo or this.bar
}
Top.prototype.anotherMethod = function() {
   return this.foo.anotherMethod();
}

你也可以使用 mixins,但你需要将它添加到你的类系统中。 Ext-JS 支持混合 http://www.sencha.com/learn/sencha-class-system

// My/sample/CanSing.js
Ext.define('My.sample.CanSing', {
    sing: function(songName) {
        alert("I'm singing " + songName);
    }
});

// My/sample/CanPlayGuitar.js
Ext.define('My.sample.CanPlayGuitar', {
    playGuitar: function() {
        alert("I'm playing guitar");
    }
});

// My/sample/CanComposeSongs.js
Ext.define('My.sample.CanComposeSongs', {
    composeSongs: function() {
        alert("I'm composing songs");

        return this;
    }
});

// My/sample/CoolGuy.js
Ext.define('My.sample.CoolGuy', {
    extend: 'My.sample.Person',
    mixins: {
        canSing: 'My.sample.CanSing',
        canPlayGuitar: 'My.sample.CanPlayGuitar'
    }
});

// My/sample/Musician.js
Ext.define('My.sample.Musician', {
    extend: 'My.sample.Person',
    mixins: {
        canSing: 'My.sample.CanSing',
        canPlayGuitar: 'My.sample.CanPlayGuitar',
        canComposeSongs: 'My.sample.CanComposeSongs'
    }
});

// app.js
var nicolas = new My.sample.CoolGuy("Nicolas");
nicolas.sing("November Rain"); // alerts "I'm singing November Rain"

关于Javascript 菱形继承结构,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16526830/

相关文章:

javascript - 使用 HTML5 和 JavaScript 进行碰撞检测的最佳方法?

javascript - 我如何使用 intellij 在 javascript 中更漂亮的模板文字

iPhone - 当 [super init] 失败时使用 self = [super init]

c# - 基类中的虚拟方法使用子类中的静态变量

c# - C# 中创建 "case classes"的最佳实践/习语

javascript - 如何向 Observable 订阅返回的 Disposable 添加 Action 函数?

javascript - 如果只有一张图像,请禁用 Royalslider 中的项目符号

java - 如何从 Java 中的父类(super class)方法获取子类值?

python - 如何根据参数指定调用哪个__init__?

javascript - 为什么在 Div 中重复添加新元素时得到 `HierarchyRequestError`?