[读书笔记]高性能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。这一点要特别注意。