``` var data=[{'name':'dash','age':20},{'name':'tom','age':20}] //遍歷數組 data.forEach(function(e, i){//異步的 同步用for in //console.log(i) console.log(e) //遍歷對象 Object.keys(e).forEach(function(key){ console.log(e[key]) }) }) ``` ## 數組循環的方法 1.forEach() ``` let array = [1,2,3,4]; array.forEach((item, index, array) => { 　　console.log(item); }); //參數：value數組中的當前項, index當前項的索引, array原始數組； //數組中有幾項，那么傳遞進去的匿名回調函數就需要執行幾次； ``` forEach會遍歷數組, 沒有返回值, 不允許在循環體內寫return, 不會改變原來數組的內容.forEach()也可以循環對象。不支持IE 2.map() ``` let array = [1, 2, 3, 4]; let temp = array.map((item, index, array) => { 　　return item * 10; }); console.log(temp);　　// [10, 20, 30, 40]; console.log(array);　　// [1, 2, 3, 4] //支持return返回值；return的是啥，相當于把數組中的這一項變為啥（并不影響原來的數組，只是相當于把原數組克隆一份，把克隆的這一份的數組中的對應項改變了） ``` map 遍歷數組, 會返回一個新數組, 不會改變原來數組里的內容 ``` let temp2 = array.map(String);　　// 把數組里的元素都轉成字符串 console.log(temp2); ``` 3.filter() ``` let array = [1, 2, 3, 4]; let temp = array.filter((item, index, array) => { 　　return item > 3; }); console.log(temp);　　// [4] console.log(array);　　// [1, 2, 3, 4] ``` filter 會過濾掉數組中不滿足條件的元素, 把滿足條件的元素放到一個新數組中, 不改變原數組 4.reduce() ``` let array = [1, 2, 3, 4]; let temp = array.reduce((x, y) => { console.log("x,"+x); console.log("y,"+y); console.log("x+y,",Number(x)+Number(y)); return x + y; }); console.log(temp);　　// 10 console.log(array);　　// [1, 2, 3, 4] ``` x 是上一次計算過的值, 第一次循環的時候是數組中的第1個元素 y 是數組中的每個元素, 第一次循環的時候是數組的第2個元素 5.every() ``` let array = [1, 2, 3, 4]; let bo = array.every((item, index, array) => { 　　return item > 2; }); console.log(bo);　　　　// false; ``` every遍歷數組, 每一項都是true, 則返回true, 只要有一個是false, 就返回false 6.some() ``` let array = [1, 2, 3, 4]; let temp = array.some((item, index, array) => { 　　return item > 5; }); console.log(temp);　　// false ``` 遍歷數組的每一項, 有一個返回true, 就停止循環 以上6個方法IE9及以上才支持。不過可以通過babel轉義支持IE低版本。 以上均不改變原數組。 some、every返回true、false。 map、filter返回一個新數組。 reduce讓數組的前后兩項進行某種計算，返回最終操作的結果。 forEach 無返回值。 **for循環** 使用臨時變量，將長度緩存起來，避免重復獲取數組長度，當數組較大時優化效果才會比較明顯。 ``` for(j = 0,len=arr.length; j < len; j++) { } ``` **forr...of遍歷** 可以正確響應break、continue和return語句 ``` for (var value of myArray) { console.log(value); } ``` **for...in循環** 存儲的索引的數據類型是字符串類型 如果要執行加法運算,需要轉化為數值類型 ~~~ var arr = ['北京','上海','廣州','重慶','天津']; for(var key in arr){ // 自定義變量,存儲索引 0 1 2 3 4 .... console.log(key,arr[key]); // arr[key] 就是索引對應的數據 } ~~~ for?和?for/in?語句都可以迭代數組。for?語句需要配合?length?屬性和數組下標來實現，執行效率沒有?for/in?語句高。 對于超長數組來說，建議使用?for/in?語句進行迭代 另外，for/in?語句會跳過空元素。 ``` var b = [], num = 0; for (var i in a) { //遍歷數組 if（typeof a[i] == "number") //如果為數字，則返回該元素的值 b.push(a[i]); num ++; //計數器 } console.log(num); //返回7，說明循環了7次 console.log(b); //返回[1,2,4,56] ``` ## 對象的遍歷 ### **for 遍歷對象的辦法** ``` var data={'name':'tom','age':19} //對象鍵組成的數組 var keys = Object.keys(data);// 對象值組成的數組 :Object.values（data） for (var j = 0; j < keys.length; j++) { var v=data['data'][i][keys[j]]; } ``` ### Object.keys(data).forEach(function(key){} ~~~ var obj = {'0':'a','1':'b','2':'c'}; Object.keys(obj).forEach(function(key){ console.log(key,obj[key]); }); ~~~ ### Object.getOwnPropertyNames(obj) 使用Object.getOwnPropertyNames(obj) ~~~ 返回一個數組，包含對象自身的所有屬性（包含不可枚舉屬性） 遍歷可以獲取key和value const obj = { id:1, name:'zhangsan', age:18 } Object.getOwnPropertyNames(obj).forEach(function(key){ console.log(key+ '---'+obj[key]) }) ~~~ ### for......in