Нужно ли определять "я", "элемент" и т. Д. В начале каждой функции в виджете JQuery

Question

Я создаю JQuery Widgets что-то вроде этого

<script type="text/javascript">
(function ($) {
        $.widget("cb.bacon", {
            _create: function() {
                var self = this,
                    o = self.options,
                    el = self.element;

                 // Some code

            },

            _bacon: function() {
                var self = this,
                    o = self.options,
                    el = self.element;

                 // Some code
            },

            _smokey: function() {
                var self = this,
                    o = self.options,
                    el = self.element;

                 // Some code
            } 
        });
    })(jQuery);                 
</script>

Я неизменно заканчиваю тем, что должен объявить self, options, element в каждой функции, которую я создаю.

Есть ли какое-то фундаментальное понимание, что я скучаю, или мне действительно нужно делать это все время?

Answer 1

Вам не нужно делать это вообще, это только для того, чтобы облегчить доступ к тем, кто находится внутри функции.

self переменная полезна, когда вы используете обратный вызов в функции jQuery, где this будет установлен на элемент, который вы действуете на. Например:

$('.bacon').each(function(){ $(this).css('background', self.getBackground()); });

Переменные o а также el просто делает для того, чтобы меньше печатать. Если у вас есть varaible selfили ссылка this без изменений, вы можете получить доступ к options а также element свойства от объекта напрямую.

Answer 2

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

<script type="text/javascript">
function makeTheBacon() {
    var self = this;
    var o = self.options;
    var el = self.element;

    self._create = function() {...};
    self._bacon = function() {...};
    self._smokey = function() {...};
    return self;
}

(function ($) {
    $.widget("cb.bacon", makeTheBacon());
})(jQuery);
</script>

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