更新時間:2020-10-16 17:24:38 來源:動力節(jié)點 瀏覽5363次
數(shù)組遍歷一直是數(shù)組中的重點知識,數(shù)組(Array)作為有序的元素序列,數(shù)組的遍歷也是有方法的。本文就主要向大家介紹7種常見數(shù)組遍歷方法:forEach、map、filter、find、every、some、reduce,它們有個共同點:不會改變原始數(shù)組。
接下來都是使用底下的基礎(chǔ)數(shù)組來實現(xiàn)一些方法:
let people = [
{
name: '阿飛',
money: 2000
},
{
name: '阿雷',
money: 1800
},
{
name: '阿麗',
money: 1500
},
{
name: '我',
money: Infinity
}
];
1.forEach:遍歷數(shù)組
forEach與另外幾種方法有些許不同,就是除了forEach以外的幾個方法都會返回值,如果在等號的左方放一個變量,那么此變量返回值將會是undefined(沒有返回任何值)。
var forEachLoop = people.forEach( function ( item, index, array ) {
console .log(item, index, array); //(對象,索引,全部數(shù)組)
});
console .log(forEachLoop); // undefined
其它的方法都會返回一個值或數(shù)組,以此來說就會傳回原本的數(shù)組值。
var mapLoop = people.map( function ( item, index, array ) {
return item
});
console .log(mapLoop); //與原本數(shù)組資料相同
2.map:一一映射另一個數(shù)組
map會return返回的對象、值,作用上是用來處理數(shù)組返回新值產(chǎn)生一個新數(shù)組,要特別注意返回的值數(shù)量與原始數(shù)組長度相同,所以如果不給return,默認(rèn)返回undefined。
// 沒有給return 也會產(chǎn)生undefined
var mapEmpty = people.map( function ( item, index, array ) {
});
console .log(mapEmpty); // [undefined, undefined, undefined, undefined]
var everyoneAdd = people.map( function ( item, index, array ) {
item.money = item.money + 500 ; //每個money + 500
return item; //返回對象
});
console .log(everyoneAdd); // 返回每個處理后的數(shù)值,不過記得這是傳參考特性,會影響到原始的對象
// {name: "阿飛", money: 2500}
// {name: "阿雷", money: 2300}
// {name: "阿麗", money: 2000}
// {name: "我", money: Infinity}
var mapMoneyThan1500 = people.map( function ( item, index, array ) {
// 錯誤示范,長度不符合時
if (item.money > 1500 ) {
return item; //取得大于1500
}
});
console .log(mapMoneyThan1500);
// [{name: "阿飛", money: 2000}, {name: "阿雷", money: 1800}, undefined, {name: "我", money: Infinity} ]
3.filter:過濾掉數(shù)組中符合條件的元素
filter() 檢測數(shù)值元素,并返回符合條件所有元素的數(shù)組。 filter() 不會改變原始數(shù)組。
// filter
var filterEmpty = people.filter(function(item, index, array){
});
console.log(filterEmpty); // 沒有給條件,會是一個空數(shù)組
var filterMoneyThan1500 = people.filter(function(item, index, array){
return item.money > 1500; // 取得大于1500
});
console.log(filterMoneyThan1500); // 阿飛,阿雷,我 這三個對象
4.find:返回符合條件的數(shù)組的第一個元素的值
find是用來查找數(shù)組中符合條件的對象,且僅能有一個,當(dāng)返回的true數(shù)量超過兩個以上時,那會以第一個為優(yōu)先,通常會用來查找特定 id。如果沒有符合條件的對象,則返回undefined。
var findEmpty = people.find(function(item, index, array){
});
console.log(findEmpty); // 沒有條件,會是 undefined
var findMoneyThan1500 = people.find(function(item, index, array){
return item.money > 1500; // 取得大于1500
});
console.log(findMoneyThan1500); // 雖然滿足條件的有3個,但只會返回 '阿飛' 這一個對象
var findMe = people.find(function(item, index, array){
return item.name === '我'; // 找到我
});
console.log(findMe); // 我 這一對象
5.every:驗證數(shù)組中是否每個元素都滿足指定的條件
驗證全部的結(jié)果,當(dāng)全部的值都為 true 時,則最終會得到 true;只要其中之一為 false,則返回 false。
var ans = people.every(function(item, index, array){
return item.money > 1800;
});
console.log(ans); // false: 只要有部分不符合,則為 false
var ans2 = people.every(function(item, index, array){
return item.money > 500;
});
console.log(ans2); // true: 大家錢都超過 500
6.some:驗證數(shù)組中是否有元素滿足指定的條件
與前者類似,但只要部分為 true,則返回 true;全部為 false 時返回值才會為 false。
var ans = people.some(function(item, index, array){
return item.money > 1800;
});
console.log(ans); // true: 只要有部分符合,則為 true
var ans2 = people.some(function(item, index, array){
return item.money < 500;
});
console.log(ans2); // false: 大家錢都不少于 500
7.reduce:將數(shù)組合成一個值
reduce是其中最為特殊的,首先他返回的參數(shù)與之前的不同,它會接收到前一個返回的值供下一個對象使用,很適合用在累加與對比上,返回的可以是數(shù)字也可以是數(shù)組。
accumulator: 前一個參數(shù),如果是第一個數(shù)組的話,值是以另外傳入或初始化的值
currentValue: 當(dāng)前值
currentIndex: 當(dāng)前索引
array: 全部數(shù)組
var reduceEmpty = people.reduce(function(accumulator, currentValue, currentIndex, array){
});
console.log(reduceEmpty); // 沒有條件,會是 undefined
可以通過與前一個相加的方式,累加數(shù)組中所有的值。
people.pop(); // 我的錢深不可測,先移除掉
var reducePlus = people.reduce(function(accumulator, currentValue, currentIndex, array){
// 分別是前一個返回值, 當(dāng)前值, 當(dāng)前索引值
console.log(accumulator, currentValue, currentIndex);
return accumulator + currentValue.money; // 與前一個值相加
}, 0); // 傳入初始化值為 0
console.log(reducePlus); // 總和為 5300
也可以相互對比,取出最高的值。
var reduceBestOne = people.reduce(function(accumulator, currentValue, currentIndex, array){
console.log('reduce', accumulator, currentValue, currentIndex
return Math.max(accumulator, currentValue.money); // 與前一個值比較哪個更大
}, 0);
console.log(reduceBestOne); // 最大值為 2000
reduce功能很強(qiáng)大,其余幾種遍歷方法可以用reduce方法來代替,這里只列出map被reduce代替的例子。
//map方法
var mapMoneyDouble = people.map( function ( item, index, array )
return item.money*2; //錢翻倍
});
console .log(mapMoneyDouble); // 4000, 3600, 3000, Infinity
//reduce方法實現(xiàn)同樣的功能
var reduceMoneyDouble = people.reduce( function ( accumulator, currentValue, currentIndex, array ) { //錢翻倍
accumulator.push(currentValue.money*2); //錢翻倍
return accumulator
},[]);
console .log(reduceMoneyDouble); // 4000, 3600, 3000, Infinity
以上就是常見的7種數(shù)組遍歷方法,并且每種數(shù)組遍歷方法都為大家給出了實例。數(shù)組在Java基礎(chǔ)知識中也是非常重要的,只有學(xué)好了數(shù)組我們才能更好地處理Java中的數(shù)據(jù)。對于這些Java基礎(chǔ)知識,本站的Java基礎(chǔ)教程中有著很好的講解,通俗易懂的同時還能輕松掌握重難點知識。