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

JavaScript Array(数组) 对象

JavaScript 中的 Array(数组)对象是一种用来存储一系列值的容器,它可以包含任意类型的数据,包括数字、字符串、对象等等。通过使用数组对象,我们可以轻松地组织和处理数据,以及进行各种操作,比如查找、排序、过滤、迭代等等。

  1. 创建数组

在 JavaScript 中,我们可以通过多种方式来创建一个数组对象。

2.1 直接定义

最简单的创建数组的方式就是直接定义数组变量,并用方括号 [] 括起来的一组值来初始化数组,例如:

let arr = [1, 2, 3, 4, 5];

在这个例子中,我们定义了一个包含 5 个元素的数组,分别是 1、2、3、4、5。

2.2 构造函数

另一种创建数组的方式是使用 Array 构造函数来创建数组,例如:

let arr = new Array(1, 2, 3, 4, 5);

这个例子和上面的例子等价,它使用了 Array 构造函数来创建一个数组对象,并初始化了它的元素。

除了传入一组初始值外,我们还可以使用一个数字参数来指定数组的长度,例如:

let arr = new Array(5);

这个例子创建了一个长度为 5 的数组,但是数组中的元素都是 undefined。

2.3 Array.of 和 Array.from

在 ES6 中,JavaScript 提供了两个新的数组方法 Array.of 和 Array.from,用来创建数组。

Array.of 方法可以用来创建一个包含任意数量元素的数组,例如:

let arr = Array.of(1, 2, 3, 4, 5);

这个例子和直接定义数组变量的方式等价。

Array.from 方法可以用来将一个类数组对象或可迭代对象转换成数组,例如:

let arr = Array.from("hello");
// arr: ['h', 'e', 'l', 'l', 'o']

这个例子将一个字符串转换成了一个包含每个字符的数组。

数组元素的访问和修改

数组中的元素可以通过索引来访问和修改。在 JavaScript 中,数组的索引从 0 开始,也就是第一个元素的索引是 0,第二个元素的索引是 1,以此类推。

3.1 访问元素

我们可以使用方括号 [] 操作符来访问数组中的元素,例如:

let arr = [1, 2, 3, 4, 5];
console.log(arr[0]); // 1
console.log(arr[2]); // 3

这个例子访问了数组中的第一个元素和第三个元素。

3.2 修改元素

我们也可以使用方括号操作符来修改数组中的元素,例如:

let arr = [1, 2, 3, 4, 5];
arr[0] = 6;
arr[2] = 7;
console.log(arr); // [6, 2, 7, 4, 5]


这个例子将数组中的第一个元素修改为 6,第三个元素修改为 7。

4. 数组的方法

JavaScript 的 Array 对象提供了很多实用的方法,用来操作和处理数组中的元素。下面我们将介绍一些常用的方法。

4.1 push 和 pop

push 方法可以在数组的末尾添加一个或多个元素,例如:

let arr = [1, 2, 3];
arr.push(4);
console.log(arr); // [1, 2, 3, 4]

这个例子向数组中添加了一个元素 4。

pop 方法可以从数组的末尾删除一个元素,并返回被删除的元素,例如:

let arr = [1, 2, 3];
let last = arr.pop();
console.log(arr); // [1, 2]
console.log(last); // 3

这个例子删除了数组中的最后一个元素 3,并将其保存在 last 变量中。

4.2 shift 和 unshift

shift 方法可以从数组的开头删除一个元素,并返回被删除的元素,例如:

let arr = [1, 2, 3];
let first = arr.shift();
console.log(arr); // [2, 3]
console.log(first); // 1

这个例子删除了数组中的第一个元素 1,并将其保存在 first 变量中。

unshift 方法可以在数组的开头添加一个或多个元素,例如:

let arr = [1, 2, 3];
arr.unshift(0);
console.log(arr); // [0, 1, 2, 3]

这个例子向数组中添加了一个元素 0。

4.3 splice

splice 方法可以用来添加、删除和替换数组中的元素。它接受三个参数:起始索引、删除数量和可选的新元素。例如:

let arr = [1, 2, 3, 4, 5];
arr.splice(2, 2, 6, 7);
console.log(arr); // [1, 2, 6, 7, 5]

