在容器中关联精灵 - Pixi.js

Question

假设我有 2 个相似的类：

//one class
    function classA() {
    var texture = PIXI.Texture.fromImage("someImage");
    PIXI.extras.TilingSprite.call(this, texture, 224, 219);

    this.position.x = 0;
    this.position.y = 0;
    this.tilePosition.x = 0;
    this.tilePosition.y = 0;
    }

    classA.constructor = classA;
    classA.prototype = Object.create(PIXI.extras.TilingSprite.prototype);

//another class
    function classB() {
    var texture = PIXI.Texture.fromImage("anotherImage");
    PIXI.extras.TilingSprite.call(this, texture, 36, 42);

    this.position.x = 0;
    this.position.y = 0;
    this.tilePosition.x = 0;
    this.tilePosition.y = 0;
    }

    classB.constructor = classB;
    classB.prototype = Object.create(PIXI.extras.TilingSprite.prototype);

在另一个文件中，我从 classB 创建了 1 个 classA 和 3 个实例，并将它们全部添加到容器中：

container = new PIXI.Container();
renderer = PIXI.autoDetectRenderer(224, 219, {view:document.getElementById("some-canvas")});

a = new classA();
container.addChild(a);
b1 = new classB();
container.addChild(b1);
b2 = new classB();
container.addChild(b2);
b3 = new classB();
container.addChild(b3);

我想以某种方式将 classB 关联到 classA，这样我就不需要在每次创建 1 个 classA 实例时创建 3 个 classB 实例（换句话说，我想执行一个 addChild() 函数每个类实例化）。这可能吗？

Answer 1

只是想确保我了解您想要实现的目标。您基本上想切换 container.addChild 函数以在构造函数中完成，而不是在下一行？

首先我会反对它。以我的编码经验，我建议不要将任何真正的功能放在构造函数中。通常构造函数应该只是用于正确设置基本变量和环境（就像你现在正在做的那样）。因为当你走这条路时，你可以将各种各样的东西添加到构造函数中，它不会是代码结构的最佳选择。如果您在构造函数中有很多事情需要处理，您可以将它们分隔为一些 .init-function 左右。但这只是我对代码组织的看法和经验。

如果我正确地记得构造函数中的“this”引用，你应该可以这样做：

addChildFunction = container.addChild.bind(container);
var a = new classA(addChildFunction);
var a2 = new classA(addChildFunction);

让构造函数接收函数作为参数：

function classA(addChild) {
    var texture = PIXI.Texture.fromImage("someImage");
    PIXI.extras.TilingSprite.call(this, texture, 224, 219);

    this.position.x = 0;
    this.position.y = 0;
    this.tilePosition.x = 0;
    this.tilePosition.y = 0;
    addChild(this);
}

我为什么建议使用 .bind，是因为如果容器对象将来发生变化，它应该会给你更多的灵活性。如果您传递构造函数容器对象，则容器必须始终具有 .addChild 方法，现在和将来（如果发生变化）。当然你也可以直接把容器对象传递给构造函数，但是如果容器对象以后发生变化，你必须确保构造函数正确处理它。