遍歷陣列的常用方法forEach,filter,map等
1.最傳統的for迴圈遍歷
var arr=[1,2,3,4];
for(var i=0;i<arr,length;i++){
console.log(arr[i]);
}
//優化版
for(var i=0;len=arr.length;i<len;i++){
console.log(arr[i]);
}
//使用臨時變數len將陣列的長度存起來,避免重複獲取,當陣列較大時,優化效果比較明顯
2.for…in迴圈
var arr=[1,2,3,4];
for(var i in arr){
console.log(arr[i]);
}
3.for…of
var arr=['a','b','c','d'];
for(var item of arr){
console.log(item);
}
for…in和for…of迴圈的區別
迴圈物件屬性時使用for…in,在遍歷陣列的時候使用for…of
for…in是ES5標準,for…of是ES6標準
for…in迴圈出來的結果是key,而for…of迴圈出來的結果是value
for…of不能遍歷普通物件,要和Object.keys()搭配使用
var arr=[1,2,3,4];
arr.name='zhangsan'
for(var i in arr){
console.log(arr[i]);
}
for(var item of arr){
console.log(item);
}
//for..in會遍歷出後新增的自定義屬性,但是for..of只可以迴圈可迭代的可迭代屬性,不可迭代屬性在迴圈中被忽略了
//迭代?
//可迭代物件是包含Symbol.iterator屬性的物件,這個Symbol.iterator屬性對應著能夠返回該物件的迭代器的函式
//在ES6中,所有的集合物件(陣列,Set和Map)以及字串都是可迭代物件,可迭代物件可以與ES6中新增的for..of
4.forEach
var arr=[1,2,3,4];
//element 表示arr的單元項,index 表示arr單元項對應的索引值
arr.forEach(function(element,index){
console.log(element+'-'+index);
})
//未賦值的值是不會在foreach迴圈迭代的,但是手動賦值為undefined的元素是會被列出的
//例如:' '
5.map
var arr=[1,2,3,4];
//callback對陣列元素進行操作,並將所有操作結果放入陣列中並返回該陣列
var arr2=arr.map(function(item){
return item.toUppercase();
})
console.log(arr2);
6.filter
//返回一個包含所有在回撥函式上返回為true的元素新陣列,回撥函式在此擔任的是過濾器的角色,當元素符和條件,過濾器就返回true,而filter則會返回所有符合過濾條件的元素
var arr=[1,2,3,4];
var arr2=arr.filter(function(item){
if(item>2){
return item;
}
})
console.log(arr2);
7.every
//當陣列中的每一個元素在callback上被返回true時就返回true(注意:要求每一個單元項都返回true時才為true)
var arr=[1,2,3,4];
var arr1=arr.every(function(item){
if(item>0){
return item;
}
})
console.log(arr1) //true
8.some
//只要陣列中有一項在callback上就返回true
var arr=[1,2,3,4];
var arr1=arr.some(function(item){
if(item>3){
return item;
}
})
console.log(arr1); //true
相關文章
- JS中陣列遍歷方法foreach,filter,some,every,map方法介紹與總結JS陣列Filter
- 陣列的forEach,map,filter,reduce,reduceRight,every,some方法陣列Filter
- JavaScript 的 4 種陣列遍歷方法: for VS forEach() VS for/in VS for/ofJavaScript陣列
- 利用c:forEach標籤遍歷陣列陣列
- 陣列遍歷方法陣列
- React中兩種遍歷資料的方法(map、forEach)React
- java陣列遍歷的方法Java陣列
- 自己實現陣列的 `map`、`filter`、`find` 方法陣列Filter
- reduce實現filter,map 陣列扁平化等Filter陣列
- 遍歷陣列的幾種方法陣列
- Java map 詳解 - 用法、遍歷、排序、常用API等Java排序API
- [譯] 圖解 Map、Reduce 和 Filter 陣列方法圖解Filter陣列
- forEach、map、filter、find、sort、find等易錯點整理Filter
- forEach、map、filter、find、sort、some等易錯點整理Filter
- 陣列常見的遍歷迴圈方法、陣列的迴圈遍歷的效率對比陣列
- 陣列遍歷陣列
- php陣列中常用的多種遍歷方式PHP陣列
- 遍歷物件和陣列的方法總結物件陣列
- 遍歷陣列和物件的方法都有哪些?陣列物件
- JS中陣列的遍歷方法(3種)JS陣列
- Java遍歷Map集合的方法Java
- 陣列的 map, filter ,sort和 reduce 用法陣列Filter
- 學習javaScript必知必會(3)~陣列(陣列建立,for...in遍歷,輔助函式,高階函式filter、map、reduce)JavaScript陣列函式Filter
- 遍歷陣列物件陣列物件
- 陣列的三種宣告方式總結、多維陣列的遍歷、Arrays類的常用方法總結陣列
- go語言中遍歷陣列的方法有哪些Go陣列
- 在PHP中陣列遍歷的三種方法PHP陣列
- ES6 map()遍歷、filter()篩選--隨記Filter
- jstl forEach遍歷JS
- JavaScript 中 forEach、map、filter 詳細JavaScriptFilter
- 簡述forEach()、map()、filter()、every()、some()的用法Filter
- js 遍歷陣列方式JS陣列
- JS中陣列與物件的遍歷方法例項JS陣列物件
- Map forEach() 方法
- jquery裡遍歷普通陣列和多維陣列的方法及例項jQuery陣列
- js的map遍歷和array遍歷JS
- JavaScript 4/30: 陣列的 map, filter 和 reduce 用法JavaScript陣列Filter
- java中遍歷map的集中方法Java