JavaScript 数组
为什么要使用数组？
如果你有一组项目（例如，汽车名称列表），将汽车存储在单个变量中可能看起来像这样：
let car1 = "Saab";
let car2 = "Volvo";
let car3 = "BMW";
但是，如果你想循环遍历这些汽车并找到一个特定的汽车呢？ 如果你不是 3 辆汽车，而是 300 辆呢？
解决方案是数组！
数组可以在一个名称下存储多个值，你可以通过引用索引号访问这些值。
创建数组
使用数组字面量是创建 JavaScript 数组的最简单方法。
语法
const array_name = [item1, item2, ...];
建议使用 const 关键字声明数组。
在章节中了解更多关于 const 与数组的知识: JS 数组 Const.
空格和换行符并不重要。声明可以跨越多行。
你也可以先创建一个数组，然后提供元素。
使用 JavaScript 关键字 new
以下示例也创建了一个数组，并为它分配了值。
上面两个示例完全相同。
无需使用 new Array()。
为简化、可读性和执行速度，请使用数组字面量方法。
访问数组元素
您可以通过引用索引号来访问数组元素
const cars = ["Saab", "Volvo", "BMW"];
let car = cars[0];
自己尝试 »
注意：数组索引从 0 开始。
[0] 是第一个元素。[1] 是第二个元素。
更改数组元素
此语句更改了 cars 中第一个元素的值
cars[0] = "Opel";
将数组转换为字符串
JavaScript 方法 toString() 将数组转换为（逗号分隔的）数组值的字符串。
示例
const fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.toString();
结果
访问整个数组
在 JavaScript 中，可以通过引用数组名称来访问整个数组
数组是对象
数组是一种特殊的对象。JavaScript 中的 typeof 运算符对数组返回 "object"。
但是，JavaScript 数组最好描述为数组。
数组使用数字来访问其 "元素"。在此示例中，person[0] 返回 John
对象使用名称来访问其 "成员"。在此示例中，person.firstName 返回 John
数组元素可以是对象
JavaScript 变量可以是对象。数组是特殊类型的对象。
因此，您可以在同一个数组中包含不同类型的变量。
您可以在数组中包含对象。您可以在数组中包含函数。您可以在数组中包含数组
myArray[0] = Date.now;
myArray[1] = myFunction;
myArray[2] = myCars;
数组属性和方法
JavaScript 数组的真正优势在于其内置的数组属性和方法
cars.length // 返回元素数量
cars.sort() // 对数组进行排序
数组方法将在后面的章节中介绍。
length 属性
数组的 length 属性返回数组的长度（数组元素数量）。
length 属性始终比最高数组索引多 1。
访问第一个数组元素
访问最后一个数组元素
示例
const fruits = ["Banana", "Orange", "Apple", "Mango"];
let fruit = fruits[fruits.length - 1];
自己尝试 »
循环遍历数组元素
循环遍历数组的一种方法是使用 for 循环
示例
const fruits = ["Banana", "Orange", "Apple", "Mango"];
let fLen = fruits.length;
let text = "<ul>";
for (let i = 0; i < fLen; i++) {
text += "<li>" + fruits[i] + "</li>";
}
text += "</ul>";
自己尝试 »
您还可以使用 Array.forEach() 函数
示例
const fruits = ["Banana", "Orange", "Apple", "Mango"];
let text = "<ul>";
fruits.forEach(myFunction);
text += "</ul>";
function myFunction(value) {
text += "<li>" + value + "</li>";
}
自己尝试 »
添加数组元素
向数组添加新元素最简单的方法是使用 push() 方法
示例
const fruits = ["Banana", "Orange", "Apple"];
fruits.push("Lemon"); // 向 fruits 添加新元素（Lemon）
自己尝试 »
也可以使用 length 属性将新元素添加到数组中
示例
const fruits = ["Banana", "Orange", "Apple"];
fruits[fruits.length] = "Lemon"; // 向 fruits 添加 "Lemon"
自己尝试 »
警告！
使用高索引添加元素可能会在数组中创建未定义的 "空洞"
示例
const fruits = ["Banana", "Orange", "Apple"];
fruits[6] = "Lemon"; // 在 fruits 中创建未定义的 "空洞"
自己尝试 »
关联数组
许多编程语言支持具有命名索引的数组。
具有命名索引的数组称为关联数组（或哈希）。
JavaScript不支持具有命名索引的数组。
在 JavaScript 中，数组始终使用编号索引。
示例
const person = [];
person[0] = "John";
person[1] = "Doe";
person[2] = 46;
person.length; // 将返回 3
person[0]; // 将返回 "John"
自己尝试 »
警告！！
如果使用命名索引，JavaScript 将重新定义数组为对象。
之后，某些数组方法和属性将产生不正确的结果。
示例
const person = [];
person["firstName"] = "John";
person["lastName"] = "Doe";
person["age"] = 46;
person.length; // 将返回 0
person[0]; // 将返回 undefined
自己尝试 »
数组和对象的区别
在 JavaScript 中，数组使用编号索引。
在 JavaScript 中，对象使用命名索引。
数组是特殊类型的对象，具有编号索引。
何时使用数组。何时使用对象。
- JavaScript 不支持关联数组。
- 当您希望元素名称为字符串（文本）时，应使用对象。
- 当您希望元素名称为数字时，应使用数组。
JavaScript new Array()
JavaScript 具有内置的数组构造函数 new Array()。
但是您可以安全地使用 [] 代替。
这两个不同的语句都创建了一个名为 points 的新空数组
const points = new Array();
const points = [];
这两个不同的语句都创建了一个包含 6 个数字的新数组
const points = new Array(40, 100, 1, 5, 25, 10);
const points = [40, 100, 1, 5, 25, 10];
自己尝试 »
new 关键字可能会产生一些意外的结果
// 创建一个包含三个元素的数组
const points = new Array(40, 100, 1);
自己尝试 »
// 创建一个包含两个元素的数组
const points = new Array(40, 100);
自己尝试 »
// 创建一个包含一个元素的数组？？？
const points = new Array(40);
自己尝试 »
常见错误
const points = [40];
与以下语句不同
const points = new Array(40);
// 创建一个包含一个元素的数组
const points = [40];
自己尝试 »
// 创建一个包含 40 个未定义元素的数组
const points = new Array(40);
自己尝试 »
如何识别数组
一个常见问题是：如何知道一个变量是否为数组？
问题在于 JavaScript 运算符 typeof 返回 "object"
const fruits = ["Banana", "Orange", "Apple"];
let type = typeof fruits;
自己尝试 »
typeof 运算符返回 object，因为 JavaScript 数组是对象。
解决方案 1
为了解决这个问题，ECMAScript 5（JavaScript 2009）定义了一个新的方法 Array.isArray()
Array.isArray(fruits);
自己尝试 »
解决方案 2
instanceof 运算符如果对象是由给定构造函数创建的，则返回 true
const fruits = ["Banana", "Orange", "Apple"];
(fruits instanceof Array);
自己尝试 »
嵌套数组和对象
对象中的值可以是数组，数组中的值可以是对象
示例
const myObj = {
name: "John",
age: 30,
cars: [
{name:"Ford", models:["Fiesta", "Focus", "Mustang"]},
{name:"BMW", models:["320", "X3", "X5"]},
{name:"Fiat", models:["500", "Panda"]}
]
}
要访问数组内部的数组，请对每个数组使用 for-in 循环
示例
for (let i in myObj.cars) {
x += "<h1>" + myObj.cars[i].name + "</h1>";
for (let j in myObj.cars[i].models) {
x += myObj.cars[i].models[j];
}
}
自己尝试 »
