處理陣列時,有時你會想對陣列中的每個值執行程式碼。這個過程稱為疊代,也就是對陣列執行迴圈。
這裡要看的是過程中不需要修改陣列的情況。如果你要轉換陣列,請參考陣列轉換。
for迴圈對陣列進行疊代最基本的方式,就是使用for迴圈,請參考for迴圈。
const numbers = [6.0221515, 10, 23];
for (let i = 0; i < numbers.length; i++) {
console.log(numbers[i]);
}
// => 6.0221515
// => 10
// => 23
for...of迴圈如果你想在每次疊代中直接處理值,完全不需要索引,就可以使用for...of迴圈。
for...of的運作方式和上面最基本的for迴圈一樣,但你不需要在迴圈裡用變數處理_索引_,而是直接取得_值_。
const numbers = [6.0221515, 10, 23];
// Because re-assigning number inside the loop will be very
// confusing, disallowing that via const is preferable.
for (const number of numbers) {
console.log(number);
}
// => 6.0221515
// => 10
// => 23
就像一般的for迴圈一樣,你可以用continue停止當前的疊代,用break完全停止迴圈的執行。
forEach方法每個陣列都有forEach方法,可以用來走訪陣列中的元素。
forEach接受一個回呼做為參數。
這個回呼函式會對陣列中的每個元素呼叫一次。
當前元素、它的索引,以及整個陣列,都會做為引數傳給回呼。
通常只會用到當前元素或索引。
const numbers = [6.0221515, 10, 23];
numbers.forEach((number, index) => console.log(number, index));
// => 6.0221515 0
// => 10 1
// => 23 2
一旦forEach迴圈開始執行,就沒有辦法停止疊代。break和continue這兩個敘述在這個情境中並不存在。
身為一位初露頭角的魔術師,Elyse 需要用各種不同的方式分析她的牌堆。為了簡單起見,她只使用數值 1 到 10 的牌。
Elyse 想知道她的牌堆裡有幾張特定類型的牌。
撰寫一個函式 cardTypeCheck,它接受兩個參數:一個牌的陣列(Elyse 的牌堆),以及要計算的牌的類型。
這個函式應該使用 forEach,並回傳牌堆中指定類型的牌的數量。
const cardType = 3;
cardTypeCheck([1, 2, 3, 4], cardType);
// => 1
為了另一個把戲,Elyse 需要知道她的牌堆裡有幾張奇數或偶數的牌。
實作一個函式 determineOddEvenCards,它接受兩個參數:一個牌的陣列(Elyse 的牌堆),以及一個布林值(true 等同於「偶數」,false 等同於「奇數」)。
這個函式應該回傳一個數字:牌堆裡奇數或偶數牌的數量(取決於第二個引數的值)。
為了練習,這次在函式實作裡使用 for...of 迴圈。
determineOddEvenCards([1, 2, 3, 1, 5, 6], true);
// => 2
determineOddEvenCards([1, 2, 3, 1, 5, 6], false);
// => 4