当前位置: 首页 > news >正文

网页前端开发之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

在头或尾部添加成员

使用数组的类方法pushunshift来添加成员。

📘 示例

var aaa = ["张三","李四","王五"];
console.log(aaa);
aaa.push("赵六");     // 追加一个成员到尾部
console.log(aaa);
// 输出:['张三', '李四', '孙七', '王五', '赵六']
aaa.unshift("孙七");  // 追加一个成员到头部 
console.log(aaa);
// 输出:['孙七', '张三', '李四', '孙七', '王五', '赵六']

从头或尾部删除成员

使用数组的类方法popshift来删除成员。

📘 示例

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 王五

使用whilelength组合能依次读取到数组的成员


请在 MinWegPage 上直接在线编写和运行本篇代码,无需安装任何环境。

本篇的练习题如下:

第1题
创建一个列表digits,包含你喜欢的数字(至少两个)。
然后打印列表的长度。
第2题
创建一个列表names,包含你三个朋友的名字。
打印最后一个朋友的名字。
第3题
创建一个列表misc,包含你三个朋友的名字。
再添加两个你最喜欢的数字,
最后打印此列表。

请认真完成所有练习题,勤加练习有助于快速提升你的编程能力。
更多练习题在 https://www.min2k.com/course/docs/web-client/array


http://www.mrgr.cn/news/45117.html

相关文章:

  • LabVIEW提高开发效率技巧----阻塞时钟
  • SQL专项练习第五天
  • Python OpenCV精讲系列 - 动态场景分析深入理解(十六)
  • python3 venv的使用详解
  • 冥想第一千三百零三天(1303)
  • TCN-Transformer时间序列预测(多输入单预测)——基于Pytorch框架
  • 基于时频分析与自适应滤波技术的多分量雷达信号提取与重建研究
  • Stable Diffusion最新版nowebui的api使用详解
  • java二维数组
  • python 实现最小生成树 boruvka算法
  • 【含文档】基于Springboot+Android的公交系统查询与设计(含源码+数据库+lw)
  • 各省份自然灾害损失情况数据(2004-2022年)
  • Redis快速入门
  • LoRA:大模型的低阶自适用(论文复现)
  • 解决Docker环境下Next.js和FastAPI的跨容器通信问题
  • #String StringBuilder StringBuffer
  • vulnhub-THE PLANETS-EARTH靶机
  • 【JVM系列】深入理解Java虚拟机(JVM)的核心技术:从加载到初始化的全过程解析(一、Java类加载器)
  • 2的幂次方表示
  • 算法复杂度与图算法 - 离散数学系列(十)