1. 程式人生 > >數組叠代方法

數組叠代方法

span 指定 cal ldp index str ted 語法 logs

常用的數組叠代方法,很多人第一想到的就是for循環,比如需要叠代出下面數組peoples年齡(age)大於30的人名(name)。

 1 var peoples = [ { 
 2     name: ‘Agraj‘, 
 3     gender:‘M‘, 
 4     age: 29, 
 5     address: { 
 6         city: ‘Delhi‘, pincode: ‘110064‘ 
 7     } 
 8 }, { 
 9     name: ‘Mark‘, 
10     gender:‘M‘, 
11     age: 35, 
12     address: { 
13 city: ‘West Bengal‘, pincode: ‘220013‘ 14 } 15 }, { 16 name: ‘Lance‘, 17 gender:‘M‘, 18 age: 39, 19 address: { 20 city: ‘Chandigarh‘, 21 pincode: ‘201201‘ 22 } 23 }, { 24 name: ‘Vikas‘, 25 gender:‘M‘, 26 age: 21, 27 address: {
28 city: ‘Noida‘, pincode: ‘201301‘ 29 } 30 }, { 31 name: ‘Kanika‘, 32 gender:‘F‘, 33 age: 21, 34 address: { 35 city: ‘Noida‘, 36 pincode: ‘201301‘ 37 } 38 }]; 39 for (var i = 0; i < peoples.length; i++ ) { 40 if (peoples[i].age > 30) {
41 console.log(peoples[i].name + ‘:‘ + peoples[i].age); 42 } 43 }

其實ES5為數組定義了五個叠代方法:

  • forEach():沒有返回值,只是針對每個數組項調用指定的函數(callbackfn)
  • every(): 測試數組的所有元素是否都符合指定函數的條件,只要有有一個元素不符合,返回的都會是false
  • some(): 和every()方法類似,不同的是,some()方法在調用指定的函數callbackfn指定的條件符合就會返回true,不符合則返回false
  • filter(): 每個數組項調用指定的函數,條件為true的將返到一個新數組中
  • map(): 每個數組項調用指定的函數,返回每次函數調用的結果組成一個新數組

在這5個數組中,前三個不會生成新的數組,而後兩個會生成一個新的數組。

1、forEach

語法:array.forEach(function(currentValue, index, arr), thisValue)

1 peoples.forEach(function (item,index,arr) { 
2     if (item.age > 30) { 
3         console.log(item.name + ‘:‘ + item.age); 
4     } 
5 });

也可以將名字重組放在一個新的數組中:

1 var names = []; 
2  peoples.forEach(function (people, index) { 
3     names.push(people.name); 
4 }); 
5 console.log(names); // ["Agraj", "Mark", "Lance", "Vikas", "Kanika"]

2、every

還是上面開頭的數組,如果每一位的年齡都大於或等於30,就會返回“都大於或等於30歲了”,反之返回“不是所有人都大於30歲了”。

語法:array.every(function(currentValue,index,arr), thisValue)

function bigAge(ele,index,arr){ 
    return (ele.age >= 30); 
} 
var isBigPeople = peoples.every(bigAge); 
if (isBigPeople) { 
    console.log(‘都大於或等於30歲了‘); 
} else { 
    console.log(‘不是所有人都大於30歲了‘); 
}

3、some

只要數組中年齡age有一個大於或等於30,就會返回“有部分人還是年紀大了”,反之返回“你們都還很年輕”:

語法:array.some(function(currentValue,index,arr),thisValue)

1 function OldAge(ele,index,array){ 
2     return (ele.age >= 30); 
3 } 
4 var isOldPeople = peoples.some(OldAge); 
5 if (isOldPeople) { 
6     console.log(‘有部分人還是年紀大了‘); 
7 } else { 
8     console.log(‘你們都還年輕‘); 
9 }
4、map
map()
方法返回一個由原數組中的每個元素調用一個指定函數callbackfn後的返回值組成的新數組。如果符合callbackfn會返回符合條件的一個值,將所有返回的值再創建一個新數組。
1 var usersDb = peoples.map(function (user, index) {
2     user.id = index + 1; 
3     return user; 
4 }); 
5 console.table(usersDb);

5、filter

filter() 方法使用指定的函數callbackfn測試所有元素,並創建一個包含所有通過測試的元素的新數組。

var guys = peoples.filter(function (user) { 
    return user.gender === ‘M‘; 
}); 
console.table(guys); 


數組叠代方法