这个例子从数组中删除了两个元素(从索引 2 开始,删除 2 个元素),并向数组中添加了两个新元素 6 和 7。

4.4 concat

concat 方法可以用来连接两个或多个数组,返回一个新的数组,例如:

let arr1 = [1, 2, 3];
let arr2 = [4, 5, 6];
let arr3 = arr1.concat(arr2);
console.log(arr3); // [1, 2, 3, 4, 5, 6]

这个例子连接了两个数组 arr1 和 arr2,并将结果保存在一个新数组 arr3 中。

4.5 slice

slice 方法可以用来截取数组中的一部分

除了数组的基本操作之外,JavaScript还提供了一些高级数组操作方法。以下是一些常用的高级数组操作方法:

map()

map()方法创建一个新数组,其中的元素是原始数组中每个元素调用一个提供的函数后返回的结果。map()方法不会改变原始数组。

const numbers = [1, 2, 3, 4, 5];
const doubledNumbers = numbers.map(num => num * 2);
console.log(doubledNumbers); // [2, 4, 6, 8, 10]

filter()

filter()方法创建一个新数组,其中包含通过提供的函数测试的所有元素。filter()方法不会改变原始数组。

const numbers = [1, 2, 3, 4, 5];
const evenNumbers = numbers.filter(num => num % 2 === 0);
console.log(evenNumbers); // [2, 4]

reduce()

reduce()方法对数组中的所有元素执行一个指定的reducer函数,并将其结果累加到单个返回值中。reduce()方法不会改变原始数组。

const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce((acc, num) => acc + num, 0);
console.log(sum); // 15

forEach()

forEach()方法对数组中的每个元素执行一次提供的函数,该函数不返回任何内容。forEach()方法不会改变原始数组。

const numbers = [1, 2, 3, 4, 5];
numbers.forEach(num => console.log(num));
// 1
// 2
// 3
// 4
// 5

sort()

sort()方法对数组元素进行排序,并返回已排序的数组。sort()方法改变原始数组。

const fruits = ['banana', 'apple', 'orange', 'grape'];
fruits.sort();
console.log(fruits); // ['apple', 'banana', 'grape', 'orange']

slice()

slice()方法返回一个新数组,其中包含原始数组的一部分。该方法不会改变原始数组。

const numbers = [1, 2, 3, 4, 5];
const slicedNumbers = numbers.slice(0, 2);
console.log(slicedNumbers); // [1, 2]

concat()

concat()方法将两个或多个数组合并成一个新数组,并返回新数组。concat()方法不会改变原始数组。

const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
const combinedArr = arr1.concat(arr2);
console.log(combinedArr); // [1, 2, 3, 4, 5, 6]

以上是常用的一些高级数组操作方法,它们可以大大简化数组的操作,提高代码的效率。当然,还有许多其他的数组操作方法,可以根据实际需求选择使用。

相关文章:

JavaScript Array(数组) 对象

JavaScript 中的 Array(数组)对象是一种用来存储一系列值的容器,它可以包含任意类型的数据,包括数字、字符串、对象等等。通过使用数组对象,我们可以轻松地组织和处理数据,以及进行各种操作,比如…...

Debian如何更换apt源

中科大 deb https://mirrors.ustc.edu.cn/debian/ stretch main non-free contrib deb https://mirrors.ustc.edu.cn/debian/ stretch-updates main non-free contrib deb https://mirrors.ustc.edu.cn/debian/ stretch-backports main non-free contrib deb-src https://mirr…...

Connext DDSPersistence Service持久性服务

DDS持久性服务,它保存了DDS数据样本,以便即使发布应用程序已经终止,也可以稍后将其发送到加入系统的订阅应用程序。 简介Persistence Service是一个Connext DDS应用程序,它将DDS数据样本保存到临时或永久存储中,因此即使发布应用程序已经终止,也可以稍后将其交付给加入系…...

自抗扰控制ADRC之微分器TD

