在 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