在 JavaScript 中獲取陣列的第一個元素

1. 在 JavaScript 中使用 find() 獲取第一個陣列元素
2. 在 JavaScript 中使用 array[index] 獲取第一個陣列元素
3. 在 JavaScript 中使用 shift() 獲取第一個陣列元素
4. 在 JavaScript 中使用 filter() 獲取第一個陣列元素
5. 在 JavaScript 中使用解構賦值獲取第一個陣列元素

陣列是任何程式語言的重要組成部分，因為它以有序的方式儲存了許多元素。它們中的所有這些元素都通過索引訪問。在 JavaScript 中，陣列是儲存特定鍵（數字鍵）上的值的常規物件。本文將介紹如何在 JavaScript 中獲取陣列的第一個元素。

JavaScript 提供了各種方法來獲取第一個元素。讓我們學習這些方法。

在 JavaScript 中使用 find() 獲取第一個陣列元素

它是 JavaScript 提供的內建陣列方法，用於查詢值與指定條件匹配的元素。

JavaScript 中 find() 的語法

Array.prototype.find(element => $condition)

引數

• $condition：這是一個強制性引數。使用者可以傳遞與陣列元素相關的任何條件，它會嘗試找出第一個滿足條件的匹配元素。

返回值

返回與給定條件匹配的第一個值。如果沒有條件匹配，它將返回 undefined。

示例程式碼：

const arrayElements = [5, 10, 0, 20, 45];
const firstElement = arrayElements.find(element => element != undefined);
console.log(firstElement);

輸出：

5

在 JavaScript 中使用 array[index] 獲取第一個陣列元素

如前所述，每個陣列元素都有一個分配給它的唯一索引。陣列中的數字 key/index 以 0 開頭。使用此索引，你可以在 JavaScript 中檢索陣列的第一個元素。

JavaScript 中 array[index] 的語法

Array.prototype[$index]

引數

• $index：它是一個強制引數，只接受指定要檢索的元素索引的整數值。

返回值

它返回指定索引的元素。

示例程式碼：

const arrayElements = [5, 10, 0, 20, 45];
const firstElement = arrayElements[0];
console.log(firstElement);

輸出：

5

在 JavaScript 中使用 shift() 獲取第一個陣列元素

它是 JavaScript 提供的內建陣列方法，它移除陣列的第一個元素並返回移除的元素。這種陣列方法的唯一問題是它會改變/修改原始陣列。

JavaScript 中 shift() 的語法

Array.prototype.shift()

返回值

它返回陣列的第一個元素，該元素從原始陣列中刪除。如果陣列是空陣列，它將返回 undefined。

示例程式碼：

const arrayElements = [5, 10, 0, 20, 45];
const firstElement = arrayElements.shift(0);
console.log(firstElement);
console.log(arrayElements);

輸出：

5
Array [10, 0, 20, 45]

在 JavaScript 中使用 filter() 獲取第一個陣列元素

它是一種 JavaScript 內建陣列方法，可過濾掉所有滿足給定條件的元素。它將建立匹配元素陣列的副本。find() 和 filter() 之間的唯一區別在於，一旦找到第一個匹配元素，首先停止遍歷，而稍後將繼續直到陣列的最後一個元素。由於遍歷屬性，如果陣列大小較大，則效率較低。

JavaScript 中 filter() 的語法

Array.prototype.filter(element => $condition)

引數

• $condition：這是一個強制性引數。使用者可以傳遞與陣列元素相關的任何條件，它會嘗試找出所有滿足條件的匹配元素。

返回值

返回包含與給定條件匹配的元素的新陣列。

示例程式碼：

const arrayElements = [5, 10, 0, 20, 45];
const firstElement =
    arrayElements.filter(element => element != undefined).shift();
console.log(firstElement);
console.log(arrayElements);

輸出：

5
Array [5, 10, 0, 20, 45]

在 JavaScript 中使用解構賦值獲取第一個陣列元素

析構賦值是 JavaScript 中一種非常強大的語法，它允許將陣列元素或物件屬性解包到不同的變數中。

JavaScript 中解構賦值的語法

[$variable1, $variable2, ...$restVariables] = [10, 20, 30, 40];
{$variable1} = {key: value};

返回值

它返回新變數，你可以通過該變數訪問陣列或物件的值。

示例程式碼：

const arrayElements = [5, 10, 0, 20, 45];
let [firstElement] = arrayElements;
console.log(firstElement);

輸出：

5