Mosaic Board - Лучшая практика для настройки переменных из конструктора

Question

Я переформатировал этот вопрос, чтобы его было легче понять:

Мозаика :

Я создаю мозаичную доску, которая перемещается и производит различные анимации.

Когда пользователь настраивает плату, он должен передать параметры конструктору, чтобы он мог быть передан другим функциям.Здесь создается новая мозаика и определяются различные параметры, такие как цвет, идентификатор холста, размер плитки и т. Д.

 var grid = new Mosaic("mosaic_canvas", "#000000", 40, 2, 400, ['#FFFFFF', '#5B95D8', '#E66A87']);

 class Mosaic {

      constructor (canvas_id, bg_colour = "#000000", tile_size, tile_border, tile_qty, colours)

 }

Теперь мой вопрос: как я могу передать все эти параметры?файл с легкостью?Например, в классе мозаики есть функция, которая создает сетку и вызывает функцию insertTiles.Есть ли простой способ передать tile_size, tile_border, высоту и ширину холста в эти функции (которые находятся вне класса).Такие вещи, как высота и ширина холста, используют ОЧЕНЬ много, как лучше всего обойти это?

//Inside of the Mosaic Class
this.createGrid = function() {

    insertTiles();

}

this.createGrid();

//Outside of the Mosaic Class
function insertTiles() {
    var x, y;
    for (let i = 0; i < tile_qty; i++) {
        x = (tile_size + tile_border) * Math.floor(Math.random() * (canvas_width / tile_size)),
        y = (tile_size + tile_border) * Math.floor(Math.random() * (canvas_height / tile_size)),
        console.log("fff");
        tiles.push(newTile(x, y, colours));
    }
}

Answer 1

Так что теперь, чтобы ответить на ваш актуальный вопрос:

Это не так, как работает объектно-ориентированное программное обеспечение.

Если вы собираетесь использовать объектно-ориентированные методы (и это кажется разумным для этогоиспользуйте тот случай, который вам следует) тогда эти данные принадлежат объекту.Кажется, вы хотите иметь возможность использовать данные, переданные конструктору объекта в других функциях того же модуля.Этими функциями должны быть методы класса Mosaic , иначе вы должны использовать совершенно другой подход.

Для вспомогательной проблемы, связанной с слишком большим количеством параметров, в динамических языках, таких какJavaScript просто передает структуру данных ключ / значение, как объект JavaScript:

class Mosaic {
    // here we'll use ES 6 destructuring to pull out the properties we
    // care about from the passed-in object
    constructor ({
        canvas_id, 
        bg_colour = "#000000", // default arguments still work
        tile_size, 
        tile_border, 
        tile_qty, 
        colours
    }) {
        this.tiles = []; // tiles should be a property
        this._canvas = document.getElementById(canvas_id);
        this._tile_size = tile_size;
        // etc etc
    }
}

// note that now we're passing in an object with named properties,
// don't need to remember which is where (less error-prone).
var grid = new Mosaic({canvas_id: "mosaic_canvas", tile_size: 40, /* etc */});

для вашей insertTiles функции, просто сделайте метод класса:

// in class Mosaic definition
insertTiles () {
    var x, y;
    for (let i = 0; i < this.tile_qty; i++) {
        x = (this._tile_size + this._tile_border) * Math.floor(Math.random() * (this._canvas_width / this._tile_size)),
        y = (this._tile_size + this._tile_border) * Math.floor(Math.random() * (this._canvas_height / this._tile_size)),
        console.log("fff");
        this.tiles.push(newTile(x, y, this._colours));
    }
}

Youможет внести некоторые изменения в это (например, плитки не обязательно должны быть «публичными»), но, вообще говоря, именно так мы поступаем в JS-стране.

Answer 2

Надеюсь, это имеет смысл

Эх, не совсем, ничего из того, что кто-то должен делать на самом деле, и кажется, что ваш мыслительный процесс пошел "возможно, я могу использоватьX, чтобы решить проблему Y, но я не знаю, как сделать X в контексте Y, поэтому я спрошу SO о X, но почти не упоминаю Y ".

Вам действительно нужен Z.

Это не обязательно ответ, потому что не ясно, каков ваш настоящий вопрос, но он слишком длинный для комментария.

Чтобы ответить на ваш вопрос самым простым из возможных способовпросто создайте именованные переменные и передайте их конструктору:

var number = 1;  // everybody can see me
var number2 = 4; // me too

class Foo {
  constructor (blah, blah2) {
    ...
  }
}

const foo = new Foo(number, number2);

Обратите внимание, однако, что, учитывая, что не совсем понятно, зачем вообще нужен класс или почему значения имеют глобальную видимость, в которой они нуждаютсябыть параметрами этого конкретного класса, или почему вы просто не делаете их общедоступными свойствами создаваемого экземпляра.

Чего вы на самом деле пытаетесь достичь здесь?