在实际的开发过程中,一般都会用到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才提出来的,所以存在兼容性问题,如果需要兼容低版本浏览器的话,不建议使用;同时只能用户遍历可迭代的对象,不可迭代对象直接报错