网页前端开发之Javascript入门篇(8/9)：数组
Javascript数组
什么是数组?
答：其概念跟 Python教程 的列表一样，只是叫法不同和语法上有所变化而已。
下面是数组的语法：
var aaa = "张三";
var bbb = [aaa, "李四", "王五"]; // 成员值可以是来自变量，也可以是直接的值
console.log(bbb);
其中
一对中括号 是创建数组的特定语法，在里面填入成员值，多个成员值之间用逗号隔开，最后赋值给一个变量保存即可。
在Javascript中，一个数组变量其实是其内置类Array的一个实例（Javascript会自动转换）。
因此它拥有一些类属性和类方法，你可以按照实例的语法去读取或调用它们。
下面是常见的数组用法：
读取
使用索引值来访问数组中指定位置的成员（术语称为：索引）。
其语法是： 数组名 带上一对 中括号 ，里面填入 索引值 即可。
📘 示例
var aaa = ["张三","李四","王五"];
var xxx = aaa[0];
console.log(xxx); // 输出：张三
长度
使用数组的类属性length来获取数组的长度（成员数量）。
📘 示例
var aaa = ["张三","李四","王五"];
var n = aaa.length;
console.log(n) // 输出：3
在头或尾部添加成员
使用数组的类方法push或unshift来添加成员。
📘 示例
var aaa = ["张三","李四","王五"];
console.log(aaa);
aaa.push("赵六"); // 追加一个成员到尾部
console.log(aaa);
// 输出：['张三', '李四', '孙七', '王五', '赵六']
aaa.unshift("孙七"); // 追加一个成员到头部
console.log(aaa);
// 输出：['孙七', '张三', '李四', '孙七', '王五', '赵六']
从头或尾部删除成员
使用数组的类方法pop或shift来删除成员。
📘 示例
var aaa = ["张三","李四","王五"];
console.log(aaa);
var xxx = aaa.pop(); // 删除尾部的成员
console.log(aaa, xxx);
// 输出：['张三', '李四'] 王五
var yyy = aaa.shift(); // 删除头部的成员
console.log(aaa, yyy)
// 输出：['李四'] 张三
在指定位置同时添加或删除成员
使用数组的类方法splice来同时添加或删除成员。
📘 示例
var aaa = ["张三","李四","王五",'赵六'];
console.log(aaa);
//
// splice 函数的参数说明
//
// 参数1：指定位置的索引，表示从数组的哪个位置开始操作。
// 参数2：从指定索引起要删除的成员数量，若不需要删除任何成员，请填0。
// 参数3：从指定索引起要添加的成员值，若不需要添加任何成员，请不填。
aaa.splice(2, 1, '孙七');
console.log(aaa);
// 输出：['张三', '李四', '孙七', '赵六']
修改成员值/替换成员值
将 新值 直接赋值给 目标成员 即可。
即：数组名[目标成员的索引值] = 新值
📘 示例
var aaa = ["张三","李四","王五"];
aaa[0] = '赵六';
console.log(aaa); // 输出：['赵六', '李四', '王五']
空数组
📘 示例
var aaa = []; // 什么值都不填，则为一个空的数组
console.log(aaa); // 输出：[]
遍历
📘 示例
var aaa = ["张三","李四","王五"];
var i = 0;
var n = aaa.length;
while(i < n)
{
var xxx = aaa[i];
console.log(i, xxx);
i = i + 1;
}
// 输出多行：
// 0 张三
// 1 李四
// 2 王五
使用while和length组合能依次读取到数组的成员
请在 MinWegPage 上直接在线编写和运行本篇代码，无需安装任何环境。
本篇的练习题如下：
第1题
创建一个列表digits，包含你喜欢的数字（至少两个）。
然后打印列表的长度。
第2题
创建一个列表names，包含你三个朋友的名字。
打印最后一个朋友的名字。
第3题
创建一个列表misc，包含你三个朋友的名字。
再添加两个你最喜欢的数字，
最后打印此列表。
请认真完成所有练习题，勤加练习有助于快速提升你的编程能力。
更多练习题在 https://www.min2k.com/course/docs/web-client/array
原文地址：https://blog.csdn.net/huangmipi/article/details/142750556
免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！