for循環比較

在實際的開發過程當中，通常都會用到for循環，均可以用來遍歷，可是這幾個之間又存在細微的差異！

一，傳統的for循環；

var arr = ['good', 'good', 'study'];
for (var i = 0; i< arr.length; i++) {
    console.log(arr[i]);
};

優勢： 若是循環的次數比較多的時候，相較於其餘的循環方法，運行的時間會更快；若是循環的次數比較少的時候，運行時間幾乎差很少

缺點： 1，這種傳統方法，沒法只關注元素自己，還得維護變量i和以及邊界length;

　　　 2,  當嵌套的循環不少層的時候，須要維護多個變量i，代碼會變得很複雜

二，forEach；

var arr = ['good', 'good', 'study'];
arr.forEach(item => {
    console.log(item);
});

優勢：不用維護變量i和邊界length

缺點： 在循環的過程當中，若是有break或者continue的時候，會報錯（只能一個循環走到底，不能中途退出循環）

三，for....in

var arr = ['good', 'good', 'study'];
for (var i in arr) {
    console.log(arr[i]);
};

for..in 是一種精準的迭代語句，能夠枚舉對象的全部可枚舉的屬性，除了能夠遍歷數組，對象以外，還能夠遍歷字符串

優勢：不須要維護變量i以及邊界length，也支持break以及continue等操做

var father = {
    fatherArr: 'attr'
};
var instance = Object.create(father);
instance.a = 1;
instance.b = 2;
instance.c = 3;
for (var i in instance) {
    console.log(instance[i]);
};
1，2，3，attr

缺點：for..in語句除了能夠枚舉自身的屬性以外，還能夠遍歷原型身上的屬性，一樣的，數組也存在這個問題，使用的時候須要添加obj.hasOwnProperty()屬性的判斷

四： for..of；

var attr = ['good', 'good', 'study'];
for (var i of attr) {
    console.log(attr[i]);
};

優勢：不用維護變量i和邊界length，可使用break,continue等操做，也不存在for..in的遍歷原型的屬性等問題

缺點：可是for..of是es6才提出來的，因此存在兼容性問題，若是須要兼容低版本瀏覽器的話，不建議使用；同時只能用戶遍歷可迭代的對象，不可迭代對象直接報錯