本篇內(nèi)容介紹了“javaScript數(shù)組遍歷和對稀疏數(shù)組處理方法有哪些”的有關(guān)知識，在實際案例的操作過程中，不少人都會遇到這樣的困境，接下來就讓小編帶領(lǐng)大家學(xué)習(xí)一下如何處理這些情況吧！希望大家仔細(xì)閱讀，能夠?qū)W有所成！

創(chuàng)新互聯(lián)堅持“要么做到，要么別承諾”的工作理念，服務(wù)領(lǐng)域包括：成都做網(wǎng)站、成都網(wǎng)站制作、成都外貿(mào)網(wǎng)站建設(shè)、企業(yè)官網(wǎng)、英文網(wǎng)站、手機(jī)端網(wǎng)站、網(wǎng)站推廣等服務(wù)，滿足客戶于互聯(lián)網(wǎng)時代的市中網(wǎng)站設(shè)計、移動媒體設(shè)計的需求，幫助企業(yè)找到有效的互聯(lián)網(wǎng)解決方案。努力成為您成熟可靠的網(wǎng)絡(luò)建設(shè)合作伙伴！

1.forEach()方法

  forEach（參數(shù)1，參數(shù)2）方法本身可以接收兩個參數(shù)，第一個參數(shù)是一個函數(shù)，并且數(shù)組中的每一個元素均會調(diào)用一遍這個函數(shù)（稀疏數(shù)組除外）。一般來說，我們只會傳入第一個參數(shù)（且為必傳項），此處也不對其他參數(shù)多做介紹。下述其他方法的傳參情況與forEach（）相同。

  且下述方法中，作為參數(shù)傳入的函數(shù)其本身也有參數(shù)值，分別為：數(shù)組元素的值，數(shù)組元素的索引和數(shù)組本身。即：

myArray.forEach(

    function (數(shù)組元素的值，數(shù)組元素的索引，數(shù)組本身) {

    }

)

補充：function（a） { return a+3} 為沒有函數(shù)名稱的匿名函數(shù)， 其可寫成箭頭函數(shù)的形式

a => a+3

示例:

let myArray = [1,2,3];

// num=>{} 箭頭函數(shù),相當(dāng)于一個匿名函數(shù)

// function(num) { num = num * 3 }

myArray.forEach(num => {

    num = num * 3;

});

console.log(myArray) //打印結(jié)果為[ 1, 2, 3 ]

  forEach()方法沒有返回值，且沒有像普通for循環(huán)一樣可以終止迭代的break語句，并且正如上文所說，我們在此處對num進(jìn)行的改變不會更改到myArray數(shù)組中。

2.map()方法

  map()與forEach（）方法不同的點在于，map（）方法的第一個參數(shù)函數(shù)會接收我們每個數(shù)組的元素，并可以返回一個值。而整個map（）方法的返回值就是這個函數(shù)的返回值所構(gòu)成的數(shù)組。

  例：

let myArray = [1,2,3]

let result = myArray.map(num => {

    num *= 3

    return num

});

console.log(result,"\n原數(shù)組",myArray)

// 打印結(jié)果為

// [ 3, 6, 9 ] 

// 原數(shù)組 [ 1, 2, 3 ]

3.filter()

  filter()方法也有返回值，但他期望參數(shù)函數(shù)的返回值是一個boolean類型，也就是說它期望參數(shù)函數(shù)為斷言函數(shù)。它的返回值是一個滿足條件的myArray中的元素組成的數(shù)組。

示例：

let myArray = [1,2,3]

let result = myArray.filter(num => {

    num *= 3

    return num > 5

});

console.log(result)

//[ 2, 3 ]

  我們可以看到num值經(jīng)過運算后為3、6、9，其中6和9滿足大于5的條件。其返回值是數(shù)組中的2、3這兩個元素，而不是運算后的結(jié)果。

4.一些非常用方法

find（）和 findIndex()

  這兩個方法與filter（）相似，但他們會在找到第一個滿足條件的值時停止迭代，find()方法會返回該元素的值，而findIndex（）方法會返回這個元素在數(shù)組中的索引。例：

let myArray = [1,2,3]

let result = myArray.find(num => {

    num *= 3

    return num > 5

});

console.log(result) // 打印值為： 2

let myArray = [1,2,3]

let result = myArray.findIndex(num => {

    num *= 3

    return num > 5

});

console.log(result) // 打印值為： 1

every() 和 some()

  every（）和some（）函數(shù)返回值為boolean類型，亦會使用一個斷言函數(shù)作為第一個入?yún)ⅲ挥袛?shù)組中所有元素都滿足斷言函數(shù)的條件時，every（）才會返回true，當(dāng)有一個元素不滿足條件時，every()會停止遍歷并返回false。

let myArray = [4,1,2,3];

let count = 0; // 用于記錄遍歷的次數(shù)

let result = myArray.every(num => {

    count++;

    num *= 3;

    return num > 5;

});

console.log(result,"遍歷的次數(shù)為",count) 

