巧用局部变量提升javascript性能

 更新时间:2014年02月24日 15:44:36   作者:  
巧用局部变量可以有效提升javascript性能,下面有个不错的示例,大家可以参考下
javascript中一个标识符所在的位置越深,它的读写速度也越慢。因此,函数中读写局部变量总是最快的,而读写全局变量通常是最慢的。一个好的经验法则是:如果某个跨作用域的值在函数中被引用一次以上,那么就把它存储到局部变量里。

例如:
复制代码 代码如下:

<!-- 优化前 -->
<script type="text/javascript">
function initUI () {
var bd = document.body,
links = document.getElementByTagName("a"),
i=0,
len=links.length;
while(i < len){
update(links[i++]);
}

document.getElementById("go-btn").onclick = function(){
start();
}

bd.className = "active";
}
</script>

该函数引用了三次document,而document是个全局对象。搜索该变量的过程必须遍历整个作用域链接,直到最后在全局变量对象中找到。你可以通过以下方法减少对性能的影响:先将全局变量的引用存储在一个局部变量中,然后使用这个局部变量代替全局变量。

例如:
复制代码 代码如下:

<!-- 优化后 -->
<script type="text/javascript">
function initUI () {
var doc=document,
bd = doc.body,
links = doc.getElementByTagName("a"),
i=0,
len=links.length;
while(i < len){
update(links[i++]);
}

doc.getElementById("go-btn").onclick = function(){
start();
}

bd.className = "active";
}
</script>

相关文章

  • 写js时遇到的一些小问题

    写js时遇到的一些小问题

    写js时遇到的一些小问题,需要的朋友可以参考下。
    2010-12-12
  • JavaScript中的Error错误对象与自定义错误类型详解

    JavaScript中的Error错误对象与自定义错误类型详解

    Error是JavaScript中最原始的错误对象,作为各种异常的基础对象,还有多个衍生的具体的错误类型,这些错误对象类型在nodejs中也可应用,这篇文章主要介绍了JavaScript中的Error错误对象与自定义错误类型,需要的朋友可以参考下
    2022-12-12
  • JS实现div内部的文字或图片自动循环滚动代码

    JS实现div内部的文字或图片自动循环滚动代码

    在某些情况下需要这样的功能:使用JS实现div内部的文字或图片自动循环滚动,接下来为大家详细介绍下实现方法,感兴趣的朋友可以参考下哈
    2013-04-04
  • js的for in循环和java里foreach循环的区别分析

    js的for in循环和java里foreach循环的区别分析

    这篇文章主要介绍了js的for in循环和java里foreach循环的区别,实例分析了js的for in循环使用技巧并说明了与Java中foreach循环的使用区别,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-01-01
  • 原生js实现网页顶部自动下拉/收缩广告效果

    原生js实现网页顶部自动下拉/收缩广告效果

    本文主要介绍了原生js实现网页顶部自动下拉/收缩广告效果的实例代码。具有一定的参考价值,下面跟着小编一起来看下吧
    2017-01-01
  • 追踪discord.js中删除消息的用户方法实例详解

    追踪discord.js中删除消息的用户方法实例详解

    这篇文章主要为大家介绍了如何追踪discord.js中删除消息的用户方法实例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2024-01-01
  • 浅谈HBuilderX开发小程序的一些问题

    浅谈HBuilderX开发小程序的一些问题

    本文主要介绍了HBuilderX开发小程序的一些问题,文中通过示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-02-02
  • javascript中的void运算符语法及使用介绍

    javascript中的void运算符语法及使用介绍

    void是javascript中的一个操作符,void会计算表达式的值,但是会丢弃表达式的返回值接下来将详细介绍下,感兴趣的你可以参考下或许对你有所帮助
    2013-03-03
  • webpack常用配置总览(小结)

    webpack常用配置总览(小结)

    这篇文章主要介绍了webpack常用配置总览(小结),文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-11-11
  • JS函数节流和函数防抖问题分析

    JS函数节流和函数防抖问题分析

    这篇文章主要介绍了JS函数节流和函数防抖问题分析,非常不错,具有参考借鉴价值,需要的朋友可以参考下
    2017-12-12

最新评论