javascript之for循環的幾種寫法

背景

javascript中的for循環選擇多種多樣，可你知道其中的差異在哪裏嗎？何時又該用哪一種循環纔是最佳策略？以上這些是本文想討論的，歡迎交流。

 

說明

一、20年前的for循環

//20年前的寫法
let len = myArray.Length
for (let index = 0; index < len; index++) {
  console.log(myArray[index])
}

• 中規中矩。

二、forEach

//ES5的寫法
myArray.forEach(function(index){
    //操做你的index，index即爲數組中的元素
})

• 缺點，沒有返回值。

三、for...in

//ES5的寫法，勸你慎重
for (let index in myArray) { 
  // 千萬別這樣作
  console.log(myArray[index]);
}

• 最糟糕的作法，由於此時的index是字符串，並且不必定按照數組的順序輸出，很嚇人。
• 僅適用於遍歷普通對象的key。

四、for...of

/**ES6寫法
*支持數組
*類數組對象（如：NodeList對象）
*字符串
*Map
*set
*/
for (let value of myArray) {
  console.log(value);
}

• 各類優秀啦