如何优化我的 JavaScript 代码？

发布于 2024-11-04 20:34:31 字数 863 浏览 0 评论 0原文

我刚刚创建了一个等待所有图像的 javscript 插件。以下是我当前的源代码。

$.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);
    });


}

它有效，但我有一个担忧。

如您所见，加载回调访问options.id。 $.fn.waitAllImages 和加载回调是两个不同的函数。这是否意味着加载回调会阻止 javascript 车库收集器清理 options.id 变量？

原文

I just created a javscript plugin that waits for all the images. The following is my current source code.

$.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);
    });


}

It works, but I have a concern.

As you see, load callback access options.id. $.fn.waitAllImages and load callback are two different functions. Does that mean load callback prevents javascript garage collector to clean options.id variable?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

牵你手 2024-11-11 20:34:31

垃圾收集详细信息是特定于实现的，但是您的 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);
});

Garbage collection details are implementation-specific, but yes your load function holds a reference to the options variable, so it will be available for the lifetime of that function.

This is rarely a problem in practice, but if it bothers you, you can pass a copy of the values you need instead:

$(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);
});

回复收藏 0 原文

~没有更多了~