zoukankan      html  css  js  c++  java
  • [读书笔记]高性能js-数据访问

    我们都知道,利用js程序访问数据需要一定的时间。访问不同的数据以及数据存储的位置都会影响访问的效率。

    在js中,数据存储和读取的位置有4种,分别是:

    1 直接量:代表自身,不存储在特定的位置。6大基本js数据都有直接量。

    2 变量 :var 定义的数据存储单元。

    3 数组。

    4 对象。

    一般情况,对1和2的读写效率都是很高的,3,和4相比较低。所以通常的建议是减少3,4数据的使用,多使用1,2数据。

    当然,我们也有别的方法进行优化。

    如:管理作用域:

    标识符越在作用域链的后面,搜索标识符所需要的时间越久。所以一般某个跨作用域的值在函数中引用一次以上,那个直接把这个值保存为函数的变量。如

    function a(){
    
      var a=document.getElementById('a');
    
      var b=document.getElementById('b');
    
      var c=document.getElementById('c');
    
    }
    
    可以改写为
    
    function a(){
    
      var doc=document;
    
      var a=doc.getElementById('a');
    
      var b=doc.getElementById('b');
    
      var c=doc.getElementById('c');
    
    }

    另外,可以利用with和try catch改变函数的作用域链,把另一个对象堆如作用域链的最前端,但是这会影响其他变量的搜索速度。

    另外,js是动态作用域的,意思是只有函数代码在执行的时候才能确定用哪个变量。如

    function a(code){
        eval(code)
        function sub(){
           return window  
    }  
        var s=sub();
    }    
    直接调用a,s=window,那么s就是全局window的引用。但是code参数若为{“var window={}”},那s引用的就是局部变量window={}:

    前面提到,访问对象要比访问字面量慢,这是为什么呢?

    比如我们访问一个对象的属性,它要遍历对象所有的属性,比如查找window.location属性,会先遍历所有window的属性,再获得location属性。因此,遍历对象的属性所需要的时间通常比字面量长。另外对象的属性或方法的搜索是根据原型链搜索的,属性处于原型链越深处,搜索所需要是时间也就越久。所以,搜索window.a比搜索window.a.b所需要的时间短。

    所以,和前面所说的一样,我们可以利用缓存对象属性的方法来提高访问效率。

    比如 function a(){

      var body=document.body

      return body.a +body.b;

    }

    但是缓存对象属性的方法不适用在缓存对象的方法。因为把一个方法保存为一个局部变量,会导致方法中的this变为window。这一点要特别注意。

  • 相关阅读:
    sed命令:删除匹配行和替换
    使用git rebase合并多次commit
    解决flask中文乱码的问题
    PyCharm 2017: Remote debugging using remote interpreter doesn't work
    ansible小结(八)ansible-playbook简单使用
    ansible命令参数介绍
    eclipse 代码自动提示
    oracle start with connect by prior 递归查询
    Android九宫图(draw9patch)
    Android 通过按钮弹出系统菜单(通过Button显示菜单)转
  • 原文地址:https://www.cnblogs.com/wz0107/p/4943787.html
Copyright © 2011-2022 走看看