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

JS 中七个改变原数组的方法

目录

一、push

 二、pop

三、unshift

四、shift

五、splice

六、sort

七、reverse


一、push

在数组的尾部添加元素,并返回新的长度。

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

 二、pop

删除数组最后面一个元素、并返回删除的元素。

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

三、unshift

在数组的开头添加元素,并返回新的长度。

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

四、shift

删除数组开头一个元素、并返回删除的元素。

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

五、splice

 用于删除、添加、替换数组中的某些元素; 返回被删除或被替换元素组成的数组。

1)、添加

let arr = [1, 2, 3, 4, 5]
let arr1 = arr.splice(2, 0, 'haha')
console.log(arr1)  //[1, 2, 'haha', 3, 4, 5]新增一个元素

2)、删除

let arr = [1, 2, 3, 4, 5]
let arr2 = arr.splice(2, 3)
console.log(arr2)  //[1, 2] 删除三个元素

3)、替换

let arr = [1, 2, 3, 4, 5]
let arr3 = arr.splice(2, 1, 'haha')
console.log(arr3)  //[1, 2, 'haha', 4, 5] 替换一个元素

六、sort

对数组的元素进行排序并返回排序后的数组。

  • 基本使用
let arr = [1,5,3,7,6];
let n = arr.sort();
console.log(arr); // [1, 3, 5, 6, 7]
console.log(n); // [1, 3, 5, 6, 7]
  • 再看下面一个例子
let arr = [6,8,1,30,5];
arr.sort();
console.log(arr); // [1, 30, 5, 6, 8]

看着上面排序的结果是不是感觉和奇怪,并不是自己想像的结果。其实数组的sort方法当没有参数传入的时候,其排序顺序默认为,将待排序数据转换为字符串,并按照Unicode序列排序;所以这里sort默认的排序并不是按照值来排序,想要实现值的排序就需要传入一个比较函数了。该函数比较两个值的大小,然后返回一个用于说明这两个值的相对顺序的数字。具体是排序原理是用的 v8 引擎里的插入排序和快速排序,v8引擎排序源码。当数组长度小于等于10的时候,采用插入排序,大于10的时候,采用快排。

比较函数有两个参数 a 和 b,其返回值如下:

若 a 小于 b,即 a - b 小于零,则返回一个小于零的值,数组将按照升序排列。

若 a 等于 b,则返回 0,数组顺序不变。

若 a 大于 b, 即 a - b 大于零,则返回一个大于零的值,数组将按照降序排列。

let arr = [1,5,3,7,6];
arr.sort((a,b) => 0);
console.log(arr); // [1, 5, 3, 7, 6]
arr.sort((a,b) => a - b);
console.log(arr); // [1, 3, 5, 6, 7]
arr.sort((a,b) => b - a);
console.log(arr); // [7, 6, 5, 3, 1]

七、reverse

反转数组中元素的顺序并返回新数组。

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

相关文章:

JS 中七个改变原数组的方法

目录 一、push 二、pop 三、unshift 四、shift 五、splice 六、sort 七、reverse 一、push 在数组的尾部添加元素,并返回新的长度。 let arr [1] arr.push(2) console.log(arr) // [1, 2] 二、pop 删除数组最后面一个元素、并返回删除的元素。 let arr [1, …...

【笔试强训选择题】Day7.习题(错题)解析

作者简介:大家好,我是未央; 博客首页:未央.303 系列专栏:笔试强训选择题 每日一句:人的一生,可以有所作为的时机只有一次,那就是现在!!! 文章目录…...

Vue电商项目--axios二次封装

postman测试接口 刚刚经过postman工具测试,发现接口果然发生了改变。 新的接口为http://gmall-h5-api.atguigu.cn 如果服务器返回的数据code字段200,代表服务器返回数据成功 整个项目,接口前缀都有/api字样 axios二次封装 XmlHttpRequ…...

人生四维度

人生四维度 不是有钱了就成功,你知道;人生的成功不止一种,你也知道。但成功还有哪种?你知道吗? 如果把人生的体验展开,我们可以得到四个维度,高度、深度、宽度和温度。 财富、权力、影响力 构…...

Python 调用 MessageBeep 播放系统音效

Python 调用 MessageBeep 播放 Windows 系统提示声音 Windows API 函数 "MessageBeep" 介绍 "Windows API MessageBeep"是一个用于发出系统提示音效的函数。它可以向用户发出一种预定义的声音,以指示事件的发生或某个条件的满足。例如&#xf…...

废物,我TMD一个985却斗不过专科生(大厂自动化测试2年被裁)

前言 看到标题,可能很多读者朋友恐怕又要骂我了,985这个特殊的字眼也确实异常晃眼,实际上现在985,211也越来越多,它能代表你能够进入到更高的平台,拿到“高级工厂”的入场券,但并不意味着你会成…...

