摘要:在本教程中,您将了解 JavaScript 数组及其基本操作。
JavaScript 数组简介
在 JavaScript 中,数组是有序的值列表。每个值称为元素,由一个索引指定。
JavaScript 数组具有以下特点
- 首先,数组可以包含混合类型的值。例如,您可以创建一个包含数字、字符串、布尔值和 null 类型元素的数组。
- 其次,数组的大小是动态的且自动增长的。换句话说,您不需要预先指定数组的大小。
创建 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); // 3
Code 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); // 2
Code language: JavaScript (javascript)
6) 检查值是否为数组
要检查值是否为数组,您可以使用Array.isArray()
方法。
console.log(Array.isArray(seas)); // true
Code language: JavaScript (javascript)
摘要
- 在 JavaScript 中,数组是有序的值列表。每个值称为元素,由一个索引指定。
- 数组可以包含混合类型的值。
- JavaScript 数组是动态的,这意味着它们会根据需要增长或缩小。