// 打印值為： false 遍歷的次數(shù)為 2

  而some（）函數(shù)只要有一個滿足條件便會停止遍歷，返回true值。

let myArray = [4,1,2,3];

let count = 0; // 用于記錄遍歷的次數(shù)

let result = myArray.some(num => {

    count++;

    num *= 3;

    return num > 5;

});

console.log(result,"遍歷的次數(shù)為",count) 

// 打印值為： true 遍歷的次數(shù)為 1

  此處需要注意的是 myArray數(shù)組的元素經(jīng)過乘3運算后的結(jié)果為1、6、9，其中6和9滿足大于5的條件，但其返回的是myArray中的元素，也就是沒有經(jīng)過運算的2和3。（不滿足條件的元素不會被返回，此處與map（）不同，map() 返回的數(shù)組長度與原數(shù)組一樣。）

對于稀疏數(shù)組的處理

  稀疏數(shù)組定義:

稀疏數(shù)組就是其元素沒有從0開始的索引的數(shù)組。正常情況下，數(shù)組的length屬性表明數(shù)組中元素的個數(shù)。如果數(shù)組是稀疏的，則length屬性的值會大于元素個數(shù)。

  正常的數(shù)組如 let myArray = [0,1,2]，這個數(shù)組的長度為3，元素個數(shù)為3，與數(shù)組長度相同，索引依次為0、1、2。

  稀疏數(shù)組簡單實踐：

let testArray = new Array(10);  //數(shù)組長度為10

testArray[20] = 1 //數(shù)組長度為21

console.log(testArray) // 打印結(jié)果為 [ <20 empty items>, 1 ]

&emsp;&emsp;此時數(shù)組長度為21，而元素只有一個，這就變成了一個稀疏數(shù)組。而造就稀疏數(shù)組的實際應(yīng)用場景可能在運用delete刪除數(shù)組元素時發(fā)生，如：

let myArray = [1,2,3]

delete  myArray[1]

console.log(myArray,"數(shù)組的長度為",myArray.length)

console.log(1 in myArray)

// 打印結(jié)果為

// [ 1, <1 empty item>, 3 ] 數(shù)組的長度為 3

// 索引為1的元素是否存在 false

&emsp;&emsp;delete并不會修改數(shù)組的長度，也不會改變其他元素的索引值，所以會形成一個稀疏數(shù)組。如果想要元素索引值隨著數(shù)組元素的刪減而變化，可以使用splice（）方法。

forEach()方法不會遍歷稀疏數(shù)組中缺失元素

let myArray = [4,,2,3];

console.log("myArray",myArray)  

// 打印值為：myArray [ 4, <1 empty item>, 2, 3 ]

let count = 0; // 用于記錄遍歷的次數(shù)

myArray.forEach(num => {

    count++;

});

console.log("數(shù)組的長度為",myArray.length,"遍歷的次數(shù)為",count) 

// 數(shù)組的長度為 4 遍歷的次數(shù)為 3

map()也不會遍歷稀疏數(shù)組中缺失元素，但其返回值數(shù)組與原數(shù)組長度相同，且缺失的元素位置也相同

let myArray = [4,,2,3];

console.log("myArray",myArray)

// 打印值為：myArray [ 4, <1 empty item>, 2, 3 ]

let count = 0; // 用于記錄遍歷的次數(shù)

let result = myArray.map(num => {

    count++;

    return num*3

});

console.log("數(shù)組的長度為",myArray.length,"遍歷的次數(shù)為",count,"返回的數(shù)組為",result)

// 打印值為： 數(shù)組的長度為 4 

// 遍歷的次數(shù)為 3 

// 返回的數(shù)組為 [ 12, <1 empty item>, 6, 9 ]

filter（）的返回值不會包含稀疏數(shù)組中缺失的元素

let myArray = [4,,2,3];

console.log("myArray",myArray)

// 打印值為：myArray [ 4, <1 empty item>, 2, 3 ]

let count = 0; // 用于記錄遍歷的次數(shù)

let result = myArray.filter(num => {

    count++;

    return num>1

});

console.log("數(shù)組的長度為",myArray.length,"遍歷的次數(shù)為",count,"返回的數(shù)組為",result)

// 打印值為： 數(shù)組的長度為 4

// 遍歷的次數(shù)為 3

// 返回的數(shù)組為 [ 4, 2, 3 ]

“javaScript數(shù)組遍歷和對稀疏數(shù)組處理方法有哪些”的內(nèi)容就介紹到這里了，感謝大家的閱讀。如果想了解更多行業(yè)相關(guān)的知識可以關(guān)注創(chuàng)新互聯(lián)網(wǎng)站，小編將為大家輸出更多高質(zhì)量的實用文章！

文章題目：javaScript數(shù)組遍歷和對稀疏數(shù)組處理方法有哪些
當(dāng)前路徑：http://jinyejixie.com/article44/iejjhe.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供品牌網(wǎng)站設(shè)計、Google、定制網(wǎng)站、外貿(mào)建站、營銷型網(wǎng)站建設(shè)、網(wǎng)站營銷

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)