javascript性能优化

javascript性能优化
一、DOM
1、减少访问DOM的次数，把运算量尽量留在ECMAscript端处理（因为访问dom的次数越多，代码运行速度越慢）；
2、HTML集合
它是包含了dom节点引用的类数组对象（没有数组对象特有的方法：eg：push()、slice()等，但提供了类似数组的length属性，同时也能以数字索引的方式访问列表中元素）

 document.getElementsByName();
document.getElementsByClassName();
document.getElementsByTagName();

等方法的返回值都是html集合，
此外，document.images,document.links,document.forms,document.forms[0].elements,childNodes等属性的返回值均为html集合；      
注：导致html集合低效的因素：html集合是以一种“假定时态”实时存在，而且一直与文档保持连续，所以当你每次需要最新信息时（刷新），都会重复执行查询的过程；
所以，在循环的条件控制语句中并不推荐读取数组的length属性的做法，推荐应该将length存在一个局部变量中，然后再在循环语句中使用（读取一个集合的length比读取普通数组的length要慢很多（因为每次都要重新查询））
建议：在循环中使用局部变量存储集合引用和集合元素
3、DOM元素
（1）在所有浏览器中children都比childNodes快（特别是IE）
（2）使用选择器API代替getElementsByTagName()获取dom节点会提升访问速度

选择器API与getElementsByTagName区别，详解请参考：点击打开链接

        eg:

var elements = document.querySelectorAll('#navi a')

;返回一个引用列表NodeList（包含着匹配节点的类数组对象不是html集合不会对应实时文档结构，避免了html集合引起的性能）
4、最小化重绘和重排

二、算法和流程控制
1、在for循环中初始化var语句创建的都是函数级变量，而不是循环级；
2、建议不要使用for-in循环遍历数组成员，在js的四种循环中，for-in循环最慢吗，其他三种都差不多
当需要便利一个属性数量未知的对象时才使用for-in循环

 ① for(){
        
    };
② while(){
        
    };
③ do{
        
    }while();

注：当所要执行的效果与数组（类数组）的顺序无关时，可以通过颠倒顺序来提高循环性能
3、优化if-else
（1）将最可能出现的条件放在首位
（2）把if-else组织成一系列嵌套的if-else语句
4、在判断条件较多时，使用查找表比if-else 、switch快
5、当遇到栈溢出错误时，可将方法改为迭代算法，或使用Memoization来避免重复计算
详解Memoization 点击打开链接