数组02— Array Length：如何有效地使用数组的长度属性

在上节，我们学习了 JavaScript 数组及其基本操作，错过的小伙伴可以点击文章《【JavaScript 教程】第六章 数组01— 介绍JavaScript中的Array类型》进行学习。

那么，在今天的教程中，我们将一起来学习JavaScript Array length属性以及如何正确处理它。

JavaScript 数组长度属性究竟是什么

根据定义，数组的length属性是一个无符号的 32 位整数，它在数字上始终大于数组中的最高索引。

长度的值为 232。这意味着一个数组最多可以容纳 4294967296 (232 ) 个元素。

该length属性的行为取决于数组类型，包括密集和稀疏。

1) 、密集数组

密集数组是其元素具有从零开始的连续索引的数组。

对于密集数组，您可以使用该length属性来获取数组中的元素数。例如：

let colors = ['red', 'green', 'blue'];console.log(colors.length); // 3

在此示例中，该length属性返回三个，这与colors数组中的元素数相同。

下面的代码向colors数组中添加了一个元素：

colors.push('yellow');console.log(colors.length); // 4

现在，数组的length属性colors是4。

当您清空colors数组时，其长度为0：

colors = [];console.log(colors.length); // 0

2) 稀疏数组

稀疏数组是其元素没有从零开始的连续索引的数组。

例如，[10,, 20, 30]是一个稀疏数组，因为其元素的索引为 0、2 和 3。

在稀疏数组中，length 属性并不表示元素的实际数量。这是一个大于最高索引的数字。例如：

let numbers = [10, , 20, 30];console.log(numbers.length); // 4

在此示例中，numbers数组中的元素数为 三个：10、20 和 30。最高索引为 3。因此，该length属性返回4。

下面的代码在索引 10 处向 numbers 数组添加一个元素：

numbers[10] = 100;console.log(numbers.length); // 11

在此示例中，该length属性返回 11。

修改 JavaScript 数组长度属性

JavaScript 允许您更改数组length属性的值。通过更改长度的值，您可以从数组中删除元素或使数组稀疏。

1) 清空数组

如果将长度设置为零，则数组将为空：

const fruits = ['Apple', 'Orange', 'Strawberry'];fruits.length = 0;
console.log(fruits); // []

2) 删除元素

如果将数组的length属性设置为小于最高索引的值，则删除索引大于或等于新长度的所有元素。

以下示例将 Fruits 数组的 length 属性更改为 2，从而从数组中删除第三个元素：

const fruits = ['Apple', 'Orange', 'Strawberry'];fruits.length = 2;
console.log(fruits); // [ 'Apple', 'Orange' ]

3) 使数组稀疏

如果将数组的length属性设置为高于最高索引的值，则该数组将是空闲的。例如：

const fruits = ['Apple', 'Orange', 'Strawberry'];fruits.length = 5;
console.log(fruits); // [ 'Apple', 'Orange', 'Strawberry', <2 empty items> ]

总结

• 数组的length属性是一个无符号的 32 位整数，它在数字上总是大于数组的最高索引。

• length返回密集数组具有的元素数。

• 对于备用数组，length不反映数组中实际元素的数量。

• 修改length属性可以从数组中删除元素或使数组备用。