p70 内网安全-域横向内网漫游 Socks 代理隧道技术(NPS、FRP、CFS 三层内网漫游)

数据来源 本文仅用于信息安全学习,请遵守相关法律法规,严禁用于非法途径。若观众因此作出任何危害网络安全的行为,后果自负,与本人无关。 ​ 必要基础知识点: 内外网简单知识内网 1 和内网 2 通信问题正向反向协议通…...

第三十二章 Unity Mecanim动画系统(上)

在上一章节中,我们介绍了Unity的旧版动画系统,本章节来介绍新版的Mecanim动画系统。新版的Mecanim动画系统实际是对旧版动画系统的升级。新版的Mecanim动画系统仍然是建立在动画片段的基础上的,只不过它给我们提供了一个可视化的窗口来编辑动…...

第二章 集合

系列文章目录 提示:这里可以添加系列文章的所有文章的目录,目录需要自己手动添加 例如:第一章 Python 机器学习入门之pandas的使用 提示:写完文章后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目…...

这一篇Databinding应该可以帮助迅速上手吧

Databinding使用篇(迅速上手) 使用前需要在模块级别的build.gradle里面的android闭包里添加: dataBinding{enabled true}接着在layout文件中按下Alt 回车, 将布局转换成data binding layout即可,此时编译就会生成对…...

【PHP在线定制商城网站源码V3.0】开源的DIY在线定制商城系统+在线礼品定制

源码下载:https://download.csdn.net/download/m0_66047725/87637177 PHP在线定制商城网站源码,免费开源、免费下载。本商城基于mycncart开发。安装成功后即可浏览,你可以在后台->安装扩展功能上传安装插件,在代码调整中点击刷…...

cout源码浅析

目录 cout源码浅析 那么对于没有定义在这之中的要怎么办呢? 实际使用 结语 首先来看我从cplusplus中截取的这张图: 注意最下面这一行字。cout其实是ostream的一个标准对象object。而上面则演示了一些继承关系。 好的,理解了之后&#xf…...

发送Ajax get请求详解

发送AJAX get请求&#xff0c;前端代码&#xff1a; <!DOCTYPE html> <html lang"en"> <head> <meta charset"UTF-8"> <title>ajax get请求</title> </head> <body> <script type"text/java…...

SQL语句

创建及删除数据库和表 CREATE DATABASE 数据库名; CREATE DATABASE school; 创建新的表 CREATE TABLE 表名(字段1 数据类型,字段2 数据类型[,...] [,PRIMARY KEY (主键名)]); #主键一般选择能代表唯一性的字段&#xff0c;不允许取空值(NULL)&#xff0c;值也不允许重复&…...

Mysql 学习(八)单表查询方法二

复杂查询 上一节说了5种访问类型的查询&#xff0c;这一节就来说说关于这些比较复杂的查询 情况一&#xff1a;多个二级索引查询 sql&#xff1a;SELECT * FROM index_value_table WHERE value1 abc AND value2 > 1000;搜索条件&#xff1a; value1 等于 abcvalue2 大于…...

安卓系统下的截屏和录屏

可以抓取手机屏幕画面&#xff08;屏幕截图&#xff09;&#xff0c;也可以录制屏幕画面视频。拍摄屏幕后&#xff0c;可以查看、编辑和分享所拍的图片或视频。 抓取屏幕截图 打开要抓取的屏幕。视手机情况执行下列一个操作&#xff0c;3种方法看你手机有效的&#xff1a; 同…...

行为型模式-中介者模式

中介者模式 概述 一般来说&#xff0c;同事类之间的关系是比较复杂的&#xff0c;多个同事类之间互相关联时&#xff0c;他们之间的关系会呈现为复杂的网状结构&#xff0c;这是一种过度耦合的架构&#xff0c;即不利于类的复用&#xff0c;也不稳定。例如在下左图中&#xf…...

辅助驾驶功能开发-功能规范篇(16)-2-领航辅助系统NAP-功能ODD定义

1.系统定义 智能驾驶系统包含行车场景功能和泊车场景功能,行车场景功能包括安全ADAS功能、基础ADAS功能和高阶ADAS功能三大类,本文档定义高阶ADAS功能中的导航辅助驾驶功能用例。 1.1.高阶ADAS功能列表 功能需求ID 功能分类 功能名称...

PMP/高项 06-项目成本管理

项目成本管理 概念 项目成本管理 项目成本管理又被称为项目造价管理&#xff0c;是有关项目成本和项目价值两个方面的管理&#xff0c;是为保障以最小的成本实现最大的项目价值而开展的项目专项管理工作。 确保在批准的项目预算内完成项目 成本管理内容 规划成本管理 制定项目…...

XXL-JOB中间件【实现分布式任务调度】

