@likejavascript

Как реализовать возможность использования «плагинов» для JS классов?

Для реализации наследования в JS в своем приложении использую паттерн предложенный John Resig Simple JavaScript Inheritance

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

Вот например как можно было бы реализовать эти возможности при использовании наследования классов:
var Paginated = Table.extend({
    page: 5,
    firstPage: 0,
    perPage: 30,

    init: function(){
       this._super( false );
    },

    setPage: fucntion (page) {
          .....
    },
});

var Draggable = Table.extend({
  
    init: function(){
       this._super( false );
    },

    dragColumn: fucntion (column, toIndex) {
          .....
    },
});

var Editale = Table.extend({
  
    init: function(){
       this._super( false );
    },

    editCell: fucntion (cell) {
          .....
    },
});

Одним словом каждый плагин представляет собой некую абстракцию, которая добавляет/дополняет/меняет методы базового класса таблицы для достижения необходимого результата. Вроде все хорошо, но есть проблема в описании того, какие плагины должны использоваться для определенных типов таблиц. Например, мне нужна таблица, которая имеет только пагинацию и возможность редактирования ячеек, делаю так:
var TablePgn = Paginated.extend({});
   var TablePgnEdit= TablePgn.extend({});

   var table = new TablePgnEdit();


Как видно из кода выше для того чтобы реализовать желаемое мне нужно создать цепочку классов из желаемых плагинов, а что если плагинов будет много?

Мне хотелось бы реализовать так, чтобы я мог при создании таблицы указывать какие плагины ей нужно использовать (также передавать конфиг), например так:
var tale = new Table({
          "plugins": [
           {
               "paginated": {
                    "page": 5,
                    "perPage": 30,
                },
               "editable": {
                }
           }
       ]
    });


Мне кажется так выглядит более гибко и правильно, однако не знаю как лучше это реализовать для паттерна "Simple JavaScript Inheritance", подскажите как бы вы это сделали? Может нужно сам Class как-то переписать? В общем будет интересно услышать ваше мнение.
  • Вопрос задан
  • 2557 просмотров
Пригласить эксперта
Ответы на вопрос 1
@personaljs
похоже на backbone синтаксис, попробуйте посмотрите как сделано здесь

Конфиг получается аналогичным
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы