如何在JavaScript中获取数组中的元素数量

2,337 阅读3分钟

简介

数组是用来存储一个有序的数值集合的。这些值可以是同一数据类型的组合,也可以是多种数据类型的组合--整数、浮点数、字符串、布尔值、对象,以及更多。

用JavaScript获取数组中的元素数量是消耗数据或在JavaScript中使用API时的一个常见操作。这可以通过利用length 属性或遍历一个数组并计算元素来完成。

在这篇文章中,我们将学习如何用JavaScript获得一个数组中的元素数量,以及更多的内容--如何计算唯一的元素,以及如何根据某些条件计算数组中的元素。

使用内置的length属性

获取一个数组中元素总数的标准方法是使用内置的length 属性。

let myArray = [99, 101.5, "John Doe", true, { age: 44 }];
let total = myArray.length;
console.log(total); // Output: 5

// Alternatevly:
let total = [99, 101.5, "John Doe", true, { age: 44 }].length;
console.log(total); // Output: 5

注意: length 是指一个数组长度的缓存值,是在数组创建时计算出来的。因此,你不要通过显式地调用length ,也不要隐式地调用 来遍历数组。这保证了length ,可以扩展到一个任意的水平,并且不会影响你的应用程序的性能,比如你在手动循环时感受到的影响。

在JavaScript中使用循环

JavaScript的循环也可以用来计算一个数组的长度,方法是遍历数组并为数组中的每个元素将计数器变量递增1。这主要是在你想对元素本身或某一特定元素进行某些操作时使用,因为我们是在遍历数组中的所有元素。

**注意:**这种方法与前面介绍的length 属性相比更难,虽然,它本身就很简单。值得注意的是,较长的数组需要更长的时间来迭代,而length ,以恒定的查找时间返回缓存的值。

for循环

let myArray = [99, 101.5, "John Doe", true, { age: 44 }];

// Counter variable
let total = 0;

for (let i = 0; i < myArray.length; i++) {
    total++;
}

console.log(total); // Output: 5

for...in循环

let myArray = [99, 101.5, "John Doe", true, { age: 44 }];

let total = 0;
for (i in myArray) {
    total++;
}

console.log(total); // Output: 5

获取数组中唯一元素的数量

JavaScript中的数组可以有多个不同数据类型的元素,这些元素可能包括一些重复的元素。如果我们想得到唯一元素的数量,我们可以使用Set()构造函数。

它从作为其参数传递的数组中创建一个集合。因此,它可以帮助我们删除重复的元素,并且只返回唯一的元素(一个集合是唯一元素的集合)。当重复的元素被删除后,我们可以使用length 属性来获得唯一元素的数量。

**提示:**如果你想了解更多关于如何在JavaScript中删除数组中的重复元素,你应该阅读《如何在JavaScript中删除数组中的重复元素!

例如,假设我们有一个名字数组,总共有7个元素,其中有6个是唯一的。我们可以先得到唯一的元素,然后利用length 属性来得到长度。

let names = ["John", "Dan", "Jane", "Sam", "Alisa", "John", "Pete"];
let uniqueNames = [...new Set(names)];
let totalPeople = uniqueNames.length;

console.log(totalPeople); // Output: 6

**注意:**这也可以用循环来进行。当我们得到存储在新数组中的唯一元素后,我们所要做的就是像我们之前所做的那样,对它进行循环并计算元素。

如果一个数组包含其他数组的元素怎么办?

正如我们之前所说,JavaScript中的数组可以包含许多数据类型的元素--包括Array 数据类型。这在一开始可能有点令人困惑,但当你掌握了length 属性如何计算那些子数组时,你就可以顺利地处理这种情况了。

第一个可能想到的方法是使用length 属性。

let myArray = [["John", "Pete"], [90, 2], [], [34, 45, 2], [9,4], "John Doe", true, [19]];
let total = myArray.length;

console.log(total); // Output: 8

请注意length 属性是如何将每个子数组视为一个元素的。它不考虑子数组的内容--不管它是空的还是有大量的元素,它都被算作原始数组的一个元素(在这种情况下,myArray )。

获取包含其他数组的数组中的元素数

现在我们来学习如何计算一个数组中所有元素的数量--包括子数组元素中的那些元素。我们可以使用几种方法,如for 循环或for...in ,等等。

我们首先将totalLength 初始化为0,然后创建一个函数(myLength()),用来循环数组并计算其元素的数量。首先,我们需要循环浏览原始数组并考虑其每个元素。如果元素不是一个数组,我们只需将totalLength 增加1。另一方面,如果当前元素是一个数组(原数组的子数组),我们将递归地调用myLength 方法来计算其元素的数量。

let myArray = [["John", "Pete"], [90, 2], [], [34, 45, 2], [9,4], "John Doe", true, [19]];

let totalLength = 0;
const myLength = (array) => {
    // For each element of the `myArray`
    for (let i in array) {
        // If the element is an array
        // recursively call `myLength` to calculate
		// the length of the current element
        // Otherwise, just increment the `totalLength`
        if (Array.isArray(array[i])) {
            myLength(array[i]);
        } else {
            totalLength++;
        }
    }
};

myLength(myArray);
console.log(totalLength); // Output: 12

myArray另外,你可以简单地在flat() 方法,通过递归连接所有的元素到一个一维数组,使其扁平化,然后在新数组上调用length

console.log(myArray.flat().length) // Output: 12

基于条件的计数

就像我们前面提到的,我们也可以根据某些条件来计算一个数组中的元素数量。例如,假设我们有一个由对象组成的学生数组,每个对象包含学生的名字和分数。

const students = [
    { name: "John Doe", score: 70 },
    { name: "Jane Doe", score: 40 },
    { name: "Sarah Jane", score: 33 },
    { name: "John Tough", score: 84 },
    { name: "Jabes Tough", score: 64 }
];

我们可以通过循环查看每个元素,并计算通过预定义条件的元素,从而计算出得分超过60分的学生总数。

let total = 0;

students.forEach((student) => {
    if (student.score >= 60) {
        total++;
    }
});

console.log(total); // Output: 3

这也适用于其他迭代方法,如for 循环。

let total = 0;

for (let i = 0; i < students.length; i++) {
    if (students[i].score >= 60) {
        total++;
    }
}

console.log(total); // Output: 3

结论

在这篇文章中,我们学习了如何获得数组中的元素数,我们看到了可能需要我们获得数组长度的各种情况以及我们如何实现这些情况。