如何優化我的JavaScript代碼？

我剛剛創建了一個等待所有圖像的javscript插件。以下是我目前的源代碼。如何優化我的JavaScript代碼？

$.fn.waitAllImages = function(options){ 

    var defaults = { 
     speed: 900 
    } 

    var options = $.extend(defaults,options); 


    var preloader = $("<div/>"); 
    preloader.addClass('moonsPreloader'); 
    preloader.attr("id",options.id+"-preloader"); 


    var hideWrapper = $("<div/>"); 
    hideWrapper.attr("id",options.id+"-hide-wrapper"); 
    hideWrapper.css("display","none"); 

    $(this).wrapAll(hideWrapper); 

    $("body").append(preloader); 

    $(window).bind('load',function(){ 
     $("#"+options.id+"-preloader").remove(); 
     $("#"+options.id+"-hide-wrapper").eq(0).fadeIn(options.speed); 
    }); 


}

它有效，但我有一個問題。

如您所見，加載回調訪問選項.id。 $.fn.waitAllImages和加載回調是兩種不同的功能。這是否意味着加載回調阻止JavaScript的車庫收藏家清理options.id變量？

來源

2011-05-03 Moon

檢查我的[waitForImages]（https://github.com/ alexanderdickson/waitForImages）插件。 – alex 2011-05-03 04:38:42

@alex //哈哈很有趣。我有一個名字叫亞歷克斯的同事。感謝您的插件。我決定使用你的。 – Moon 2011-05-03 04:40:31

讓我知道它適合你:) – alex 2011-05-03 04:41:02

垃圾收集詳細信息是特定於實現的，但是您的load函數擁有對options變量的引用，所以它將在該函數的生命週期中可用。

這是很少在實踐中的問題，但如果你煩惱，你可以通過值的副本，你需要來代替：

$(window).bind('load', { id: options.id, speed: options.speed }, function(event){ 
    $("#"+event.data.id+"-preloader").remove(); 
    $("#"+event.data.id+"-hide-wrapper").eq(0).fadeIn(event.data.speed); 
});

來源

2011-05-03 04:36:16

//謝謝你的簡單，但詳細的答案。是的，這在實踐中很少成爲問題。我想通過提出一個只涉及幾個變量的問題來得到一個想法。我從來沒有見過{id：options.id，speed：options.speed} function（event）{}語法。謝謝你！學到了！ – Moon 2011-05-03 04:37:52

如何優化我的JavaScript代碼？

回答

相關問題