提高 web 应用性能之 JavaScript 性能调优 （3）

look_w

隐式类型转换
参考如下代码：
清单 11. 隐式类型转换

1 2 3 4

var str = “12345678”, arr = []; for(var i = 0; i <= s.length; i++){ arr.push( str.charAt(i)); }

这里我们在每个循环时都会调用字符串的“charAt”方法，但是由于我们是将常量“12345678”赋值给“str”，所以“str”这里事实上并不是一个字符串对象，当它每次调用“charAt”函数时，都会临时构造值为“12345678”的字符串对象，然后调用“charAt”方法，最后再释放这个字符串临时对象。我们可以做一些改进：
清单 12. 避免隐式类型转换

1 2 3 4

var str = new Stirng(“12345678”), arr = []; for(var i = 0; i <= s.length; i++){ arr.push( str.charAt(i)); }

这样一来，变量“str”作为一个字符串对象，就不会有这种隐式类型转换的过程了，这样一来，效率会显著提高。
字符串匹配
JavaScript 有 RegExp 对象，支持对字符串的正则表达式匹配。是一个很好的工具，但是它的性能并不是非常理想。相反，字符串对象（String）本身的一些基本方法的效率是非常高的，比如“substring”，“indexOf”，“charAt”等等，在我们需要用正则表达式匹配字符串时，可以考虑一下：

• 是否能够通过字符串对象本身支持的基本方法解决问题。
• 是否可以通过“substring”来缩小需要用正则表达式的范围。

这些方式都能够有效的提高程序的效率。
关于正则表达式对象，还有一点需要注意，参考如下代码：
清单 13. 正则表达式

1 2 3 4 5

for(var i = 0; i <= str_array.length; i++){ if(str_array.match(/^s*extra\s/)){ …………………… } }

这里，我们往“match”方法传入“/^s*extra\s/”是会影响效率的，它会构建临时值为“/^s*extra\s/”的正则表达式对象，执行“match”方法，然后销毁临时的正则表达式对象。我们可以这样做：
清单 14. 利用变量

1 2 3 4 5 6

var sExpr = /^s*extra\s/; for(var i = 0; i <= str_array.length; i++){ if(str_array.match(sExpr)){ …………………… } }

这样就不会有临时对象了。
setTimeout 和 setInterval
“setTimeout”和“setInterval”这两个函数可以接受字符串变量，但是会带来和之前谈到的“eval”类似的性能问题，所以建议还是直接传入函数对象本身。
利用提前退出
参考如下两段代码：
清单 15. 利用提前退出

1 2 3 4 5 6 7 8 9 10 11 12 13 14

// 代码 1 var name = … .; var source = …… ; if(source.match(/ …… /)){ …………………………… } // 代码 2 var name = … .; var source = …… ; if(name.indexOf( … ) &&source.match(/ …… /)){ …………………………… }

代码 2 多了一个对“name.indexOf( … )”的判断，这使得程序每次走到这一段时会先执行“indexOf”的判断，再执行后面的“match”，在“indexOf”比“match”效率高很多的前提下，这样做会减少“match”的执行次数，从而一定程度的提高效率。