天天看點

8 個有用的JavaScript中的數組函數(附代碼片段)

8 個有用的JavaScript中的數組函數(附代碼片段)

英文 | https://javascript.plainenglish.io/8-useful-array-functions-in-javascript-with-code-snippets-b8d5222bcab​

翻譯 | 楊小二

JavaScript 從一開始就有數組。這是一個非常有用的對象類型,它允許我們建立一個我們想要的任何類型的元素清單。子數組、購物清單或表中的資料都可以來自數組。

我不會在這裡詳細介紹數組,我假設你知道它們是如何工作的。但是,數組類型中内置了相當多的函數,當你在不同場景中實際使用數組時,這些函數非常有用。

1、Some and Every

有時,你想檢查數組中的元素是否符合任何預設測試。這個測試應該是一個函數的形式。如果你願意,這可以是一個箭頭函數。它應該為測試考慮一個論點。some 函數至少查找一個通過測試的元素,而 each 僅在所有值都通過測試時才傳回 true。

let arr [4, 5, 7, 8]
let some = arr.some((x) => x > 6);
// -> True


let every = arr.every((x) => x > 5);
// -> false      

2、Concat

可以使用 + 運算符對字元串進行連接配接,但是,這不能用數組完成。我們可以使用擴充運算符,也可以使用 concat 函數。我們可以在一個參數中給出我們想要添加到我們調用函數的數組中的數組。

const arr1 = ['a', 'b', 'c'];
const arr2 = ['d', 'e', 'f'];
const arr3 = arr1.concat(arr2);
// -> ["a", "b", "c", "d", "e", "f"]      

3、Length

最重要的函數之一(實際上隻是一個值)是長度值。它傳回數組中元素的數量。如果數組具有從索引 0 到 4 的值,它将傳回 5,因為它有五個元素。這在建立傳統的 for 循環時非常有用。

let arr = ['orange', 'apple', 'pear', 'dragonfruit'];
let num = arr.length;
// -> 4      

4、Includes

在數組中要做的另一個非常重要的任務是檢查數組中是否包含特定值。你可能想檢視使用者是否是素食主義者,或者食譜清單中是否包含某種成分。該函數将傳回一個布爾值,具體取決于是否在數組中找到了該值。

let fruits = ['apple', 'banana', 'lemon', 'lime'];
let hasCheeseburger = fruits.includes("cheeseburger");
// -> false      

5、Find and FindIndex

find 和 findIndex 函數非常相似。我們向函數傳遞一個測試,就像 some 一樣。該函數将傳回通過測試的第一個值,在 findIndex 的情況下,它将傳回通過測試的第一個元素所在的索引。

let arr = [1, 2, 3, 4, 5]
let found = arr.find((x) => x > 3)
// -> 4


let foundIndex = arr.findIndex((x) => x > 3)
// -> 3      

6、Map

map 函數是一個非常有名的函數,它簡單地将給定的函數應用于數組中的每個元素。它将傳回一個新數組。這對于建立 React 元素清單非常有用。

const arr = [1, 4, 9, 16];


// pass a function to map that multiplies every item
const arr2 = arr.map((item) => {
  return item * 2
});


console.log(arr2);
// expected output: Array [2, 8, 18, 32]      

7、Filter

過濾數組是另一個具有許多用例的基本功能。你必須為它提供一個函數。如果某個元素通過了該測試,則将其包含在新數組中,否則不包含在新數組中。

function isOldEnough(value) {
  return value >= 18;
}


var filtered = [12, 5, 8, 34, 44].filter(isOldEnough);
// -> [34, 44]      

8、ForEach

除了使用for 循環,你還可以使用内置于數組中的 forEach 函數。它将為數組中的每個項目執行一個函數。它本質上将 for(i=0;i<arr.length;i++) 文法縮短為 arr.forEach() 。這是循環數組的一種非常優雅的方式。你可以在函數中輸入 item 和 index 參數。

let arr = [1, 2, 3, 4]
arr.forEach((item) => {
  console.log(item) 
})      

結論

使用數組會很有趣。它也可能是可怕的,如果你不知道如何與他們合作。幸運的是,它們非常容易掌握,有了這些函數,你在代碼中處理數組時就無需擔心了。

繼續閱讀