JavaScript 数组
为什么要使用数组?
如果您有一个项目列表(例如,汽车名称列表),则将汽车存储在单个变量中可能如下所示:
让 car1 = "萨博";
让 car2 = "沃尔沃";
让 car3 = "宝马";
但是,如果你想循环遍历汽车并找到特定的一辆,该怎么办?如果你有的汽车不只是 3 辆,而是 300 辆,该怎么办?
解决方案是一个数组!
数组可以保存单个名称下的多个值,您可以通过引用索引号来访问这些值。
创建数组
使用数组文字是创建 JavaScript 数组的最简单方法。
句法:
常量 数组名称 = [项目1, 项目2, ...];
使用以下方式声明数组是一种常见的做法 常量 关键词。
学习更多关于 常量 本章中使用数组:JS 数组常量.
空格和换行并不重要。声明可以跨越多行:
您还可以创建一个数组,然后提供元素:
使用 JavaScript 关键字 new
下面的示例也创建一个数组,并为其分配值:
上面的两个例子作用完全相同。
无需使用 new Array()
.
为了简单性、可读性和执行速度,请使用数组文字方法。
访问数组元素
您可以通过引用来访问数组元素 索引号:
const cars = ["萨博", "沃尔沃", "宝马"];
让汽车 = 汽车[0];
亲自尝试 »
笔记: 数组索引从 0 开始。
[0] 是第一个元素。[1] 是第二个元素。
更改数组元素
此语句更改 cars
:
汽车[0] = "欧宝";
访问完整阵列
使用 JavaScript,可以通过引用数组名称来访问完整数组:
数组是对象
数组是一种特殊类型的对象。 typeof
JavaScript 中的运算符为数组返回“对象”。
但是,JavaScript 数组最好被描述为数组。
数组使用 数字 访问其“元素”。在此示例中,person[0]
返回 John:
对象使用 名称 访问其“成员”。在此示例中,person.firstName
返回 John:
数组元素可以是对象
JavaScript 变量可以是对象。数组是特殊的对象。
因此,您可以在同一个数组中拥有不同类型的变量。
数组中可以包含对象。数组中可以包含函数。数组中可以包含数组:
myArray[0] = 日期.现在;
myArray[1] = myFunction;
myArray[2] = myCars;
数组属性和方法
JavaScript 数组的真正优势在于内置的数组属性和方法:
cars.length // 返回元素的数量
cars.sort() // 对数组进行排序
数组方法将在下一章中介绍。
length 属性
这 length
数组的属性返回数组的长度(数组元素的数量)。
这 length
属性总是比最高数组索引多一。
访问第一个数组元素
访问最后一个数组元素
循环数组元素
循环遍历数组的一种方法是使用 for
环形:
例子
const 水果 = ["香蕉", "橙子", "苹果", "芒果"];
让 fLen = 水果.长度;
让文本 = “<ul> “;
对于(设 i = 0;i < fLen;i++){
文本 += “<li> “ + 水果[i] + “</li> “;
}
文本 += “</ul> “;
亲自尝试 »
您还可以使用 Array.forEach()
功能:
例子
const 水果 = ["香蕉", "橙子", "苹果", "芒果"];
让文本 = “<ul> “;
水果.forEach(myFunction);
文本 += “</ul> “;
函数 myFunction(值){
文本 += “<li> “ + 值 + ”</li> “;
}
亲自尝试 »
添加数组元素
向数组添加新元素的最简单方法是使用 push()
方法:
也可以使用以下方法将新元素添加到数组中 length
财产:
警告 !
添加具有高索引的元素可能会在数组中创建未定义的“洞”:
关联数组
许多编程语言支持具有命名索引的数组。
具有命名索引的数组称为关联数组(或哈希)。
JavaScript 确实 不是 支持具有命名索引的数组。
在 JavaScript 中, 数组 总是使用编号索引.
例子
const 人 = [];
person[0] = "约翰";
人[1] = "Doe";
人[2] = 46;
person.length; // 将返回 3
person[0]; // 将返回“John”
亲自尝试 »
警告 !!
如果使用命名索引,JavaScript 会将数组重新定义为对象。
此后,一些数组方法和属性将产生 错误结果.
例子:
const 人 = [];
人["firstName"] = "约翰";
人["lastName"] = "Doe";
人["年龄"] = 46;
person.length; // 将返回 0
person[0]; // 将返回未定义
亲自尝试 »
数组和对象之间的区别
在 JavaScript 中, 数组 使用编号索引.
在 JavaScript 中, 对象 使用命名索引.
数组是一种特殊的对象,具有编号索引。
何时使用数组。 何时使用对象。
- JavaScript 不支持关联数组。
- 你应该使用 对象 当你希望元素名称为字符串(文本).
- 你应该使用 数组 当你希望元素名称为数字.
JavaScript 新数组()
JavaScript 有一个内置的数组构造函数 new Array()
.
但你可以安全地使用 []
反而。
这两个不同的语句都创建了一个名为 points 的新空数组:
const points = new Array();
const 点 = [];
这两个不同的语句都创建一个包含 6 个数字的新数组:
const points = new Array(40, 100, 1, 5, 25, 10);
const 点 = [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 点 = [40];
与以下内容不同:
const points = new Array(40);
// 创建一个包含一个元素的数组:
const 点 = [40];
亲自尝试 »
// 创建一个包含 40 个未定义元素的数组:
const points = new Array(40);
亲自尝试 »
如何识别数组
一个常见的问题是:如何知道一个变量是否是一个数组?
问题在于 JavaScript 运算符 typeof
返回“object
":
const 水果 = ["香蕉", "橙子", "苹果"];
让类型 = 水果类型;
亲自尝试 »
typeof 运算符返回对象,因为 JavaScript 数组是一个对象。
解决方案 1:
为了解决这个问题,ECMAScript 5(JavaScript 2009)定义了一种新方法 Array.isArray()
:
Array.isArray(水果);
亲自尝试 »
解决方案 2:
这 instanceof
如果对象由给定的构造函数创建,则运算符返回 true:
const 水果 = ["香蕉", "橙子", "苹果"];
水果数组实例;
亲自尝试 »