我的联盟 作品 招聘 外包 人才  酷站加油 国内 国外 CSS  资源图库 图库 模板 矢量 图标  设计欣赏 界面 LOGO 插画 艺术  网页 平面  专访 名站 竞赛 社区
当前位置:首页 > 网页教程 > HTMLCSS教程 > 正文
提升JavaScript运行速度之函数篇
来源:cuimingda.com 作者:明达 2009年02月25日 11:48 网友评论:0条 点击:

相似的问题还包括过多的递归。每个额外的递归调用都会占用更多的内存,从而减慢浏览器的运行。恼人的是,你可能在浏览器发出脚本失控警告之前,就耗尽了系统的内存,导致浏览器处于停止响应的状态。Crockford在博客上曾经对这个问题进行过深入的讨论。他当时使用的例子,就是用递归生成一个斐波那契数列。

function fibonacci(n) {
return n < 2 ? n: fibonacci(n - 1) + fibonacci(n - 2);
};

按照Crockford的说法,执行fibonacci(40)这条语句将重复调用自身331160280次。避免使用递归的方案之一就是使用memoization技术,这项技术可以获取上一次调用的执行结果。Crockford介绍了下面这个函数,可以为处理数值的函数增加这项功能:

function memoizer(memo, fundamental) {
var shell = function (n) {
var result = memo[n];
if (typeof result !== 'number') {
result = fundamental(shell, n);
memo[n] = result;
}
return result;
};
return shell;
};

接下来将这个函数应用在斐波那契数列生成器上:

var fibonacci = memoizer([0, 1],
function(recur, n) {
return recur(n - 1) + recur(n - 2);
}); 

这时如果我们再次调用fibonacci(40),只会重复调用40次,和原来相比提高得非常多。memoization的原理,概括起来就一句话,同样的结果,你没有必要计算两次。如果一个结果你可能会再次使用,把这个结果保存起来,总比重新计算一次来的快。

最后一个可能让函数执行缓慢的原因,就是我们之前提到过的,函数里面执行了太多的内容,通常是因为使用了类似下面的开发模式:

function doAlot() {
  doSomething(); 
  doSomethingElse(); 
  doOneMoreThing();
}

在这里要执行三个不同的函数,请注意,无论是哪个函数,在执行过程中都不依赖其他的函数,他们在本质是相对独立的,只是需要在一个特定时间逐一执行而已。同样,你可以使用类似chunk()的方法来执行一系列函数,而不会导致锁定浏览器。

function schedule(functions, context) {
setTimeout(function() {
   var process = functions.shift();
   process.call(context);
   if (functions.length > 0) {
       setTimeout(arguments.callee, 100);
   }
},
100);
}

schedule函数有两个参数,一个是包含要执行函数的数组,另外一个是标明this所属的上下文对象。函数数组以队列方式实现,Timer事件每次触发的时候,都会将队列最前面的函数取出并执行,这个函数可以通过下面的方式执行一系列函数:

schedule([doSomething, doSomethingElse, doOneMoreThing], window);

很希望各个JavaScript的类库都增加类似这样的进程处理函数。YUI在3.0时就已经引入了Queue对象,可以通过timer连续调用一组函数。

无论现有的技术可以帮助我们将复杂的进程拆分到什么程度,对于开发者来说,使用这种方法来理解并确定脚本失控的瓶颈是非常重要的。无论是太多的循环、递归还是其他的什么,你现在应该知道如果处理类似的情况。但要记住,这里提到的技术和函数只是起到抛砖引玉的作用,在实际的应用中,你应该对它们加以改进,这样才能发挥更大的作用。

首页 上一页 [1] [2] 下一页 尾页
上一篇:打造自己的Reset.css   下一篇:完美的CSS绝对底部
收藏此页】【打印】【关闭
 相关文章  我要点评
·JavaScript中的对象与函数和继承
·JavaScript优化细节
·让JavaScript拯救HTML5的离线存储
·FF和IE之间7个JavaScript的差异
·javascript修正12个浏览器兼容问题
·JavaScript的私有成员
·说说掌握JavaScript语言的思想前提
·JavaScript图片切换展示效果

免责声明:本站刊载此文不代表同意其说法或描述,仅为提供更多信息,也不构成任何建议。对本文有任何异议,请联络:68design#163.com
转载要求:作者及来源信息必需保留。转载之图片、文件,链接请不要盗链到本站,且不准打上各自站点的水印。



关于我们 | 设计服务 | 广告服务 | 常见问题 | 网站地图 | 法律声明 | 联系我们
Copyright © 2003-2012 68design.net, All Rights Reserve 【找网页设计师,当然上网页设计师联盟】