目录 1&#xff1a;XXL-JOB介绍 2&#xff1a;搭建XXL-JOB 2.1&#xff1a;调度中心 2.2&#xff1a;执行器 2.3&#xff1a;执行任务 3&#xff1a;分片广播 1&#xff1a;XXL-JOB介绍 XXL-JOB是一个轻量级分布式任务调度平台&#xff0c;其核心设计目标是开发迅速、学…...

华为防火墙NAT映射选择指南:一对一映射 vs 端口映射

华为防火墙NAT映射技术深度解析&#xff1a;一对一映射与端口映射的实战选择 在当今企业网络架构中&#xff0c;如何安全高效地将内部服务暴露给外部访问是一个永恒的技术挑战。华为防火墙提供的NAT映射功能&#xff0c;特别是一对一映射和端口映射两种核心方案&#xff0c;为不…...

如何快速搭建Kafka Docker集群:broker-list.sh工作原理与实用指南

如何快速搭建Kafka Docker集群&#xff1a;broker-list.sh工作原理与实用指南 【免费下载链接】kafka-docker Dockerfile for Apache Kafka 项目地址: https://gitcode.com/gh_mirrors/ka/kafka-docker GitHub 加速计划 / ka / kafka-docker 项目提供了基于 Docker 的 A…...

罗斯蒙特RoseMount手操器TREXLFPKL9S1

罗斯蒙特475手操器是一款由艾默生&#xff08;Emerson&#xff09;推出的高性能现场通讯设备&#xff0c;广泛应用于工业自动化领域&#xff0c;用于配置、校准和诊断HART及Foundation Fieldbus协议的智能仪表设备。它具备彩色图形界面、蓝牙通信、强大的现场诊断功能和可用户升…...

避开版本坑!用DINOv2和MMSegmentation在PASCAL VOC 2012上跑通语义分割(附完整环境配置)

避开版本坑&#xff01;用DINOv2和MMSegmentation在PASCAL VOC 2012上跑通语义分割&#xff08;附完整环境配置&#xff09; 语义分割作为计算机视觉领域的核心任务之一&#xff0c;其技术演进始终与深度学习框架的生态紧密相连。当Meta开源的DINOv2遇上OpenMMLab的MMSegmentat…...

用2万小时人类视频预训练机器人,一场豪赌还是必经之路?

先说结论核心验证了“人类数据缩放定律”&#xff1a;在灵巧操作任务上&#xff0c;模型性能随人类预训练数据量对数线性增长&#xff0c;为数据策略提供了可预测的依据。成功的关键在于“两阶段迁移”设计&#xff1a;用大规模、廉价但“嘈杂”的人类数据奠基通用结构&#xf…...

解锁Online3DViewer:浏览器端3D模型可视化的核心价值与实践指南

解锁Online3DViewer&#xff1a;浏览器端3D模型可视化的核心价值与实践指南 【免费下载链接】Online3DViewer A solution to visualize and explore 3D models in your browser. 项目地址: https://gitcode.com/gh_mirrors/on/Online3DViewer 在数字化设计与开发领域&am…...

AdGuard浏览器扩展:企业级隐私保护与广告拦截解决方案

AdGuard浏览器扩展&#xff1a;企业级隐私保护与广告拦截解决方案 【免费下载链接】AdguardBrowserExtension AdGuard browser extension 项目地址: https://gitcode.com/gh_mirrors/ad/AdguardBrowserExtension AdGuard浏览器扩展是一款专注于隐私保护和广告拦截的开源…...

利用快马平台快速生成proteus仿真项目,十分钟搭建arduino温湿度监测原型

作为一名电子爱好者&#xff0c;最近在做一个温湿度监测的小项目。传统方式需要先在电脑上安装Proteus、Arduino IDE等一堆软件&#xff0c;配置起来特别麻烦。后来发现了InsCode(快马)平台&#xff0c;简直打开了新世界的大门——不用安装任何软件&#xff0c;直接在网页上就能…...

ChatGPT公式复制到Word的自动化实践:从手动操作到脚本实现

ChatGPT公式复制到Word的自动化实践&#xff1a;从手动操作到脚本实现 作为一名经常需要整理技术文档的开发者&#xff0c;我过去常常被一个看似简单却异常繁琐的任务困扰&#xff1a;将ChatGPT生成的数学公式或代码片段复制到Microsoft Word中。每次操作都像是一场格式的“灾…...

TargetMol明星分子—— Eragidomide Mezigdomide

Eragidomide &#xff0c;别名 CC-90009、 Cereblon modulator 1&#xff0c;是一种 GSPT1 选择性 cereblon (CRBN) E3 泛素连接酶调节剂&#xff0c;以分子胶的方式作用。它通过 CRL4CRBN 选择性靶向 GSPT1 进行泛素化和蛋白酶体降解。 Mezigdomide 货号 T10703&#xff0c;别…...