5
回答
Javascript setInterval 导致页面内存急剧增长
利用AWS快速构建适用于生产的无服务器应用程序,免费试用12个月>>>   

    作为一个Web前端开发小白的我,今天在写一个管理后端数据库的简单页面的时候遇到了一个棘手的问题.

我想在页面添加一个定时检查输入的指令是否有错的功能.所以在页面的body内的script内添加了这样一行代码:

setInterval(updateFormat,1000);
//其中的updateFormat是我定义在同一个script标签下的用JQuery更新一个div内的提示内容的函数
    结果我在测试页面大约2min内,我用Chrome自带的任务管理器查看时发现这个页面的"内存"那一栏已经以每秒2~3mb的速度急剧增长.

    然后,我又修改了一下代码:

setInterval("updateFormat()",1000); //其中的updateFormat是我定义在同一个script标签下的用JQuery更新一个div内的提示内容的函数
    结果还是发现页面的内存占用还是以200~300kb的速度增长.

    再贴出updateFormat中的代码缩减版给你们看看:

function updateFormat(){
    $('#check_input pre').text($('#input_content').val());
}
    所以求大神指点指点.为什么加了一个 setInterval就会使得页面内存持续上升(而且很多在线聊天的网站应该也用了 setInterval的呀,为什么它们的就不会出现这种事),谢谢!

举报
刘越
发帖于2年前 5回/2K+阅
共有5个答案 最后回答: 2年前
function time(f, time) {
    return function walk() {
        setTimeout(function () {
            f();
            walk(); 
        }, time);
    };
}

time(updateFormat, 1000)();



引用来自“jQer”的评论

function time(f, time) {
    return function walk() {
        setTimeout(function () {
            f();
            walk(); 
        }, time);
    };
}

time(updateFormat, 1000)();



你的意思是不是这样:

function walk(f,time){
	setTimeout(function(){f();walk();},time);
}
walk(updateFormat,1000);



这个和我那个有什么不同的地方呢?不是很明白.

你这个像是递归,我那个像是定时调用函数.

能不能在详细一点说,谢谢

--- 共有 3 条评论 ---
jQer回复 @刘越 : 这是个延迟递归,walk(f, time),一段时间后,内部再次调用walk(f, time)。你的代码没有对f time保存,所以每次调用walk()需要传递参数f, time。而我的则对f, time进行了保存(闭包)。 2年前 回复
刘越回复 @jQer : 感觉还是不太明白,为什么我原来那个代码每次都会复制一次呢?谢谢(P.s.原谅我是WEB前端的小白) 2年前 回复
jQer你的写错了,应该是 function walk(f,time){ setTimeout(function(){f();walk(f,time);},time); } walk(updateFormat,1000); 每次调用walk(f, time),你的都要复制一次 f 和 time,而我的则只复制一次。 2年前 回复
顶部