closure_caveat.js

// 朋友分享的闭包的坑,我保存一份学习
// closure caveat

// case 1
;(function (window, $, undefined) {
  var $target;

  function howdy() {
    var x = 'foo';

    if (!$target) {
      $target = $({})
        .on('whatever', function () {
          console.log(x);
        })
        .on('soga', function () {
          x = 'bar';
        });

      $target.triggerHandler('soga');
    }

    $target.triggerHandler('whatever');
  }

  howdy();
  howdy();
})(this, jQuery);

// case 2
;(function (window, $, undefined) {
  var $target, x;

  function howdy() {
    x = 'foo';

    if (!$target) {
      $target = $({})
        .on('whatever', function () {
          console.log(x);
        })
        .on('soga', function () {
          x = 'bar';
        });

      $target.triggerHandler('soga');
    }

    $target.triggerHandler('whatever');
  }

  howdy();
  howdy();
})(this, jQuery);

// case 3
;(function (window, $, undefined) {
  var $target;

  function howdy() {
    var x = 'foo';

    if (!$target) {
      $target = $({}).on('soga', function () {
        x = 'bar';
      });
    }

    $target
      .off('whatever')
      .on('whatever', function () {
        console.log(x);
      });

    $target.triggerHandler('soga');
    $target.triggerHandler('whatever');
  }

  howdy();
  howdy();
})(this, jQuery);

// case 4
;(function (window, $, undefined) {
  var $target, x;

  function howdy() {
    x = 'foo';

    if (!$target) {
      $target = $({}).on('soga', function () {
        x = 'bar';
      });
    }

    $target
      .off('whatever')
      .on('whatever', function () {
        console.log(x);
      });

    $target.triggerHandler('soga');
    $target.triggerHandler('whatever');
  }

  howdy();
  howdy();
})(this, jQuery);

看了半天，没看懂。