Как обработать несколько экземпляров в одном классе в плагине? - PullRequest
0 голосов
/ 02 апреля 2019

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

Это синтаксис класса, который у меня есть до сих пор

(function(window) {

    function handle(element, options) {
        let handles = [];
        if (element.length) {
            for (var i = 0; i < element.length; i++) {
                handles.push(new Plugin(element[i], options));
            }
        } else {
            handles.push(new Plugin(element, options));
        }
        return handles;
    }

    class Plugin {
        constructor(element, options) {
            this.element = element;
            this.init();
        }

        init() {
            //get its translated value
            this.methodA();

            //apply its translation even if not visible for the first init
            this.methodB();
        }

        methodA() {
            this.element.classList.add('test');
        }

    }

    return handle;
});

Я хотел бы избавиться от этой функции дескриптора.Как можно создать экземпляр плагина для каждого элемента?и чтобы иметь возможность иметь classPlugin на верхнем уровне без необходимости этой функции дескриптора.

Я не вижу другого способа, как наличие нескольких экземпляров класса, потому что каждый экземпляр получает определенную информацию для каждогоизображение (высота, смещение и т. д.).Может быть, я упускаю что-то очевидное здесь ...

1 Ответ

0 голосов
/ 02 апреля 2019

Вы не можете на самом деле создать экземпляр класса без цикла. Вы можете попробовать eval. Но это не рекомендуется. Это плохая практика. Теперь позвольте мне объяснить, почему это невозможно. JavaScript не имеет классов и экземпляров, он имеет только объекты, которые могут делегировать другим объектам.

Чтобы создать два объекта на основе одного объекта, но за кулисами на самом деле не существует двух «экземпляров» объекта Point, есть только два объекта, делегирующих исходный. Когда вы используете new, JavaScript фактически просто создает объект и присваивает его прототип объекту, возвращаемому функцией конструктора. Представьте, что пример был расширен, чтобы включить общий метод, подобный этому:

function Point(x, y) {
    this.x = x;
    this.y = y;
}

Point.prototype.logCoords = function () {
    console.log(this.x, this.y);
};

var a = new Point(1, 2);
console.log(a.x); // logs '1'
a.logCoords(); // logs '1 2'

За кулисами происходит нечто вроде этого:

var Point = function (x, y) {
    this.x = x;
    this.y = y;
};

Point.prototype.logCoords = function () {
    console.log(this.x, this.y);
};

var a = {};
a.__proto__ = Point.prototype; // see note below about this
a.constructor = Point;
a.constructor(1, 2);

console.log(a.x); // logs '1'
a.logCoords(); // logs '1 2'
...