js中有意思的for循環

記錄一下js中各類for循環的寫法，發現仍是蠻有意思的。好了，話很少說，切入正題。

js中for循環的結構以下所示：

for (語句1; 語句2; 語句3) {
    // do something
}
複製代碼

嗯，很完整的一個for循環，老鐵沒毛病。可是仍是記一下這裏的語句到底什麼意思吧：

• 語句1：循環開始前執行的語句
• 語句2：循環條件，值爲true時繼續循環
• 語句3：循環結束後執行的語句

下面寫個循環一個數組的例子

var arr = [0,1,2,3,4,5,6,7,8,9];
for (var i = 0; i< arr.length; i++) {
    console.log(arr[i]); 
}
複製代碼

若是已經定義好初始變量，語句1其實能夠省略

var arr = [0,1,2,3,4,5,6,7,8,9],
    i = 0;
for (; i< arr.length; i++) {
    console.log(arr[i]); 
}複製代碼

在語句1中也能夠緩存數組長度，這樣會略微提高一下性能，若是數組很大，性能會提高較多

var arr = [0,1,2,3,4,5,6,7,8,9];
for (var i = 0, l = arr.length; i< l; i++) {
    console.log(arr[i]); 
}複製代碼

若是循環的順序不重要，那麼能夠倒敘循環

var arr = [0,1,2,3,4,5,6,7,8,9];
for (var i = arr.length; i > -1; i--) {
    console.log(arr[i]);
}
複製代碼

可是貌似不太優雅（都特麼扯到-1去了，尷尬症有些要犯了。咋辦？有病得治啊！），下面：

var arr = [0,1,2,3,4,5,6,7,8,9];
for (var i = arr.length; i--;) {
    console.log(arr[i]);
}
複製代碼

上面這句舒服多了。可是若是我就要是要正常的順序循環、又要提高性能減小變量呢？

var arr = [1,2,3,4,5,6,7,8,9];
for (var i = 0, item; item = arr[i++];) {
    console.log(item); 
}
複製代碼

爲何這裏item能夠做爲判斷條件呢？是由於item在取值時若是超過了arr的長度的時候，天然就取到的是個undefind，因此返回false；使用這種循環寫法時要注意以下幾點：

• 當數組長度動態變化時，會致使死循環。
  
• 當數組取出的值爲0，undefined、null、false、空值時也會當即終止循環
  
• 因此使用時要排除上面這些狀況

固然，循環數組還有forEach/some/every/map等等，由於不是for了，這裏暫時不作說明，須要的小夥伴能夠自行查閱相關方法。

最後列兩種死循環：

for(;;) {
    // DO SOMETHING
};
for(;1;) {
    // DO SOMETHING
};
複製代碼

tips:

1. 知足條件時，使用break跳出循環，避免沒必要要的資源浪費
2. 循環數組時要緩存數組的長度