返回顶部
首页 > 资讯 > 前端开发 > JavaScript >JavaScript第一个分水岭之数组的基本操作
  • 423
分享到

JavaScript第一个分水岭之数组的基本操作

2024-04-02 19:04:59 423人浏览 八月长安
摘要

目录前言一、初识数组二、创建数组?使用Array对象创建数组?使用“[]”创建数组三、数组的基本操作?获取数组长度?访问数组元素?元素的添加与修改?元素的删除

前言

今天这篇文章就是来和大家详细聊聊javascript中数组的基本操作,很多语言都是在数组这有个分水岭

听懂了接下来就很容易,听不懂就难办了,大家要认真看哟。希望大家读完有所收获,那我辛苦码字也就值了。

一、初识数组

数组构成:数组由一个或多个数组元素组成的,各元素之间使用逗号“,”分割。

数组元素:每个数组元素由“下标”和“”构成。

下标:又称索引,以数字表示,默认从0开始依次递增,用于识别元素。

值:元素的内容,可以是任意类型的数据,如数值型、字符型、数组、对象等。

数组还可以根据维数划分为一维数组、二维数组、三维数组等多维数组。

一维数组:就是指数组的“值”是非数组类型的数据,如上图。

二维数组:是指数组元素的“值”是一个一维数组,如下图。

数组还可以根据维数划分为一维数组、二维数组、三维数组等多维数组。

多维数组:当一个数组的值又是一个数组时,就可以形成多维数组。它通常用于描述一些信息。

举例:保存一个班级学生信息,每个数组元素都代表一个学生,而每个学生都使用一个一维数组分别表示其姓名、学号、年龄等信息,这样通过一个变量即可有规律的保存一个班级的所有学生信息,方便开发时进行处理。

二、创建数组

⭐️数组在JavaScript中的创建方式:

  • 实例化Array对象的方式。
  • 直接使用“[]”的方式。

?使用Array对象创建数组

实例化Array对象的方式创建数组,是通过new关键字实现的。

?使用“[]”创建数组

直接法“[]”与Array()对象的使用方式类似,只需将new Array()替换为[]即可。

  • 在创建数组时,最后一个元素后的逗号可以存在,也可以省略。
  • 直接法“[]”与Array()对象在创建数组时的区别在于,前者可以创建含有空存储位置的数组,而后者不可以。

三、数组的基本操作

?获取数组长度

Array对象提供的length属性可以获取数组的长度,其值为数组元素最大下标加1。

数组arr2中没有值的数组元素会占用空的存储位置。

因此,数组的下标依然会递增。从而arr2调用length属性最后的输出结果即为6。

数组的length属性不仅可以用于获取数组长度,还可以修改数组长度。

在利用length属性指定数组长度时,有以下是三种情况:

?若length的值大于数组中原来的元素个数,则没有值的数组元素会占用空存储位置。

?若length的值等于数组中原来的元素个数,数组长度不变。

?若length的值小于数组中原来的元素个数,多余的数组元素将会被舍弃。

除此之外,在利用Array对象方式创建数组时,也可以指定数组的长度。

?注意

JavaScript中不论何种方式指定数组长度后,并不影响继续为数组添加元素,同时数组的length属性值会发生相应的改变。

?访问数组元素

数组元素访问方式:“数组名[下标]”。

概念:所谓遍历数组就是依次访问数组中所有元素的操作。

  • 利用下标遍历数组可以使用:for(已学)。
  • 利用下标遍历数组可以使用:for…in语句。

for…in中的variable指的是数组下标。for…in中的object表示数组的变量名称。除此之外,若object是一个对象,for…in还可以用于对象的遍历。

?注意

es6中,新增了一种for…of语法,可以更方便地对数组进行遍历。

  • for…in中的variable指的是数组下标。
  • for…in中的object表示数组的变量名称。
  • 除此之外,若object是一个对象,for…in还可以用于对象的遍历。

?元素的添加与修改

元素的添加与修改元素的方式:“数组名[下标]”。

提示:与访问数组中的元素的方式相同。

⭐️添加元素

  • 添加数组元素:数组名[下标] = 值。
  • 允许下标不按照数字顺序连续添加,未设置具体值的元素,会以空存储位置的形式存在。
  • 数组中元素保存顺序与下标有关,与添加元素的顺序无关。

⭐️修改元素

修改元素与添加元素的使用相同,区别在于修改元素是为已含有值的元素重新赋值。

?元素的删除

在创建数组后,有时也需要根据实际情况,删除数组中的某个元素值。

例如,一个保存全班学生信息的多维数组,若这个班级中有一个学生转学了,那么在这个保存学生信息的数组中就需要删除此学生。

此时,可以利用delete关键字删除该数组元素的值。

delete关键字只能删除数组中指定下标的元素值,删除后该元素依然会占用一个空的存储位置。

?解构赋值

除了前面学习过的变量声明与赋值方式,ES6中还提供了另外一种方式——解构赋值。例如,若把数组[1,2,3]中的元素分别赋值为a、b和c,传统的做法是单独为变量声明和赋值。

  • 当左侧变量的数量小于右侧的元素的个数,则忽略多余的元素。
  • 当左侧变量数量大于右侧的元素个数时,则多余的变量会被初始化为undefined。

  • 解构赋值时右侧的内容还可以是一个变量。
  • 通过解构赋值完成两个变量数值的交换。

总结

到此这篇关于JavaScript第一个分水岭之数组基本操作的文章就介绍到这了,更多相关js数组基本操作内容请搜索编程网以前的文章或继续浏览下面的相关文章希望大家以后多多支持编程网!

--结束END--

本文标题: JavaScript第一个分水岭之数组的基本操作

本文链接: https://lsjlt.com/news/146937.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

猜你喜欢
  • JavaScript第一个分水岭之数组的基本操作
    目录前言一、初识数组二、创建数组使用Array对象创建数组使用“[]”创建数组三、数组的基本操作获取数组长度访问数组元素元素的添加与修改元素的删除解构赋值总结...
    99+
    2024-04-02
  • OpenCV半小时掌握基本操作之分水岭算法
    目录概述分水岭算法距离变换连通域分水岭代码实战【OpenCV】⚠️高手勿入! 半小时学会基本操作 ⚠️ 分水岭算法 概述 Open...
    99+
    2024-04-02
  • JavaScript数组基本操作的示例分析
    这篇文章主要为大家展示了“JavaScript数组基本操作的示例分析”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“JavaScript数组基本操作的示例分析”这篇文章吧。一、初识数组数组构成:数...
    99+
    2023-06-29
  • JavaScript 数组基本操作全解
    目录一、初识数组二、创建数组使用Array对象创建数组使用“[]”创建数组三、数组的基本操作获取数组长度访问数组元素元素的添加与修改添加元素修改元素元素的删除...
    99+
    2024-04-02
  • Python NumPy教程之数组的基本操作详解
    目录Numpy中的N维数组(ndarray)数组创建数组索引基本操作数据类型Numpy中的N维数组(ndarray) Numpy 中的数组是一个元素表(通常是数字),所有元素类型相同...
    99+
    2024-04-02
  • Java数组的基本操作有哪些
    这篇“Java数组的基本操作有哪些”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“Java数组的基本操作有哪些”文章吧。一、为...
    99+
    2023-06-29
  • mysql数据表的基本操作之表结构操作,字段操作实例分析
    本文实例讲述了mysql数据表的基本操作之表结构操作,字段操作。分享给大家供大家参考,具体如下: 本节介绍: 表结构操作 创建数据表、 查看数据表和查看字段、 修改数据表结构 删除数据表 字段操作...
    99+
    2022-05-11
    mysql 数据表 表结构 字段
  • Java数组的基本操作方法整理
    目录1. 数组的定义2. 数组的声明、创建3. 内存分析4. 数组的三种初始化5. 数组的四个基本特点6. 数组边界7. 数组的使用7.1 普通For循环7.2 For-Each循环...
    99+
    2024-04-02
  • 总结20个常见的JavaScript数组操作
    JavaScript中的Array对象与其他编程语言中的数组一样,是一组数据的集合。在JavaScript中,数组里面的数据可以是不同类型的,并具有用于执行数组常见操作的方法。声明数组有三种不同的声明方式1. 常规方式const hobby...
    99+
    2023-05-14
    前端
  • 20个常见的JavaScript数组操作总结
    目录声明数组1. 常规方式2. 简洁方式3. 字面Array 对象方法1. forEach2. map3. concat4. push5. unshift6. pop7. shift...
    99+
    2024-04-02
  • Java基础之JDBC连接数据库与基本操作的示例分析
    小编给大家分享一下Java基础之JDBC连接数据库与基本操作的示例分析,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!Java可以用来干什么Java主要应用于:1....
    99+
    2023-06-14
  • Java基础之JDBC的数据库连接与基本操作
    目录一、JDBC概述二、JDBC操作数据库、操作表步骤三、JDBC体系结构与JDBC API四、注册与加载驱动五、建立连接(Connection)六、使用PreparedStatem...
    99+
    2024-04-02
  • JavaScript中数组常见的操作技巧分享
    这篇文章主要讲解了“JavaScript中数组常见的操作技巧分享”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“JavaScript中数组常见的操作技巧分享”...
    99+
    2024-04-02
  • JavaScript中数组各种操作的示例分析
    这篇文章主要介绍JavaScript中数组各种操作的示例分析,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!声明一个数组原来是如下声明:var s = new Array();但是 现...
    99+
    2024-04-02
  • MySQL数据库基本操作的示例分析
    这篇文章主要介绍了MySQL数据库基本操作的示例分析,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。一、数据库的安装这个就不在这里过多阐述了,...
    99+
    2024-04-02
  • MySQL数据库的基本操作实例分析
    本文小编为大家详细介绍“MySQL数据库的基本操作实例分析”,内容详细,步骤清晰,细节处理妥当,希望这篇“MySQL数据库的基本操作实例分析”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。一、MySQL简介1、数据...
    99+
    2023-06-30
  • Python数据清洗工具之Numpy的基本操作
    目录1. Numpy(Numberical Python)1.1 这库的安装方法2.Numpy的基础操作2.1 数组的创建:np.arrary()2.2 N维数组的创建2.3 常用数...
    99+
    2024-04-02
  • 关系代数(关系代数的五个基本操作)
    五种基本关系代数运算是? 五种基本关系代数运算是并、差、投影、交、选择、投影。 并:设有两个关系R和S,它们具有相同的结构。R和S的并是由属于R或属于S的元组组成的集合,运算符为∪。记为T=R∪S。 差:R和S的差是由属于...
    99+
    2023-09-24
    算法 人工智能 数据挖掘 python mysql
  • java与scala数组及集合的基本操作对比
    目录java与scala数组及集合的操作scala数组基本操作对应java代码scala可变数组ArrayBufferjava 相应 ArrayList操作scala 的数组遍历ja...
    99+
    2024-04-02
  • python序列数据类型之序列数据的基本操作
      1. 序列的长度、最大值、最小值、求和  通过内置函数len()、max() .minO可以获取序列的长度、序列中元索的最大值、序列中元素的最小值。通过内置函数sum()可以获取列表或元组中的各元素之和:如果有非数值元索,则导致TyeE...
    99+
    2023-06-02
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作