JS代码优化的8点建议(4)

在函数体内，如果有些代码实际上负责的是一些重复性的工作，那么合理利用循环不仅可以完成同样的功能，还可以使代码量更少。下面有一段创建XHR对象的代码，为了简化示例，只考虑版本9以下的IE浏览器，代码如下：

var createXHR = function(){ var xhr; try{ xhr = new ActiveXObject( 'MSXML2.XMLHttp.6.0' ); }catch(e){ try{ xhr = new ActiveXObject( 'MSXML2.XMLHttp.3.0' ); }catch(e){ xhr = new ActiveXObject( 'MSXML2.XMLHttp' ); } } return xhr; }; var xhr = createXHR();

下面灵活地运用循环，可以得到跟上面代码一样的效果：

var createXHR = function(){ var versions= [ 'MSXML2.XMLHttp.6.0ddd', 'MSXML2.XMLHttp.3.0', 'MSXML2.XMLHttp' ]; for ( var i = 0, version; version = versions[ i++ ]; ){ try{ return new ActiveXObject( version ); }catch(e){ } } }; var xhr = createXHR();

用return退出多重循环

假设在函数体内有一个两重循环语句，需要在内层循环中判断，当达到某个临界条件时退出外层的循环。大多数时候会引入一个控制标记变量：

var func = function(){ var flag = false; for ( var i = 0; i < 10; i++ ){ for ( var j = 0; j < 10; j++ ){ if ( i * j >30 ){ flag = true; break; } } if ( flag === true ){ break; } } };

第二种做法是设置循环标记：

var func = function(){ outerloop: for ( var i = 0; i < 10; i++ ){ innerloop: for ( var j = 0; j < 10; j++ ){ if ( i * j >30 ){ break outerloop; } } } };

这两种做法无疑都让人头晕目眩，更简单的做法是在需要中止循环的时候直接退出整个方法：

var func = function(){ for ( var i = 0; i < 10; i++ ){ for ( var j = 0; j < 10; j++ ){ if ( i * j >30 ){ return; } } } };

当然用return直接退出方法会带来一个问题，如果在循环之后还有一些将被执行的代码呢？如果提前退出了整个方法，这些代码就得不到被执行的机会：

var func = function(){ for ( var i = 0; i < 10; i++ ){ for ( var j = 0; j < 10; j++ ){ if ( i * j >30 ){ return; } } } console.log( i ); // 这句代码没有机会被执行 };

为了解决这个问题，可以把循环后面的代码放到return后面，如果代码比较多，就应该把它们提炼成一个单独的函数：

var print = function( i ){ console.log( i ); }; var func = function(){ for ( var i = 0; i < 10; i++ ){ for ( var j = 0; j < 10; j++ ){ if ( i * j >30 ){ return print( i ); } } } };