js中for循环的几种节省字符的写法

javascript中for循环非常常用,一般写法如下:

for(var i = 0;i< arr.length;i++) {
        var a = arr[i];
        //...
    }

这就是一个常见的,正序循环的for循环。这样写的缺点大家都明白:每次都从arr里取length与i来对比,浪费性能(而且,要是arr的长度是动态变化的,就会出现死循环)。改进这个循环的办法是用变量保存arr.length:

for(var i = 0, al = arr.length;i< al;i++) {
        var a = arr[i];
        //...
    }
这样比第一种可以略微提升点性能,要是数组长,可以提升更多。

不过这样写就多了个变量al,且这个变量只在用来与i对比的时候有用,看着有点鸡肋。

如果循环顺序对你不重要,那你可以尝试倒序循环:

for(var i = arr.length-1;i > -1;i--) {
        var a = arr[i];
        //...
    }
这样一来变量少些,且还缓存过arr长度,性能也不错。但这里的代码写得有点拙劣(我故意的),首先是i = arr.length-1(居然要-1,靠),然后是循环继续执行的条件i > -1,都让有洁癖的人无法忍受。

下面是我常用的倒序for循环写法:

for(var i = arr.length;i--;) {
        var a = arr[i];
        //...
    }
这已经非常精简了。原理需要理解一下:for循环继续执行的条件,是;;之间的这个判断要为真,而这里的i–,在第一次循环进来的时候,i=arr.length,i–值不变(为什么不变?因为要在for循环体里面,才会发现i变了);当i=1时,i- -还是1,但进入循环体后,就是0了,所以可以正常执行最后一次循环;当i=0时,i–还是0,而0已经不为真了,所以循环就不会继续执行了。

大家注意到上面的所有代码的for循环体里,都有个var a = arr[i],用来取出当前循环到的数组项。这实际上也是种浪费,且jsLint等会告诉你:不要在循环里声明变量。。。

倒序的for可以精简至斯,但我就是要正序,而且要效率高,变量少,怎么办?如下:

for(var i = 0, a;a = arr[i++];) {
        //...
    }
这种写法好处在于:几乎不可避免的arr.length不见了,前面说的取出当前循环到的数组项的那一句也不见了。

原理:

a = arr[i++],在这里作为循环能执行的条件,注意这里只有一个=号,所以这不是判断句,是赋值语句,就是把arr[i++]赋给a,然后判断a是不是真值。i++与i–的原理类型我就不说了,只说当i++已经超过数组的长度时,循环肯定要停止才行,而这里真的就停止了,为什么?因为a=arr[i++],如果取到了超出数组本身长度的项,只会取得一个undefined,而undefined是假值,循环条件就判断失败了。

当然,这样写的缺点也很明显:
1,当arr的长度动态变化时,依然会产生死循环————因为我们从来没缓存过arr.length呀。
2,如果循环的是一个数字数组,当取出的项(即a的值)为0时,就会中止循环(因为0是假值)。
3,当数组中某一项是假值时(包括空字符串,0,null,undefined),同样会中止循环

所以大家用这种写法时,最好排除掉上面的情况再用。

这个原理同样可以用在倒序循环上。

最后我要忠告大家几句:

代码精简不等于效率高!
不要为了故意精简代码而丧失性能
顺带说几点提高for循环性能的要点:

1,适时break!不需要遍历全部的就要加跳出条件!
2,不要在for循环体里声明变量(建议一次var,多次赋值)
2,数组长度缓存,尽量少变量

时间: 2024-09-24 05:48:47

js中for循环的几种节省字符的写法的相关文章

javascript for循环-js 中for循环成为死循环

问题描述 js 中for循环成为死循环 下面两个代码,通过 main去循环调用 testfor函数,当main中的i>=6的时候,一直死循环,不断地) alert 出 "i=6 , true" ,刚刚接触JavaScript,请教了~ function testfor(x){ for (i=0;i<5;i++){ alert(i); if(i==x) { return false; } } return true; } function main(){ for (i=3;i

JS中检测数据类型的几种方式及优缺点小结_javascript技巧

1.typeof 用来检测数据类型的运算符 typeof value 返回值首先是一个字符串,其次里面包含了对应的数据类型,例如:"number"."string"."boolean"."undefined"."object"."function" 局限性: 1)typeof null ->"object" 2)检测的不管是数组还是正则都返回的是"ob

js中怎么循环输出两个table两个table的输出

问题描述 js中怎么循环输出两个table两个table的输出 function searchSpecific(headCount){ //查询每个月具体扣税 $.ajax({ type: 'POST', url: 'personVoid_searchPersons.action', data: { headCount: headCount }, dataType: 'JSON', success: function(data){ var today = new Date(); var year

JS中创建函数的三种方式及区别_基础知识

1.函数声明 function sum1(n1,n2){ return n1+n2; }; 2.函数表达式,又叫函数字面量 var sum2=function(n1,n2){ return n1+n2; }; 两者的区别:解析器会先读取函数声明,并使其在执行任何代码之前可以访问:而函数表达式则必须等到解析器执行到它所在的代码行才会真正被解释执行. 自执行函数严格来说也叫函数表达式,它主要用于创建一个新的作用域,在此作用域内声明的变量,不会和其它作用域内的变量冲突或混淆,大多是以匿名函数方式存在,

javascript中for循环有几种不同的使用情况介绍

 for循环是多数语言都有的.在javascript中,for循环有几种不同的使用情况,下面为大家一一介绍下 程序实现中经常要用到循环语句,其中for循环是多数语言都有的.在javascript中,for循环有几种不同的使用情况,下面就分别来讲述我的理解.    第一种:(通常情况,循环执行相关操作)   代码如下: var objA=document.getElementsByTagName("a");  var i,max;  for(i=0,max=objA.length;i&l

js中if语句的几种优化代码写法_javascript技巧

尽管我还没使用它去做一些尝试性的测试,但从这里可以看到它的确对js作了美化的工作.也许有人认为if语句就那么简单,能优化到什么程度?但是看看以下的几种方式,你也许会改变看法. 一.使用常见的三元操作符 复制代码 代码如下: if (foo) bar(); else baz(); ==> foo?bar():baz(); if (!foo) bar(); else baz(); ==> foo?baz():bar(); if (foo) return bar(); else return baz

HTML中调用JavaScript的几种情况和规范写法

JavaScript运行在html中,引用有几种方式? 我知道的方法有3种: 第一种:外部引用远程JavaScript文件,如<script type="text/javascript" src="../js/jquery-1.8.3.js"></script>(相对路劲)或者是<script src="http://common.cnblogs.com/script/jquery.js" type="te

node.js中实现同步操作的3种实现方法

  众所周知,异步是得天独厚的特点和优势,但同时在程序中同步的需求(比如控制程序的执行顺序为:func1 -> func2 ->func3 )也是很常见的.本文就是对这个问题记录自己的一些想法. 需要执行的函数: 代码如下: var func1 = function(req,res,callback){ setTimeout(function(){ console.log('in func1'); callback(req,res,1); },13000); } var func2 = fun

node.js中实现同步操作的3种实现方法_node.js

众所周知,异步是得天独厚的特点和优势,但同时在程序中同步的需求(比如控制程序的执行顺序为:func1 -> func2 ->func3 )也是很常见的.本文就是对这个问题记录自己的一些想法. 需要执行的函数: 复制代码 代码如下: var func1 = function(req,res,callback){   setTimeout(function(){     console.log('in func1');     callback(req,res,1);    },13000); }