我們必須了解 JavaScript 陣列方法

本指南探討了六種基本的 JavaScript 陣列方法：filter、map、reduce、some、every 和 includes。掌握這些將顯著提升您的 JavaScript 程式設計技能。

1。 filter()方法：

filter() 方法建立一個僅包含滿足指定條件的元素的新陣列。 不滿足條件的元素將被忽略。

工作原理：

• 迭代每個數組元素。
• 對每個元素套用回呼函數。
• 如果回呼回傳true，則該元素包含在新數組中；否則，將被排除在外。

<code class="language-javascript">let boxers = [
    { name: "Tyson Fury", weight: 280 },
    { name: "Mairis Briedis", weight: 199 },
    { name: "Artur Beterbiev", weight: 175 },
    { name: "Jermall Charlo", weight: 160 },
    { name: "Terence Crawford", weight: 146 }
];

// Filter boxers weighing over 170 pounds
let heavyweights = boxers.filter(boxer => boxer.weight > 170);

console.log(heavyweights);</code>

輸出：

<code class="language-javascript">[
    { name: "Tyson Fury", weight: 280 },
    { name: "Mairis Briedis", weight: 199 },
    { name: "Artur Beterbiev", weight: 175 }
]</code>

2。 map()方法：

map() 方法轉換陣列的每個元素並傳回包含轉換後的元素的新陣列。

工作原理：

• 迭代每個數組元素。
• 對每個元素套用回呼函數。
• 回呼的回傳值取代新陣列中的原始元素。

<code class="language-javascript">let decimalNumbers = [222, 354, 4684, 123, 5];

// Convert decimal numbers to hexadecimal
let hexNumbers = decimalNumbers.map(num => num.toString(16));

console.log(hexNumbers);</code>

3。 reduce()方法：

reduce() 方法迭代地將回呼函數應用於每個元素，累積單一結果值。

工作原理：

• 迭代數組。
• 將回呼應用於累加器和目前元素。
• 回呼的結果成為新的累加器值。
• 傳回最終累加器值。

<code class="language-javascript">let numbers = [1, 2, 3, 4, 5];

// Calculate the sum of all numbers
let sum = numbers.reduce((accumulator, current) => accumulator + current, 0);

console.log(sum); // Output: 15</code>

4。 some()方法：

some() 方法檢查是否至少有一個元素滿足給定條件。 如果找到匹配，則返回 true，否則返回 false。

工作原理：

• 迭代數組。
• 找到滿足條件的元素後立即停止並回傳true。
• 如果沒有元素滿足條件，則回傳false。

<code class="language-javascript">let ages = [16, 20, 14, 18];

// Check if at least one person is an adult (≥ 18)
let hasAdult = ages.some(age => age >= 18);

console.log(hasAdult); // Output: true</code>

5。 every()方法：

every() 方法檢查所有 元素是否滿足給定條件。 僅當每個元素都通過時才返回 true；否則，false。

工作原理：

• 迭代數組。
• 如果元素不符合條件，則立即回傳 false。
• 僅當所有元素都通過時才回傳 true。

<code class="language-javascript">let scores = [80, 85, 90, 95];

// Check if all scores are above 75
let allAbove75 = scores.every(score => score > 75);

console.log(allAbove75); // Output: true</code>

6。 includes()方法：

includes() 方法檢查陣列是否包含特定值。如果找到則回傳 true，否則回傳 false。

工作原理：

• 使用嚴格相等搜尋值 (===)。
• 可以指定可選的起始索引。

<code class="language-javascript">let boxers = [
    { name: "Tyson Fury", weight: 280 },
    { name: "Mairis Briedis", weight: 199 },
    { name: "Artur Beterbiev", weight: 175 },
    { name: "Jermall Charlo", weight: 160 },
    { name: "Terence Crawford", weight: 146 }
];

// Filter boxers weighing over 170 pounds
let heavyweights = boxers.filter(boxer => boxer.weight > 170);

console.log(heavyweights);</code>

以上是我們必須了解 JavaScript 陣列方法的詳細內容。更多資訊請關注PHP中文網其他相關文章！