1.普通循环
Javascript中一般的循环写法是这样的&＃xff1a;
// sub-optimal loop
for (var i &＃61; 0; i
这种写法的问题是&＃xff0c;每循环一次&＃xff0c;都需要从myarray对象中读取length属性&＃xff0c;这对于Javascript来说&＃xff0c;可能会导致较大的性能问题。如果myarray是一些大型的对象&＃xff0c;或是DOM对象更犹是如此&＃xff0c;因为DOM对象的这些方法都是在执行时才进行查询的。比如&＃xff1a;
document.getElementsByName()
document.getElementsByClassName()
document.getElementsByTagName()
因此我们应该写成这样&＃xff1a;
for (var i &＃61; 0, max &＃61; myarray.length; i
这样我们就在循环一开始把max读取出来&＃xff0c;以后就不再从myarray对象中查询了。当然&＃xff0c;如果应用唯一var模式&＃xff0c;我们应该把声明提高到函数的开头&＃xff1a;
function looper() {var i &＃61; 0,max,myarray &＃61; [];// ...for (i &＃61; 0, max &＃61; myarray.length; i
这样做我们能得到唯一var模式的好处&＃xff0c;但缺点是循环体代码不容易被复用。如果我们进一步缩短这段代码&＃xff0c;可以改写成以下两种形式&＃xff1a;
var i, myarray &＃61; []; //精减后去掉max变量
for (i &＃61; myarray.length; i--;) {// do something with myarray[i]
}
var myarray &＃61; [],i &＃61; myarray.length;
while (i--) { //使用while循环// do something with myarray[i]
}
2. for-in循环
for- in循环可以有效的遍历对象中的属性&＃xff0c;但for-in一般不用在array对象中。一般来说&＃xff0c;对于array对象&＃xff0c;应该用普通的循环&＃xff0c;因为for-in使用在array对象上的意义和遍历array中的元素并不一致。我们在对普通对象使用for-in时&＃xff0c;要注意过滤掉对象中的方法&＃xff0c;不然也会出现意想不到的问题。比如下面的代码使用Object.prototype&＃xff0c;把clone方法加到了所有的对象中去&＃xff1a;
// the object
var man &＃61; {hands: 2,legs: 2,heads: 1
};// somewhere else in the code
// a method was added to all objects
if (typeof Object.prototype.clone &＃61;&＃61;&＃61; "undefined") {Object.prototype.clone &＃61; function () {};
}
这时如果使用for-in循环&＃xff0c;就必须使用hasOwnProperty()方法来过滤掉对象中的方法&＃xff1a;
// 1.
// for-in loop
for (var i in man) {if (man.hasOwnProperty(i)) { // filterconsole.log(i, ":", man[i]);}
}
/*
result in the console
hands : 2
legs : 2
heads : 1
*/
如果不这么做&＃xff0c;可能就会象下面的代码这样&＃xff1a;
// 2.
// antipattern:
// for-in loop without checking hasOwnProperty()
for (var i in man) {console.log(i, ":", man[i]);
}
/*
result in the console
hands : 2
legs : 2
heads : 1
clone: function()
*/
hasOwnProperty()方法适用于所有的Javascript对象&＃xff0c;不过如果程序员手动的重定义了这个方法&＃xff0c;上面的代码就不起效果了。这时就要使用下面的改进的写法&＃xff1a;
for (var i in man) {if (Object.prototype.hasOwnProperty.call(man, i)) { // filterconsole.log(i, ":", man[i]);}
}
这种改进的写法不用man来调用hasOwnproperty()方法&＃xff0c;而是用Object的原型来调用。如果你觉得Object.prototype.hasOwnProperty太长&＃xff0c;看起来有点啰嗦&＃xff0c;也可以采用唯一var模式&＃xff0c;把它定义在函数的前头&＃xff1a;
var i,hasOwn &＃61; Object.prototype.hasOwnProperty;
for (i in man) {if (hasOwn.call(man, i)) { // filterconsole.log(i, ":", man[i]);}
}
在上面的例子中&＃xff0c;我们使用对象原型&＃xff08;Object.prototype&＃xff09;来为所有的对象加入了方法&＃xff0c;这种做法是十分便利的&＃xff0c;但也可能会导致代码维护上的问题。因为其它的程序员不一定知道你对所有的对象都动了手脚。所以这种做法是不被鼓励的。如果你非要这样做&＃xff0c;建议在此之前检查一下&＃xff1a;
if (typeof Object.protoype.myMethod !&＃61;&＃61; "function") {Object.protoype.myMethod &＃61; function () {// implementation...};
}
京公网安备 11010802041100号