js性能优化小结

 1   // 不推荐
 2   function fn(){
 3     document.getElementById(‘id1‘);
 4     document.getElementById(‘id2‘);
 5   }
 6 
 7   // 推荐
 8   function fn(){
 9     var doc = document;
10     doc.getElementById(‘id1‘);
11     doc.getElementById(‘id2‘);
12   }
13   // 推荐
14   !function fn(doc){
15     doc.getElementById(‘id1‘);
16     doc.getElementById(‘id2‘);
17   }(document);

 1   // 不推荐使用eval
 2 
 3   // setTimeout、setInterval、new Function建议直接传入匿名函数或函数引用
 4   setTimeout(‘alert(1)‘, 1000); // 不推荐
 5   setInterval(‘alert(1)‘, 1000); // 不推荐
 6   var oFn = new Function(‘alert(1)‘); // 不推荐
 7 
 8   // 推荐
 9   setTimeout(function(){
10     alert(1);
11   }, 1000);
12   setTimeout(fn, 1000);
13 
14   setInterval(function(){
15     alert(1);
16   }, 1000);
17   //setInterval(fn, 1000);
18 
19   var oFn = new Function(function(){
20     alert(1);
21   });
22   var oFn = new Function(fn);
23 
24   function fn(){
25     alert(1);
26   }

 1   var i = 0,
 2     timer = null;
 3 
 4   // 不推荐
 5   function fnTimeout(){
 6     if(i < 10){
 7       setTimeout(fnTimeout, 1000); // 不断初始化
 8     }
 9     console.log(i++);
10   }
11   fnTimeout();
12 
13   // 推荐
14   function fnInterval(){
15     if(i >= 10){
16       clearInterval(timer);
17       timer = null;
18     }
19     console.log(i++);
20   }
21   setInterval(fnInterval, 1000); // 初始化一次

 1   var a = ‘a‘,
 2     b = ‘b‘,
 3     c = ‘c‘,
 4     s = ‘‘,
 5     arr = [];
 6 
 7   // 不推荐
 8   s += a;
 9   s += b;
10   s += c;
11 
12   // 推荐
13   s = a + b + c;
14 
15   // 最佳
16   arr.push(a);
17   arr.push(b);
18   arr.push(c);
19   s = arr.join(‘‘);

 1   // 不推荐
 2   var a = ‘a‘;
 3   var b = ‘b‘;
 4   var c = ‘c‘;
 5   var s = ‘‘;
 6   var arr = [];
 7 
 8   // 推荐
 9   var a = ‘a‘,
10     b = ‘b‘,
11     c = ‘c‘,
12     s = ‘‘,
13     arr = [];

1   // 不推荐
2   var i = 0,
3     b = i;
4   i++;
5 
6   // 推荐
7   var i = 0,
8     b = i++;

1   // 不推荐
2   var arr = new Array,
3     obj = new Object,
4     re = new RegExp(‘a‘);
5   
6   // 推荐
7   var arr = [],
8     obj = {},
9     re = /a/;

 1   // 不推荐
 2   var fn = !function(doc){
 3     var obj = {name: ‘hum‘},
 4       arr = [1, 2],
 5       oDom = doc.getElementById(‘id‘);
 6 
 7     // ......
 8 
 9     return function(){
10       console.log(obj.name);
11     }
12   }(document);
13 
14   // 推荐
15   var fn = !function(doc){
16     var obj = {name: ‘hum‘},
17       arr = [1, 2],
18       oDom = doc.getElementById(‘id‘);
19 
20     // ......
21 
22     arr = doc = oDom = null; // 释放
23 
24     return function(){
25       console.log(obj.name);
26     }
27   }(document);