天天看點

javaScript:數組Array疊代方法

前言:JavaScript資料的疊代方法如果可以被被我們靈活的使用,可以達到出其不意的效果!
ES5為數組定義了5個疊代的方法。
  • every():對數組中的每一項運作給定函數,如果該函數對每一項都傳回 true,則傳回 true。
  • filter():對數組中的每一項運作給定函數,傳回該函數會傳回 true 的項組成的數組。
  • forEach():對數組中的每一項運作給定函數。這個方法沒有傳回值。
  • map():對數組中的每一項運作給定函數,傳回每次函數調用的結果組成的數組。
  • some():對數組中的每一項運作給定函數,如果該函數對任一項傳回 true,則傳回 true。

每個方法都接收兩個參數:

1、要在每一項上運作的函數

2、運作該函數的作用域對象–影響this的值(可選)。

運作的函數會接受三個參數:1)數組項的值 2)**該項在數組中的位置(下标)**3)數組對象本身。

forEach ( )

對數組的每一項運作給定函數。該方法沒有傳回值 。用法其實和for循環一樣

var resulte = arrTemp.forEach((item, index, array) => {

	if(item){
   		 ...
	}

});
           

some ( )和every ( )

every()和 some(),它們都用于查詢數組中的項是否滿足某個條件。 對 every()來說,傳入的函數必須對每一項都傳回 true,這個方法才傳回 true;否則,它就傳回 false。而 some()方法則是隻要傳入的函數對數組中的某一項傳回 true,就會傳回 true,了解時,可以借助邏輯與或的關系
var arrTemp  = [1, 2, 3, 4;

var everyResult = arrTemp.every(function (item, index, array) { 
    
    return (item > 2); // 每一項都大于2才會傳回true
    
});

alert(everyResult);    // false 

var someResult = arrTemp.some(function (item, index, array) { 
    
    return (item > 2); // 隻要有一項大于2就會傳回true
    
});

alert(someResult);     // true 
           

filter ( )—過濾

filter()函數,它利用指定的函數确定是否在傳回的數組中包含某一項。例如,要 傳回一個所有數值都大于 2的數組,可以使用以下代碼。
var arrTemp = [1, 2, 3, 4];

var filterResult = arrTemp.filter(function (item, index, array) { 
    
    return (item > 2); 
    
});

alert(filterResult);  //[3,4]
           

再寫一個其他的例子:

const totalUserList=[
    {postId:'xxxxxxx',postName:'yyyyyyy'},
    {postId:'ccccccc',postName:'ddddddd'},
    {postId:'bbbbbbb',postName:'aaaaaaa'}
]
filterUserList(type) {
    
    const list = totalUserList.filter((item) => {
        
       return item.postId === type
        
    });
    // 傳回的 list 中,都是postId和totalUserList中一樣的資料
  }
           

map ( )

map( )也傳回一個數組,而這個數組的每一項都是在原始數組中的對應項上運作傳入函數的結果。 例如,可以給數組中的每一項乘以 2,然後傳回這些乘積組成的數組,如下所示。
var arrTemp = [1, 2, 3, 4, 5, 4, 3, 2, 1];

var mapResult = arrTemp.map(function (item, index, array) { 
    
    return item * 2; 

});

alert(mapResult);  //[2,4,6,8] 
           

同樣,map()也可以用作循環:

...
let list = data.Service.Body.companyBriefInfoList || [];
list = list.map((item) => {
     return item.custName + '-' + item.custNo;
 });
           

重點:文章 内容 摘自《JavaScript進階程式設計》

繼續閱讀