目录 前言 1 全程快速微分器 1.1仿真分析 1.2仿真模型 1.3仿真结果 1.4结论 2 Levant微分器 2.1仿真分析 2.2仿真模型 2.3仿真结果 3.总结 前言 工程上信号的微分是难以得到的,所以本文采用微分器实现带有噪声的信号及其微分信号提取,从而实现…...

链表学习之复制含随机指针的链表

链表解题技巧 额外的数据结构(哈希表);快慢指针;虚拟头节点; 复制含随机指针的链表 该链表节点的结构如下: class ListRandomNode { public:ListRandomNode() : val(0), next(nullptr), random(nullptr…...

【人脸检测】Yolov5Face:优秀的one-stage人脸检测算法

论文题目:《YOLO5Face: Why Reinventing a Face Detector》 论文地址:https://arxiv.org/pdf/2105.12931.pdf 代码地址:https://github.com/deepcam-cn/yolov5-face 1.简介 近年来,CNN在人脸检测方面已经得到广泛的应用。但是许多…...

【Unity3d】Unity与Android之间通信

在unity开发或者sdk开发经常遇到unity与移动端原生层之间进行通信,这里把它们之间通信做一个整理。 关于Unity与iOS之间通信,参考【Unity3d】Unity与iOS之间通信 Unity(c#)调用Android (一)、编写Java代码 实际上,任何已经存在的Java代码…...

Allegro如何更改DRC尺寸大小操作指导

Allegro如何更改DRC尺寸大小操作指导 在做PCB设计的时候,DRC可以辅助设计,有的时候DRC的尺寸过大会影响视觉,Allegro支持将DRC的尺寸变小或者改大 如下图,DRC尺寸过大 如何改小,具体操作如下 点击Setup选择Design Parameters...

Mongodb WT_PANIC: WiredTiger library panic

文章目录故障现象排查过程1.查看Log2.同步恢复数据故障现象 周五突然收到Mongo实例莫名奇妙挂了告警,一般都是RS复制集架构模式(5节点),查看此实例角色为SECONDAR,挂了暂时不影响线上业务,但还是需要尽快修…...

【HTML】HTML 表格总结 ★★★ ( 表格标签 | 行标签 | 单元格标签 | 表格标签属性 | 表头单元格标签 | 表格标题标签 | 合并单元格 )

文章目录一、表格标签组成 ( 表格标签 | 行标签 | 单元格标签 )二、table 表格属性 ( border 属性 | align 属性 | width 属性 | height 属性 )三、表头单元格标签四、表格标题标签五、合并单元格1、合并单元格方式2、合并单元格顺序3、合并单元格流程六、合并单元格示例1、原始…...

linux013之文件和目录的权限管理

用户、组、文件目录的关系: 简介:用户和组关联,组合文件目录关联,这样就实现了用户对文件的权限管理。首先来看一下,一个文件或目录的权限是怎么查看的,ls -l, 如下,这个信息怎么看呢…...

设计模式之状态模式

什么是状态模式 状态模式是指允许一个对象在其内部状态改变时改变他的行为,对象看起来似乎改变了整个类。     状态模式将一个对象在不同状态下的不同行为封装在一个个状态类中,通过设置不同的状态对象可以让环境对象拥有不同的行为,而状…...

XQuery 选择 和 过滤

XML实例文档 我们将在下面的例子中继续使用这个 "books.xml" 文档(和上面的章节所使用的 XML 文件相同)。 在您的浏览器中查看 "books.xml" 文件。 选择和过滤元素 正如在前面的章节所看到的,我们使用路径表达式或 FL…...

室友打了一把王者的时间,我理清楚了grep,find,管道|,xargs的区别与联系,用的时候不知道为什么要这样用

目录 问题引入 find和grep的基本区别 xargs命令 Linux命令的标准输入 vs 命令行参数 举例总结 问题引入 在自己做项目的过程中,想使用linux命令统计下一个目录下html文件的数量,在思考应该使用grep还是find去配合wc指令统计文件数量,后来…...

python 刷题时常见的函数

collections.OrderedDict 1. move_to_end() move_to_end() 函数可以将指定的键值对移动到最前面或者最后面,即最左边或最右边 。 2. popitem() popitem()可以完成元素的删除操作,有一个可选参数last(默认为True),…...

Python之列表推导式和列表排序

Python中的列表推导式,是小编比较喜欢的一种,他能大大减少你的代码量来得到你想要的结果,下面说说列表中常用的几种推导式 列表排序 Python开发中会经常用到排序操作,这里提供两种方式供大家参考,对象的sort()方法和…...

力扣(LeetCode)240. 搜索二维矩阵 II(C++)

题目描述 枚举 枚举整个矩阵&#xff0c;找到等于 target 的元素&#xff0c;则 return true &#xff0c;否则 return false。 class Solution { public:bool searchMatrix(vector<vector<int>>& matrix, int target) {int n matrix.size(), m matrix[0]…...

golang defer

文章目录延迟函数的参数在defer语句出现时就已经确定下来了延迟函数没有入参时&#xff0c;延迟函数体内的变量会受到影响延迟函数 *可以* 修改主函数的 *具名* 返回值延迟函数 *无法* 修改主函数的 *匿名* 返回值defer会把声明的 延迟函数以及 函数的入参放到栈上&#xff0c;…...

【Java】线程的死锁和释放锁

线程死锁是线程同步的时候可能出现的一种问题 文章目录1. 线程的死锁1.1 基本介绍1.2 应用案例2. 释放锁2.1 下面的操作会释放锁2.2 下面的操作不会释放锁1. 线程的死锁 1.1 基本介绍 多个线程都占用了对方的锁资源&#xff0c;但不肯相让&#xff0c;导致了死锁&#xff0c;…...

如何使用断点续传上传大文件

概念 大文件上传的需求介绍 不管怎样简单的需求&#xff0c;在量级达到一定层次时&#xff0c;都会变得异常复杂。 文件上传简单&#xff0c;文件变大就复杂 上传大文件时&#xff0c;以下几个变量会影响我们的用户体验 服务器处理数据的能力请求超时网络波动 上传时间会变长…...

【图神经网络】图拉普拉斯滤波器如何实现全通、低通、高通滤波

【图神经网络】图拉普拉斯滤波器如何实现全通、低通、高通滤波 文章目录【图神经网络】图拉普拉斯滤波器如何实现全通、低通、高通滤波1. 前言2. 符号说明3. 三种滤波3.1 全通滤波3.2 低通滤波3.2.1 平滑信号分析3.2.2 广义拉普拉斯平滑滤波器3.3 高通滤波4. 总结1. 前言 GCN&…...

python操作mysql数据库详解

使用Python操作MySQL数据库 MySQL是一种关系型数据库管理系统&#xff0c;它可以用来存储和管理大量的数据。之前介绍了大部分主流数据库&#xff0c;今天将介绍如何使用Python来操作MySQL数据库。 安装MySQL 首先&#xff0c;我们需要安装MySQL服务器&#xff0c;可以从MyS…...

netty群聊系统

1设计思路&#xff1a;启动一个服务端&#xff0c;多个客户端第一个客户端启动时&#xff0c;会告诉服务器上线了第二个客户端启动时&#xff0c;告诉服务器上线&#xff0c;并且通知第一个启动的客户端第三个客户端启动时&#xff0c;告诉服务器上线&#xff0c;并且通知第一个…...

Android 初代 K-V 存储框架 SharedPreferences,旧时代的余晖?

本文已收录到 AndroidFamily&#xff0c;技术和职场问题&#xff0c;请关注公众号 [彭旭锐] 提问。 前言 大家好&#xff0c;我是小彭。 SharedPreferences 是 Android 平台上轻量级的 K-V 存储框架&#xff0c;亦是初代 K-V 存储框架&#xff0c;至今被很多应用沿用。 有的…...

在windows中使用tomcat搭建Jenkins

1、 准备环境&#xff1a;JDK JDK官网下载&#xff1a;https://download.oracle.com/java/19/latest/jdk-19_windows-x64_bin.msi 2、 tomcat包 tocat官网下载&#xff1a;https://tomcat.apache.org/download-90.cgi 3、 Jenkins.war包 Jenkins官网下载&#xff1a;https://mi…...

Linux系统

linux系统 世界上最重要的服务器端操作系统。 创建新目录 mkdir app mkdir -m 目录权限 目录名 创建有权限的目录名。 创建一个空白文件 touch app.txt创建一个文件。 cat创建一个文件。 vi/vim创建一个文件。 nano创建一个文件。 truncate创建一个文件。 pwd查看当前目录。 rm…...

Mel Frequency Cepstral Coefficients (MFCCs)

wiki里说 在声音处理中&#xff0c;梅尔频率倒谱( MFC ) 是声音的短期功率谱的表示&#xff0c;基于非线性梅尔频率标度上的对数功率谱的线性余弦变换。 倒谱和MFC 之间的区别在于&#xff0c;在 MFC 中&#xff0c;频带在梅尔尺度上等距分布&#xff0c;这比正常频谱中使用的线…...

第七讲---贪心(上课)

1.股票买卖 一、贪心 考虑一种方案&#xff0c;在每次上升的前一天购入股票&#xff0c;并在上升后的当天卖出的方案 if (w[i] > w[i - 1])res w[i] - w[i - 1];接下来证明该贪心思路得出的方案即是最优解。 &#xff08;1&#xff09;证明贪心解 ≥ 最优解&#xff1a; …...

计算机如何思考与图灵完备

图灵完备是针对一套数据操作规则而言的概念,数据操作规则可以是一门编程语言,也可以是计算机实现里面的指令集,比如C/C++是图图灵完备的,通用CPU也是图灵完备的,但是GPU却不一定是图灵完备的。说白了图灵完备定义了一套规则,当这套规则可以实现图灵迹模型里的全部功能时,…...

惠普LaserJet M1005 MFP报错b2

故障现象: 惠普LaserJet M1005 MFP开机后直接报b2错误; 检测维修: 故障大意是:机器的硬件可能出现点突变,此问题建议联系当地维修中心进行处理。...

用阿里巴巴店铺做公司网站怎么样/网站建设制作流程

文末获取完整PDF这份PDF涵盖了数仓设计和建设的一些重要概念和知识点&#xff0c;也有很多是面试经常问的&#xff0c;是学习数仓必备的理论知识。这份PDF可以作为数仓工具书的辅助资料进行学习&#xff0c;毕竟数仓工具书比较厚&#xff0c;对于很多人很难抓住其中的重点。如何…...

九江的网站建设公司/手机网页制作软件

最近来自Docker官方网站的文章提到&#xff0c;从OpenStack Icehouse开始&#xff0c;Docker将与Heat集成。 而最早在OpenStack Havana 版本中&#xff0c;Docker 已经作为 Nova driver方式与OpenStack集成。本文将首先简单介绍Docker&#xff0c;然后介绍其与OpenStack 的集成…...

如何规避电子政务门户网站建设教训/企业营销策划及推广

ssh工具下载地址&#xff1a; ssh secure file transfer http://download.csdn.net/detail/wyx100/9591076问题&#xff1a; ssh连接ubunt16.04系统出现错误&#xff1a; server responded “Algorithm negotiation failes” 原因&#xff1a; 服务器响应通过失败 解决方法&…...

专业做网站/电子商务沙盘seo关键词

版权声明&#xff1a;本文为 小异常 原创文章&#xff0c;非商用自由转载-保持署名-注明出处&#xff0c;谢谢&#xff01; 本文网址&#xff1a;https://blog.csdn.net/sun8112133/article/details/84350216 好久没写博客咯&#xff0c;今天来写一写今天写代码中遇到的一个问题…...

大连手机自适应网站建设/seo模拟点击软件源码

POWER(2,3) 返回 2 的 3 次幂, SQUARE 返回给定表达式的平方。 语法 SQUARE ( float_expression ) SQRT 返回给定表达式的平方根。 语法 SQRT ( float_expression ) 顺便说 Access 的开方函数是 SQR ( float_expression )...

设计团队网站/全网seo

Python 是一种美丽的语言&#xff0c;它简单易用却非常强大。但你真的会用 Python 的所有功能吗?任何编程语言的高级特征通常都是通过大量的使用经验才发现的。比如你在编写一个复杂的项目&#xff0c;并在 stackoverflow 上寻找某个问题的答案。然后你突然发现了一个非常优雅…...