Плагин jQuery Частные функции внутри Vs. Вне каждой петли

Question

В чем разница между включением частных функций в плагин jQuery в следующих примерах:

Вне цикла:

    (function( $ ){
      var defaults = {};

      $.fn.cmFlex = function(opts) {

        this.each(function() {
            var $this = $(this);
            //Element specific options
            var o = $.extend({}, defaults, opts);

            //Code here
        });

        function f1(){....
        function f3(){....
        function f2(){....

      };
    })( jQuery );

Внутри цикла:

    (function( $ ){
      var defaults = {};

      $.fn.cmFlex = function(opts) {

        this.each(function() {
            var $this = $(this);
            //Element specific options
            var o = $.extend({}, defaults, opts);

            function f1(){....
            function f3(){....
            function f2(){....
        });     


      };
    })( jQuery );

Преимущество включения функций в цикл состоит в том, что я смогу получить доступ к переменной $ this, а также к специфическим для Element опциям из f1 () f2 () f3 (), есть ли у этого недостатки?

Answer 1

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

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

Однако есть одна оговорка. Для их определения внутри функции требуется создавать новое замыкание при каждом запуске функции цикла. В зависимости от того, насколько плотный цикл, это может повлиять на производительность. Моя точка зрения такова: преждевременная оптимизация - это плохо, но имейте это в виду.

К вашему сведению: вот еще один способ сделать это (если вам не нужны переменные замыкания), который позволяет избежать создания замыканий для каждой итерации цикла. Это выглядит немного сложным, так что это не для слабонервных

(function( $ ){
  var defaults = {};

  $.fn.cmFlex = function(opts) {

    this.each((function() {
        function f1(){}
        function f3(){}
        function f2(){}
        // This is the method that will be called for each iteration of the loop. It now
        // has access to f1,f2,f3 but doesn't need to create a closure for each iteration.  
        return function() {
          var $this = $(this);
          //Element specific options
          var o = $.extend({}, defaults, opts);
          f1();
          f2();
          f3();
        };
    })());
  };
})( jQuery );

Answer 2

Если вы не хотите переопределять методы при каждом запуске функции цикла и по-прежнему имеете доступ к этой переменной, вы можете попытаться переместить функции за пределы и вызвать их с помощью метода вызова.

(function( $ ){
  var defaults = {};

  $.fn.cmFlex = function(opts) {
    function f1(){}
    function f3(){}
    function f2(){}

    this.each((function() {

        return function() {
          var $this = $(this);
          //Element specific options
          var o = $.extend({}, defaults, opts);
          f1.call($this);
          f2.call($this);
          f3.call($this);
        };
    })());
  };
})( jQuery );

Answer 3

В итоге я вообще не использовал плагин jQuery и инкапсулировал весь код внутри функции обратного вызова для вызова $ .getJSON.

Вот пример

            $.getJSON('core/cm_json.php', function(options) {
                //Globals
                var defaults = options;

                //Where query is a jQuery query string
                function initialize(query){
                    $(query).each(function(){
                        var $this = this;

                        //Code here

                        function f1(){...
                        function f2(){...
                        function f3(){...
                    })
                }
            });

Answer 4

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