Оборачивание элемента DOM внутри объекта JavaScript

Я заметил общий шаблон в написанном мной JavaScript и задумался, существует ли уже шаблон, который определяет что-то подобное как лучшую практику? По сути, это то, как получить элемент DOM и обернуть его / связать с объектом JavaScript. Возьмем этот пример, где вам нужен фильтр в вашем веб-приложении. Ваша страница выглядит так:

<html>
<head></head>
<body>
    <div id="filter"></div>
</body>
</html>

Затем вы должны обернуть элемент следующим образом:

var myFilter = new Filter({
    elem: document.getElementById('filter'),
    prop: 'stacks-test',
    someCallback: function() {
        // specify a callback
    }
});

И код JavaScript (где spec - это объект, переданный конструктору):

var Filter = function(spec) {
    this.elem = spec.elem;
    this.prop = spec.prop;
    this.callback = spec.someCallback;
    this.bindEvents();
};

Filter.prototype.bindEvents = function() {
    var self = this;
    $(this.elem).click(function(e) {
        self.updateFeed();
    };
};

Filter.prototype.updateFeed = function() {
    this.prop; // 'stacks-test'
    this.callback();
    // ...
    // code to interact with other JavaScript objects
    // who in turn, update the document
};

Как называется этот подход, и каковы передовые практики и предостережения?

7
задан ThinkingStiff 17 February 2013 в 03:21
поделиться