for循環還能這麼寫！

前言

最近在閱讀《JavaScript設計模式與開發實踐》收穫頗多☺，其中有一個讓我很感興趣的寫法來分享一下。

正文

各位掘友們是怎麼寫一個for循環的？
大多數是否是都會這麼寫。

let arr = [1, 2, 3]
for (let i = 0, len = arr.length; i < len; i++) {
  // ...
}
複製代碼

接下來秀一波操做

let arr = [1, 2, 3]
for (let i = 0, val; val = arr[i++]; ) {
  // ...
}
複製代碼

第一眼見到她充滿了好奇，爲何她能夠正常循環，並且能夠正常終止呢？

帶着疑問去查詢了for循環的運行機制

for (語句 1; 語句 2; 語句 3) {
  // 被執行的代碼塊
}
複製代碼

能夠看到正常的for循環有3個語句，先來解釋一下
語句1（可選）：用於初始化變量
語句2（可選）：條件判斷，若是爲true繼續，若是爲false退出循環
語句3（可選）：改變初始變量的值，用於條件判斷

看完了這幾個語句的做用就能夠明白爲何上面的循環能夠正常操做了吧，val = arr[i++]是一個判斷條件語句（同時起到了賦值和i++的做用），從arr[i++]中拿出來的值如判斷爲true則能夠繼續循環，若判斷爲false，就終止循環。

擴展

囉嗦 😂
那這一段會輸出什麼值呢？

let arr = [1, 2, 0, 3]
for (let i = 0, val; val = arr[i++]; ) {
  // ...
}
複製代碼

答案：只會輸出1和2。
緣由：當i=2的時候取出來的值是0,ta是會被斷定爲false的，因此就退出循環。
如何解決這種狀況呢，本身手寫判斷條件。

let arr = [1, 2, 0, 3]
for (let i = 0, val; ; ) {
  val = arr[i++]
  if (val === undefined) {
    break
  } else {
    // ...
  }
}
複製代碼

總結

for循環的運行機制，嗯挺香的。

對數組裏的數據不自信的千萬不要這麼寫
對數組裏的數據不自信的千萬不要這麼寫
對數組裏的數據不自信的千萬不要這麼寫

仰望《JavaScript設計模式與開發實踐》這本書的做者，滿頁的for循環騷操做（逼格挺高），仍是很敬佩做者能夠寫出這麼好的文章，感謝做者爲社區作出的貢獻。

書中使用這種for循環的時候，數組中的數據基本上都是回調函數，因此不存在數據值的判斷條件會爲false狀況

喜歡的大佬們動動手指點個贊關注一下☺