¿Necesito definir 'yo', 'elemento', etc. al comienzo de cada función dentro de un widget jQuery

Question

Creo widgets jQuery algo como esto

<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>

Invariablemente termino teniendo que declarar self, options, element en cada función que creo.

¿Hay algún entendimiento fundal de que me falte o realmente tengo que hacerlo todo el tiempo?

Answer 1

No tiene que hacer eso en absoluto, eso es solo para que sea más fácil acceder a los que están dentro de la función.

los self La variable es útil cuando está utilizando una devolución de llamada en una función jQuery, donde this se establecería en el elemento sobre el que está actuando. Por ejemplo:

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

Las variables o y el Solo hace menos tipificación. Si tienes el Varaible self, o la referencia this sin cambios, puede acceder al options y element Propiedades del objeto directamente.

Answer 2

Debe declarar estas cosas cada vez ya que está utilizando un objeto literal. Podrías envolver el objeto literal como una llamada de función y lograr lo que quieres de esa manera.

<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>

También hay preguntas que tocan esto también mediante el uso de funciones en el objeto literal aquí, pero eso parecía demasiado detallado teniendo en cuenta su pregunta original.