javascript中的12種循環遍歷方法1

1：for循環

let arr = [1,2,3];

for(let i =0;i<arr.length;i++){

console.log(i,arr[i])

}

//for循環是js中最經常使用的一個循環工具，常常用來數組的循環遍歷，

2：for in循環

let obj = {name: 'xiao' ,age:'24'}

for(let i in obj){

console.log(i,obj[i]);

}

//for in 循環主要用於遍歷普通對象，i 表明對象的 key 值，obj[i] 表明對應的 value,當用它來遍歷數組時候，多數狀況下也能達到一樣的效果，可是你不要這麼作，這是有風險的，由於 i 輸出爲字符串形式，而不是數組須要的數字下標，這意味着在某些狀況下，會發生字符串運算，致使數據錯誤，好比：'52'+1 = '521' 而不是咱們須要的 53。另外 for in 循環的時候，不只遍歷自身的屬性，還會找到 prototype 上去，因此最好在循環體內加一個判斷，就用 obj[i].hasOwnProperty(i)，這樣就避免遍歷出太多不須要的屬性。

3：while循環

let cars=[ "BMW" , "Volvo" , "Saab" , "Ford" ];

let  i=0;

while (cars[i])

{

console.log(cars[i] + "<br>" )

i++;

};

4：do while循環

let i = 3;

do {

  console.log(i)

  i--;

}

while (i>0)

//do while 循環是 while 循環的一個變體，它首先執行一次操做，而後才進行條件判斷，是 true 的話再繼續執行操做，是 false 的話循環結束。

5：Array forEach循環

let arr = [1,2,3];

arr.forEach( function (i,index){

  console.log(i,index)

})

//forEach循環，循環數組中每個元素並採起操做， 沒有返回值， 能夠不用知道數組長度,他有三個參數，只有第一個是必需的，表明當前下標下的 value。

另外請注意，forEach 循環在全部元素調用完畢以前是不能中止的，它沒有 break 語句，若是你必需要中止，能夠嘗試 try catch 語句，就是在要強制退出的時候，拋出一個 error 給 catch 捕捉到，而後在 catch 裏面 return，這樣就能停止循環了，若是你常常用這個方法，最好自定義一個這樣的 forEach 函數在你的庫裏。

6：Array map（)方法

let  arr = [1,2,3];

let tt = arr.map(function(i){

console.log(i);

return i*2;

})

//map() 方法返回一個新數組，數組中的元素爲原始數組元素調用函數處理後的值。
注意：map 和 forEach 方法都是隻能用來遍歷數組，不能用來遍歷普通對象。

7:Array filter()方法

let arr = [1,2,3];

let tt= arr.filter(function(i){

return i > 1;

})

//filter 方法是 Array 對象內置方法，它會返回經過過濾的元素，不改變原來的數組。

8:Array some()方法

let arr =[1,2,3];

let tt = arr.some(function(i){

return i > 1;

})

//some() 方法用於檢測數組中的元素是否知足指定條件（函數提供）,返回 boolean 值，不改變原數組。

9:Array every()方法

let arr = [1,2,3];

let tt = arr.some(function(i){

return i > 1;

})

//every() 方法用於檢測數組全部元素是否都符合指定條件（經過函數提供），返回 boolean 值，不改變原數組。

10:Array reduce()方法

let arr = [1,2,3];

let ad = arr.reduce(function(i,j){

return i + j;

})

//reduce() 方法接收一個函數做爲累加器，數組中的每一個值（從左到右）開始縮減，最終計算爲一個值。

11:Array reduceRight()方法

let arr = [1,2,3];

let ad = arr.reduceRight(function(i,j){

return i + j;

})

//reduceRight()方法,和 reduce() 功能是同樣的，它是從數組的末尾處向前開始計算。

12:for of 循環

let arr = ['name','age'];

for(let i of arr){

console.log(i);

}

//for of 循環是 Es6 中新增的語句，用來替代 for in 和 forEach，它容許你遍歷 Arrays（數組）, Strings（字符串）, Maps（映射）, Sets（集合）等可迭代(Iterable data)的數據結構,注意它的兼容性。

原文出處：https://www.cnblogs.com/CharlesJian/p/11049990.html