JS循環

在學習ES6的變量解構賦值的時候在demo中看到了for-of循環，如今就來總結一下JS中的各類循環

首先咱們先來看看最初的循環

for(var i = 0;i<arrays.length;i++){
    console.log(arrays[i]);
}

這實際上是用的最多的循環吧，若是是我我想也會首選這個循環的，由於很想後端中的for循環

可是咱們要記住咱們是前端工程師，咱們應該跟上時代變遷的腳步，在ES5的時代到來的時候咱們應該改進咱們的循環了

ES5中咱們能夠使用內建forEach方法遍歷數組

myArrays.forEach(function(value){
    console.log(value);
})

以上的代碼看上去是否是很簡潔，可是它也有一個缺點的就是不能使用break退出循環或者return返回外層函數

那麼咱們再看看for-in循環吧

for (var index in myArray) { // 千萬別這樣作
  console.log(myArray[index]);
}

在JS中for-in循環適用於對象的遍歷，而不適用於數組的遍歷

使用for-in循環數組在賦值的時候會賦值爲字符串賦值

做用於數組的for-in循環體除了遍歷數組元素外，還會遍歷自定義屬性。舉個例子，若是你的數組中有一個可枚舉屬性myArray.name，循環將額外執行一次，遍歷到名爲「name」的索引。就連數組原型鏈上的屬性都能被訪問到。
最讓人震驚的是，在某些狀況下，這段代碼可能按照隨機順序遍歷數組元素。

for-of循環來了

for (var value of myArray) {
  console.log(value);
}

這是最簡潔遍歷數組的方法了

這個方法避開了for-in缺陷

與forEach()不一樣的是，它能夠正確響應break、continue和return語句

for-of也是能夠遍歷其餘集合

例如nodeList遍歷，還能夠遍歷字符串，將每一個字符串視爲Unicode字符遍歷

快快用起來吧！