JavaScript 数组

摘要:在本教程中,您将了解 JavaScript 数组及其基本操作。

JavaScript 数组简介

在 JavaScript 中,数组是有序的值列表。每个值称为元素,由一个索引指定。

JavaScript 数组具有以下特点

  1. 首先,数组可以包含混合类型的值。例如,您可以创建一个包含数字、字符串、布尔值和 null 类型元素的数组。
  2. 其次,数组的大小是动态的且自动增长的。换句话说,您不需要预先指定数组的大小。

创建 JavaScript 数组

JavaScript 提供两种方法来创建数组。第一种方法是使用Array构造函数,如下所示:

let scores = new Array();Code language: JavaScript (javascript)

scores数组为空,不包含任何元素。

如果您知道数组将包含的元素数量,您可以创建具有初始大小的数组,如下面的示例所示。

let scores = Array(10);Code language: JavaScript (javascript)

要创建数组并使用一些元素初始化它,您可以将元素作为逗号分隔的列表传递到Array()构造函数中。

例如,以下代码创建了包含五个元素(或数字)的scores数组。

let scores = new Array(9,10,8,7,6);Code language: JavaScript (javascript)

请注意,如果您使用Array()构造函数创建数组并将数字传递到其中,则您将创建一个具有初始大小的数组。

但是,当您将其他类型的值(如string)传递到Array()构造函数中时,您将创建一个包含该值元素的数组。例如

let athletes = new Array(3); // creates an array with initial size 3
let scores = new Array(1, 2, 3); // create an array with three numbers 1,2 3
let signs = new Array('Red'); // creates an array with one element 'Red'Code language: JavaScript (javascript)

JavaScript 允许您在使用 Array() 构造函数时省略new运算符。例如,以下语句创建artists数组。

let artists = Array();Code language: JavaScript (javascript)

在实践中,您很少使用Array()构造函数来创建数组。

创建数组的首选方法是使用数组字面量表示法。

let arrayName = [element1, element2, element3, ...];Code language: JavaScript (javascript)

数组字面量形式使用方括号[]来包装逗号分隔的元素列表。

以下示例创建了包含字符串元素的colors数组。

let colors = ['red', 'green', 'blue'];Code language: JavaScript (javascript)

要创建一个空数组,您可以像这样使用方括号,而无需指定任何元素。

let emptyArray = [];Code language: JavaScript (javascript)

访问 JavaScript 数组元素

JavaScript 数组是基于零索引的。换句话说,数组的第一个元素从索引 0 开始,第二个元素从索引 1 开始,依此类推。

要访问数组中的元素,您需要在方括号[]中指定索引。

arrayName[index]Code language: CSS (css)

以下显示了如何访问mountains数组的元素。

let mountains = ['Everest', 'Fuji', 'Nanga Parbat'];

console.log(mountains[0]); // 'Everest'
console.log(mountains[1]); // 'Fuji'
console.log(mountains[2]); // 'Nanga Parbat'Code language: JavaScript (javascript)

要更改元素的值,您可以将该值分配给元素,如下所示。

let mountains = ['Everest', 'Fuji', 'Nanga Parbat'];
mountains[2] = 'K2';

console.log(mountains);Code language: JavaScript (javascript)

输出

[ 'Everest', 'Fuji', 'K2' ]Code language: JSON / JSON with Comments (json)

获取数组大小

通常,数组的length属性返回元素数量。以下示例显示了如何使用length属性。

let mountains = ['Everest', 'Fuji', 'Nanga Parbat'];
console.log(mountains.length); // 3Code language: JavaScript (javascript)

数组的基本操作

以下解释了数组的一些基本操作。您将在下一教程中学习更高级的操作,如map()filter()reduce()

1) 在数组末尾添加元素

要向数组末尾添加元素,您可以使用push()方法。

let seas = ['Black Sea', 'Caribbean Sea', 'North Sea', 'Baltic Sea'];
seas.push('Red Sea');

console.log(seas); Code language: JavaScript (javascript)

输出

[ 'Black Sea', 'Caribbean Sea', 'North Sea', 'Baltic Sea', 'Red Sea' ]Code language: JSON / JSON with Comments (json)

2) 在数组开头添加元素

要向数组开头添加元素,您可以使用unshift()方法。

let seas = ['Black Sea', 'Caribbean Sea', 'North Sea', 'Baltic Sea'];
seas.unshift('Red Sea');

console.log(seas);Code language: JavaScript (javascript)

输出

[ 'Red Sea', 'Black Sea', 'Caribbean Sea', 'North Sea', 'Baltic Sea' ]Code language: JSON / JSON with Comments (json)

3) 从数组末尾删除元素

要从数组末尾删除元素,您可以使用pop()方法。

let seas = ['Black Sea', 'Caribbean Sea', 'North Sea', 'Baltic Sea'];
const lastElement = seas.pop();
console.log(lastElement); Code language: JavaScript (javascript)

输出

Baltic Sea

4) 从数组开头删除元素

要从数组开头删除元素,您可以使用shift()方法。

let seas = ['Black Sea', 'Caribbean Sea', 'North Sea', 'Baltic Sea'];
const firstElement = seas.shift();

console.log(firstElement);Code language: JavaScript (javascript)

输出

Black Sea

5) 查找数组中元素的索引

要查找元素的索引,您可以使用indexOf()方法。

let seas = ['Black Sea', 'Caribbean Sea', 'North Sea', 'Baltic Sea'];
let index = seas.indexOf('North Sea');

console.log(index); // 2Code language: JavaScript (javascript)

6) 检查值是否为数组

要检查值是否为数组,您可以使用Array.isArray()方法。

console.log(Array.isArray(seas)); // trueCode language: JavaScript (javascript)

摘要

  • 在 JavaScript 中,数组是有序的值列表。每个值称为元素,由一个索引指定。
  • 数组可以包含混合类型的值。
  • JavaScript 数组是动态的,这意味着它们会根据需要增长或缩小。
本教程对您有帮助吗?