js-遍历

一、对数组的遍历

1. for循环

语法结构：

var arr =[1,2,3];
for(var i=0; i console.log(arr[i]);
}
或
for(let i=0; i console.log(arr[i]);
}

注意：

 1
        2
        3
        4
        

es6:

{
                let btn = document.querySelectorAll('button');
                for( let i=0; i< btn.length; i++){
                       btn[i].onclick = function(){
                        alert('点击了第' + i+'按钮')
                      }
                }
}
//for( let i=0; i< btn.length; i++)是一个作用域，{...}是一个作用域

2.forEach()、map()

遍历Array对象，参数一致
语法结构：
forEach() 列出数组的每个元素，用于调用数组的每个元素，并将元素传递给回调函数。

Array.forEach(function(value, index,array){
...

},thisValue);

Array.map(function(value, index,array){
...

},thisValue);

点我
 
数组元素总和：
 

参数index,array,thisValue可选。

相同点：
forEach()、map()都遍历到数组的每个元素，每个元素都执行/调用提供的函数。

不同点：
forEach()返回值是undefined；
map() 不会修改原数组，返回值是一个新的数组，该新数组由每个元素调用提供的函数后的结果组成。

二、对象的遍历

1.for-in
以任意顺序遍历一个兑现改的可枚举属性，对于每个不同的属性，语句都被执行，每次迭代，分配的是属性名。(迭代的顺序由执行环境决定个，所以该遍历不一定按次序访问元素)
语法结构：

for(var i in obj){
console.log(i + ':' + obj[i]);
}
遍历obj对象的属性，i是指属性名

2. for-of
   每次迭代分配的是属性值。

for-in会遍历一个object（当前对象及其原型上的）所有的可枚举属性（属性名）；
for-of遍历具有iteration接口的数据结构（属性值），即遍历当前对象上的每一个属性值

可迭代数据结构：
Array、Map、Set、String、TypeArray arguments对象等。

for循环和for-in能终端循环（使用break，continue，return语句），forEach不可以。