Javascriptの変な変数がイベント関数内でヌルになる

Question

私はjsで何か変わったことを目撃しました。ここではケーススタディです：これは罰金、私はopenModal()を呼び出す初めての作品

var openModal = function() { 

    ... 

    var pgwSlider = $('.initPgwSlider').pgwSlider(); 

    $('#bootstrap-modal').on('shown.bs.modal', function() { 
     pgwSlider.reload(); 
    }); 
    $('#bootstrap-modal').on('hidden.bs.modal', function() { 
     pgwSlider.destroy(); 
     pgwSlider = null; 
    }); 

    $('#bootstrap-modal').model({ 
     show: true 
    }); 

} 

。
しかし、私はopenModal()を呼び出すようにしようと二度目は...私はpgwSliderを取得するには、ここで、nullである：全体の機能openModal()が実行されているので

pgwSlider.reload(); 

これはpgwSliderがインスタンス化されることを意味し、通常は発生しませんもう一度。

これはメモリリークのようなものですか？

Answer 1

問題は、あなたがopenModal呼び出すたびにあなたが'shown.bs.modal'と'hidden.bs.modal'にイベントリスナーを付けるので、二度目openModalの実行とオープンが再び同じモーダルは、それが2回'shown.bs.modal'を発射することである：一度最初の取り付けのため、一度のために現在のもの。しかし、最初のpgwSliderあなたは2つの方法でこれを避けることができる最初の'shown.bs.modal'

で宣言されているように、今nullです：イベント http://api.jquery.com/one/に一つだけの時間を添付する

使用.one、それは一度だけ

イベントリスナーを発射します

$('#bootstrap-modal').one('shown.bs.modal' ... 
$('#bootstrap-modal').one('hidden.bs.modal' ... 

または.offhttp://api.jquery.com/off/

を使用して（あなたは、ブートストラップの時にのみモーダルを持つことができるという事実のように）近いモーダル上のリスナーを切り離しますメモリリークについて

$('#bootstrap-modal').on('hidden.bs.modal', function() { 
    pgwSlider.destroy(); 
    pgwSlider = null; 
    $('#bootstrap-modal').off('hidden.bs.modal') 
    $('#bootstrap-modal').off('shown.bs.modal') 
}); 

：それはメモリリークのいくつかの種類ですが、あなたは

$('#bootstrap-modal').off('hidden.bs.modal') 
$('#bootstrap-modal').off('shown.bs.modal')