JavaScript裡面的迴圈方法小結

標籤：var   ul li   developer   get   json   小結   ttl   img   技術分享   

一，原生JavaScript中的迴圈：

for 迴圈代碼塊一定的次數，它有三個參數，來決定代碼塊的迴圈次數，第一個是初始值，第二個是終止值，第三個參數是變化規則：

//for迴圈for(var i = 0, len = jsonArr.length; i < len; i++) {console.log(JSON.stringify(jsonArr[i]));}

for in迴圈一般用於遍曆對象的屬性，它有兩個參數，in之前為屬性名稱參數，in之後為要遍曆的對象，它會遍曆對象中的每一個屬性，key即為屬性名稱，對象【屬性名稱】則輸出屬性值：

for(var key in jsonObj) {console.log(key + ‘:‘ + jsonObj[key]);}

注意：這裡的key是字串，而不是真正的索引，for in是為普通對象設計的迴圈，可以遍曆得到字串類型的鍵，如果用它來遍曆數組則不方便。

forEach迴圈

jsonArr.forEach(function(value,index,array){console.log(‘********************‘);console.log(value);console.log(index);console.log(array);});

這是輸出結果，可以看到，value是數組元素值，index為當前值得索引，array則為當前所遍曆的數組對象。

for of迴圈

var jsonArr = [{‘one‘: ‘1‘},{‘two‘: ‘2‘},{‘three‘: ‘3‘}];//for of迴圈for(var value of jsonArr) {console.log(value);}

將輸出數組的每一項的值。

for-of迴圈除了可以遍曆數組，也可以遍曆其它的集合。比如，大多數類數組對象，例如DOM NodeList對象。

var nodeLis = document.getElementById(‘ul‘).childNodes;//for of迴圈for(var value of nodeLis) {console.log(value);}

for-of迴圈也支援字串遍曆，它將字串視為一系列的Unicode字元來進行遍曆：

var str = ‘i am little sun‘;for(var value of str) {console.log(value);}

while和do while迴圈：

var i=0while(i<5){console.log(i);i++;}do{console.log(i);i++;}while(i<5)

二者的區別是，do while無論條件滿足與否都會至少執行一次。

二，jQuery中專有的迴圈：

$.each()用於遍曆數組和對象：

遍曆數組：

var arr1 = [0, 1, 2, 3, 4];var arr2 = $(‘ul li‘);$.each(arr1, function(index,value) {console.log(index)console.log(value)});

遍曆對象：

$.each(jsonObj, function(key, val) {　　alert(jsonObj[key]);});　

$().each()用於遍曆jQuery中的節點對象：$(selector).each(function(index,element))

$( $(‘ul li‘)).each(function(index,value){console.log(index)console.log(value)});

部分文章中有提到，$.().each()主要用於處理dom，在測試中發現其實兩者都可以同樣的用於處理dom，似乎沒有什麼大的區別。

JavaScript裡面的迴圈方法小結