Dois-je définir «soi», «élément» etc. Au début de chaque fonction dans un widget jQuery

Question

Je crée des widgets jQuery quelque chose comme ça

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

Je finis par déclarer invariablement à déclarer self, options, element Dans chaque fonction que je crée.

Y a-t-il une compréhension financie qui me manque ou dois-je vraiment le faire tout le temps?

Answer 1

Vous n'avez pas du tout à le faire, c'est seulement pour faciliter l'accès à ceux à l'intérieur de la fonction.

La self La variable est utile lorsque vous utilisez un rappel dans une fonction jQuery, où this serait défini sur l'élément sur lequel vous agissez. Par exemple:

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

Les variables o et el fait juste moins de saisie. Si vous avez le Varaible self, ou la référence this inchangé, vous pouvez accéder au options et element Propriétés de l'objet directement.

Answer 2

Vous devez déclarer ces choses à chaque fois car vous utilisez un objet littéral. Vous pouvez envelopper l'objet littéral comme un appel de fonction et réaliser ce que vous voulez de cette façon.

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

Il y a aussi une question qui touche également en utilisant des fonctions dans l'objet littéral ici, mais cela semblait trop verbeux compte tenu de votre question initiale.