Ассоциирование спрайтов в контейнере - 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); 

В другом файле я создаю 1 экземпляр CLASSA и 3 из ClassB и добавить их все в контейнер:

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, так что мне не нужно, чтобы создать 3 экземпляров ClassB каждый раз я создаю 1 экземпляр CLASSA (в других словах, я хотел бы выполните одну функцию addChild() для каждого экземпляра класса). Это возможно?

Answer 1

Просто убедитесь, что я понимаю, чего вы пытаетесь достичь. Вы в основном хотите переключить функцию container.addChild, которая будет выполняться внутри конструктора, а на следующей строке?

Прежде всего, я бы посоветовал. С моим опытом кодирования я бы советовал не вводить какие-либо реальные функции внутри конструктора. Обычно конструктор должен быть предназначен только для правильной настройки основных переменных и среды (например, вы делаете это сейчас). Потому что, когда вы идете на эту дорогу, вы можете добавлять к конструктору всевозможные вещи, и это не будет лучшим для структуры кода. Если у вас есть несколько вещей, которые нужно позаботиться в конструкторе, вы можете разделить их на некоторую .init-функцию или так далее. Но это всего лишь мое мнение и опыт по организации кода.

Если я помню, «это» ссылка внутри конструктора правильно, Вы должны быть в состоянии сделать это так же, как это:

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, теперь и в будущем (если что-то меняется). Конечно, вы можете просто передать конструктору объект-контейнер тоже, но если объект-контейнер изменится в будущем, вы должны убедиться, что конструктор правильно его обрабатывает.