zoukankan      html  css  js  c++  java
  • JavaScript 代码性能优化总结

    本文转自:http://mp.weixin.qq.com/s?__biz=MzAxODE2MjM1MA==&mid=400360237&idx=2&sn=eb00241cb3b61ffb81b7dea862dc936f&scene=23&srcid=1027psyzZXVbBVCfXTGWnaAv#rd

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> </head> <body> 下面是我总结的一些小技巧,仅供参考。 以下代码基本上在jQuery的源码里面都可以看到,如有说得不对的地方,请大家指出。 A:尽量使用源生方法 javaScript是解释性语言,相比编译性语言执行速度要慢。浏览器已经实现的方法,就不要再去实现一遍了。另外,浏览器已经实现的方法在算法方面已经做了很多优化。 避免全局查找 在一个函数中会用到全局对象存储为局部变量来减少全局查找,因为访问局部变量的速度要比访问全局变量的速度更快些。 <script> function search() { //当我们要使用当前页面地址和主机域名 console.log(window.location.href + window.location.host); } //最好的方式如下这样,先用一个简单变量保存起来 function search() { var location = window.location; console.log(location.href + location.host); } </script> B:尽量减少循环次数 少一层循环,就能提高数倍性能。如果要对一个数组的每个元素进行多次操作,尽可能使用一次循环,多次操作,而不是多次循环,每次循环执行一次操作。尤其是在进行多个正则匹配的时候,尽可能合并正则表达式,在一次遍历中尽可能找到相应的匹配。 循环 <script> //通常循环的写法 var objs = [{ 'key': 'obj1' }, { 'key': 'obj2' }, { 'key': 'obj3' }]; //len 定义一个变量; for (var i = 0, len = objs.length; i < len; i++) { dosomething(objs[i]); } //当循环遍历的对象是object时,可以采用下面的方式来写; var objs2 = [{ 'key': 'obj1' }, { 'key': 'obj2' }, { 'key': 'obj3' }], obj, i = 0; while (obj = objs2[i++]) {//先赋值在判断;这种思想得掌握 dosomething(obj); //备注:如果数组里面可能出现0,false,null等在条件判断为false的值,这种写法是不正确的; } function dosomething(val) { console.log(val); } </script> switch的补充点; <script> var con = 'a'; function funa() { }; function funb() { }; function func() { }; //通常的写法 switch (con) { case 'a': funa(); break; case 'b': funb(); break; case 'c': func(); break; } //换种写法试试 var funs = { 'a': funa, 'b': funb, 'c': func }; funs[con](); //备注:取值或者函数调用可以用类似的方法来做; </script> C: 条件分支: 将条件分支,按可能性顺序从高到低排列:可以减少解释器对条件的探测次数。 在同一条件 >2条件分支时,使用switch优于if:switch分支选择的效率高于if,在IE下尤为明显。4条分支的测试,IE下switch的执行时间约为if的一半。 使用三目运算符替代条件分支。 <script> var a = 1, b = 2, num; if (a > b) { num = a; } else { num = b; } //建议这种写法:换种写法试试 num = a > b ? a : b; </script> 定时器 如果针对的是不断运行的代码,不应该使用setTimeout,而应该是用setInterval,因为setTimeout每一次都会初始化一个定时器,而setInterval只会在开始的时候初始化一个定时器。 <script> var timer = 0; function timeout() { timer++; if (timer < 10) { setTimeout(timeout, 10); } } timeout(); //可以替换为 var interval = 0; function interval() { interval++; if (interval >= 10) { clearInterval(interval); } dosomething(); } var interv = setInterval(interval, 10); //动画效果 function dosomething() { } //一般应用于动画 用做标记的变量尽可能使用布尔类型 直接用true和false做标记,不要使用数字或者字符串的1和0来做标记。 </script> </body> </html>

      

  • 相关阅读:
    CSUFT 1002 Robot Navigation
    CSUFT 1003 All Your Base
    Uva 1599 最佳路径
    Uva 10129 单词
    欧拉回路
    Uva 10305 给任务排序
    uva 816 Abbott的复仇
    Uva 1103 古代象形文字
    Uva 10118 免费糖果
    Uva 725 除法
  • 原文地址:https://www.cnblogs.com/alphafly/p/4913508.html
Copyright © 2011-2022 走看看