js常用数组操作方法

2023-10-27

1、concat()
用于连接两个或多个数组。该方法不会改变现有的数组,仅会返回被连接数组的一个副本。
在这里插入图片描述

 2、join()
用于把数组中的所有元素放入一个字符串。元素是通过指定的分隔符进行分隔的,默认使用’,'号分割,不改变原数组

在这里插入图片描述

3、push()
可向数组的末尾添加一个或多个元素,并返回新的长度。末尾添加,返回的是长度,改变原数组

在这里插入图片描述

 4、pop()
用于删除并返回数组的最后一个元素。返回最后一个元素,改变原数组

在这里插入图片描述

5、shift()
用于把数组的第一个元素从其中删除,并返回第一个元素的值,改变原数组

在这里插入图片描述

6、unshift()
可向数组的开头添加一个或更多元素,并返回新的长度,改变原数组

在这里插入图片描述
7、slice()  截取
返回一个新的数组,包含从 start 到 end (不包括该元素)的 arrayObject 中的元素(含头不含尾)。返回选定的元素,不会修改原数组

在这里插入图片描述
8、splice()  删除
splice() 方法可删除从 index(从0开始) 处开始的零个或多个元素,并且用参数列表中声明的一个或多个值来替换那些被删除的元素。如果从 arrayObject 中删除了元素,返回的是含有被删除的元素的数组会改变原数组

在这里插入图片描述
9、substr() 和 substring()

相同点:如果只是写一个参数,两者的作用都一样:都是是截取字符串从当前下标直到字符串最后的字符串片段。都不会改变原字符串

 在这里插入图片描述

不同点:第二个参数
substr(startIndex,lenth): 第二个参数是截取字符串的长度(从起始点截取某个长度的字符串);
substring(startIndex, endIndex): 第二个参数是截取字符串最终的下标 (截取2个位置之间的字符串,‘含头不含尾’)。

在这里插入图片描述

10、sort 排序
按照 Unicode code 位置排序,默认升序,会改变原数组

在这里插入图片描述

11、reverse()
用于颠倒数组中元素的顺序。返回的是颠倒后的数组,会改变原数组

在这里插入图片描述

12、indexOf 和 lastIndexOf
都接受两个参数:查找的值、查找起始位置
不存在,返回 -1 ;存在,返回位置。indexOf 是从前往后查找, lastIndexOf 是从后往前查找。
indexOf

在这里插入图片描述

 在这里插入图片描述

13、every
对数组的每一项都运行给定的函数,每一项都返回 ture,则返回 true

在这里插入图片描述

14、some
对数组的每一项都运行给定的函数,任意一项都返回 ture,则返回 true

在这里插入图片描述

15、filter
对数组的每一项都运行给定的函数,返回 结果为 ture 的项组成的数组

在这里插入图片描述

16、map
对数组的每一项都运行给定的函数,返回每次函数调用的结果组成一个新数组

map不会改变原数组,但如果数组是对象数组就会改变

在这里插入图片描述

17、forEach 数组遍历

删除数组中的指定值

//第一种用最常见的ForEach循环来对比元素找到之后将其删除:
var colors = ["red", "blue", "grey"];

colors.forEach(function(item, index, arr) {
    if(item == "red") {
        arr.splice(index, 1);
    }
});


//第二种我们用循环中的filter方法
var colors = ["red", "blue", "grey"];

colors = colors.filter(function(item) {
    return item != "red"
});
console.log(colors);    //["blue", "grey"]

删除数组中的某一项

JavaScript中如何删除数组某个元素,我们有需要了解splice这个方法,翻译为剪接,
arr.splice(0,1)表示删除数组的第一个
arr.splice(1,2)表示删除从第二个开始,长度为2个的元素。

Array.prototype 也是个数组,所以它也有 length 属性

//1、首先可以给js的数组对象定义一个函数,用于查找指定的元素在数组中的位置,即索引
Array.prototype.indexOf = function(val) {
for (var i = 0; i < this.length; i++) {
    if (this[i] == val) return i;
}
    return -1;
};

//2、然后使用通过得到这个元素的索引,使用js数组自己固有的函数去删除这个元素: 
Array.prototype.remove = function(val) {
var index = this.indexOf(val);
    if (index > -1) {
        this.splice(index, 1);
    }
};

这样就构造了这样一个函数,比如我有一个数组:
var emp = ['abs','dsf','sdf','fd']
//假如我们要删除其中的 ‘fd’ ,就可以使用:
emp.remove('fd');

使用 reduce 方法实现 forEach、map、filter

 // forEach
 function forEachUseReduce(array, handler) {
   array.reduce(function (pre, item, index) {
     handler(item, index);
   }, null);
 }
 // map
 function mapUseReduce(array, handler) {
   let result = [];
   array.reduce(function (pre, item, index) {
     let mapItem = handler(item, index);
     result.push(mapItem);
   }, null);
   return result;
 }
 // filter
 function filterUseReduce(array, handler) {
   let result = [];
   array.reduce(function (pre, item, index) {
     if (handler(item, index)) {
       result.push(item);
     }
   }, null);
   return result;
 }
//reduce的用法
arr.reduce(function(prev,cur,index,arr){
...
}, init);

prev 必需。累计器累计回调的返回值; 表示上一次调用回调时的返回值,或者初始值 init;
cur 必需。表示当前正在处理的数组元素;
index 可选。表示当前正在处理的数组元素的索引,若提供 init 值,则起始索引为- 0,否则起始索引为1;
arr 可选。表示原数组;
init 可选。表示初始值。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

js常用数组操作方法 的相关文章

  • 如何使用 JavaScript 创建链接?

    我有一个标题字符串和一个链接字符串 我不知道如何将两者放在一起以使用 JavaScript 在页面上创建链接 任何帮助表示赞赏 我试图解决这个问题的原因是因为我有一个 RSS 源并且有一个标题和 URL 列表 我想将标题链接到 URL 以使
  • 在 contenteditable div 中选择范围

    我有一个contenteditablediv 和其中的一些段落 这是我的代码 div style border solid 1px black width 300px height 300px div Hello world div div
  • Eslint errorring 导入没有扩展名的 jsx

    我正在尝试在 es6 中导入 jsx 文件而不需要 jsx 扩展名 import LoginErrorDialog from LoginErrorDialogView Not import LoginErrorDialog from Log
  • Javascript Promise“then”始终运行,即使 Promise 未能执行

    我希望当调用第二个 then 时不执行第三个 then 但是 即使 Promise 被拒绝 调用第二个 then 并且代码返回 rejected 然后返回 undefined 它仍然调用第三个 then 如何不运行第三个 then 这样 未
  • 为什么 iife 在一个简单的例子中不起作用?

    我不明白为什么函数表达式调用不起作用并抛出错误 你能给我解释一下吗 var a function x alert x function a 1 谢谢大家 任务比我想象的要容易得多 这是因为 JS 将 IIFE 解析为函数的参数调用 这样做时
  • 如何修改每个JSON对象javascript

    我想修改里面的每个 JSON 值cooldown object cooldown user 1 This user2 0 This 在 Javascript 中使用 for 语句 我研究了好几个小时 只找到了内部的 blocks Edit
  • Three.js:缩放几何图形后错误的 BoundingBox

    在我的场景中 我有一个简单的立方体 var test new THREE Mesh new THREE CubeGeometry 10 10 10 new THREE MeshBasicMaterial scene add test 该立方
  • 在新的 Google 协作平台 <嵌入 HTML> 中使用 localStorage 和 IndexedDB 不起作用

    我正在尝试将新的 Google 协作平台用于我开发的网页 但是 我在存储本地数据时遇到了问题 本地文件在 Windows 和 Apple safari chrome 中运行良好 从 Google 协作平台尝试一下 没有什么乐趣 此外 在 s
  • 如何更改 Google Maps v3 API for Directions 中的开始和结束标记图像

    我使用 DirectionsRender 绘制了一条路线 但我不知道如何用我自己的标记替换通用的 Google 标记 我知道并在正常的谷歌地图情况下使用它 但发现很难用开始和结束的方向标记来做到这一点 如果这是一个愚蠢的问题 感谢您的任何建
  • 如何针对 Node.js 中发生的每个错误发送电子邮件?

    假设我的 node js 应用程序正在运行 如果出现错误 我的意思是所有错误 不仅仅是网络错误 如果出现错误 则很重要 我如何调用函数向我发送电子邮件 基本上 在我希望它写入 err out 之前 我希望向我发送一封电子邮件 我正在使用no
  • 在打字稿中导入 json

    我是 typescript 的新手 在我的项目中 我们使用 typescript2 在我的要求之一中 我需要导入 json 文件 所以我创建了 d ts 文件如下 test d ts declare module json const va
  • 如何纠正流警告:解构(缺少注释)

    我正在编写一个小型 React Native 应用程序 并且正在尝试使用 Flow 但我无法在任何地方真正获得有关它的正确教程 我不断收到错误 destructuring Missing annotation 有关 station 这段代码
  • 将 GMT 时间转换为当地时间

    我以这种格式从我的服务器获取 GMT 时间 Fri 18 Oct 2013 11 38 23 GMT 我的要求是使用Javascript将此时间转换为本地时间 例如 如果用户来自印度 首先我需要采用时区 5 30并将其添加到我的服务器时间并
  • 设置 cookie 时中断 JavaScript 执行

    当设置 cookie 时 是否可以始终中断浏览器开发人员工具中的 javascript 执行 无需显式设置 JS 断点 document cookie 在 html head 块的开头添加此代码片段效果很好
  • Javascript split 不是一个函数

    嘿朋友们 我正在使用 javascript sdk 通过 jQuery facebook 多朋友选择器在用户朋友墙上发布信息 但是我收到此错误friendId split 不是函数 这是我的代码 function recommendToFr
  • 在 JavaScript 循环之外声明变量可以提高速度和内存?

    C 也有类似的问题 但我们没有看到 JavaScript 的任何问题 在循环内声明变量是否可以接受 假设循环有 200 次迭代 使用样本 2 相对于样本 1 是否有性能要求 内存和速度 我们使用 jQuery 来循环 它提高了我们将 var
  • Javascript - 水波纹效果

    我需要 JS 上的脚本 它将以 水波纹 样式更改 images html 抱歉 6MB GIF 文件 http fcuunited ru temp listening2 gif http fcunited ru temp listening
  • Javascript Replace() 和 $1 问题

    我正在尝试创建一个脚本来搜索文本中的模式并在它找到的字符串周围包裹一个标签 shop attributes td each function this html function i html return html replace E 0
  • 从 FileReader 设置背景图像样式

    我正在寻找一种解决方案 允许我从文件上传输入中获取文件并通过设置 document body style backgroundImage 来预览它 以下代码用于在 Image 元素中显示预览 function setImage id tar
  • 如何在react-highcharts中使用图表工具提示格式化程序?

    如何使用图表工具提示格式化程序 我正在使用高图表的反应包装器 我有这样的配置 const CHART CONFIG tooltip formatter tooltip gt var s b this x b each this points

随机推荐

  • Anaconda打开Navigator报错-Navigator Error An unexpected error occurred on Navigator start-up

    问题如图 Windows下 1 使用管理员运行 conda prompt 2 执行命令 conda update anaconda navigator 3 还是不行就试试命令 anaconda navigator reset 来源 Navi
  • Opencv contours找出最大轮廓

    在处理二值图像时 常用 cv2 findContours 查找轮廓 如下所示 find all contours contours hierarchy cv2 findContours binary cv2 RETR TREE cv2 CH
  • vue前端缓存问题解决方案

    问题描述 大家用vue脚手架搭建前端工程时 常被缓存问题所困扰 具体的表现就是 当程序版本升级时 用户因为缓存访问的还是老的页面 然后很多同学很暴力的直接在index html中加入了这几行代码 升级时缓存问题倒解决了 但直接导致了用户每次
  • 用Eclipse创建第一个Spring项目(最最入门级)

    网上关于Spring的介绍资料已经数不胜数 但大多篇幅冗长 初学者不易理解记忆 这里先作一个简短的提炼 不作详细解释 主要内容是带大家创建一个Spring项目 感受一下这东西到底是什么样的 1 Spring Framework是用来干嘛的
  • 高效实现数据仓库的七个步骤

    高效实现数据仓库的七个步骤 数据仓库和我们常见的RDBMS系统有些亲缘关系 但它又有所不同 如 果你没有实施过数据仓库 那么从设定目标到给出设计 从创建数据结构到编写数据分析程序 再到面对挑剔的用户的评估 整个过程都会带给你一种与以往的项目
  • Hbase常用SQL命令

    这里写目录标题 Hbase常用SQL命令 1 启动hbase 2 进入hbase 3 hbase查看数据表 4 hbase建表语句 5 hbase禁用表 启用表 6 hbase添加单行数据 7 hbase文档添加数据 8 hbase扫描表
  • 分块矩阵求行列式

    分块矩阵求行列式 注意 第二个公式有误 将矩阵写为 P A B B A 那么det P det A det A BA 1B def A BA 1B a 1 1 A a b1 B a b2 a 0或a 1均可构造无穷多解 def A det
  • 基于Redis的原子操作优化秒杀逻辑

    对于缓存中间件Redis 相信各位小伙伴或多或少都有听说过 甚至实战过 本文我们将基于SpringBoot整合Redis中间件 并基于其优秀的 单线程 特性和原子操作实现一种 分布式锁 进而控制 高并发情况下多线程对于共享资源的访问 最终解
  • 递归法取硬币java_递归算法

    递归算法 在函数或子过程的内部 直接或者间接地调用自己的算法 特点 1 递归就是在过程或函数里调用自身 2 在使用递归策略时 必须有一个明确的递归结束条件 称为递归出口 3 递归算法解题通常显得很简洁 但递归算法解题的运行效率较低 所以一般
  • 线程池合理估算大小

    分配线程池究竟设置多大还是要看你的执行的任务 不要单方面看 线程任务分为Cpu密集型和IO密集型 混合型 主要看系统运行的任务是什么类型的 主要分为3种类型任务 CPU密集型和IO密集型 混合型任务 cpu密集型 一般分配N 1 什么是cp
  • Java 面试题(什么是分布式架构)

    Java 的分布式架构是指将应用程序分为不同的部分 这些部分可分别部署在不同的计算机上 它们相互之间通过网络进行通信和协作 从而共同完成某些任务 分布式应用程序通常需要满足以下几个特点 1 模块化 将应用程序模块化 将不同的功能放在独立的模
  • idea2022.2.2体验

    IntelliJ IDEA 2022 2 最新变化 IntelliJ IDEA 2022 2 为远程开发功能带来了多项质量改进 使其更美观 更稳定 从 v2022 2 开始 IntelliJ IDEA 使用 JetBrains Runtim
  • Java 构造方法与静态方法全解析

    构造方法 作用 一个类 可以有多个构造函数 构造函数的主要作用 一是用来实例化该类 二是 让该类实例化的时候执行哪些方法 初始化哪些属性 注意事项 如果你没写无参构造方法 系统会给你提供一个无参构造方法 如果只写了有参的构造方法 这时系统不
  • QT信号和槽参数传递

    写了一个这样的信号 void caculateReady QList
  • 异常检测专栏(三)传统的异常检测算法——上

    前言 在上一篇推文中 我们简要介绍了异常检测常用的几种数据集如ImageNet CIFAR10 CIFAR100 MNIST等 接下来 我们将基于传统的异常检测算法分为上 下两部分 逐一介绍不同类别的方法 本教程禁止转载 同时 本教程来自知
  • 基于 Postman 接口自动化场景设计

    一个强大的工具 基于 Postman 接口自动化场景设计 使用Xmind或者Yaml 设计 postman 自动化场景 引言 postman是一个比较轻量级的接口测试工具 在单个接口的测试表现优秀 在批量测试接口方面则提供了Runner C
  • ajax数据类型json,Ajax请求不与数据类型“jsonp”或“JSON”

    我想使用JSON作为Ajax请求 使用jQuery 的返回类型 但我的代码总是导致错误 我试过改变json和jsonp之间的MIME类型 但无济于事 Ajax请求不与数据类型 jsonp 或 JSON 我也不确定是否正确格式化数据 部分 我
  • 如何让HTTPS站点评级达到A+? 还得看这篇HTTPS安全优化配置最佳实践指南

    文章目录 0x00 前言简述 SSL TLS 简单说明 SSL TLS 相关术语一览 0x01 HTTPS安全实践指南 1 证书 certificate 与私钥 Private key 2 中间件SSL TLS服务器配置 3 SSL TLS
  • [news] Lion: The Complete Macworld Review

    the complete version is from http www macworld com article 161026 2011 07 osx lion review html In a decade Mac OS X evol
  • js常用数组操作方法

    1 concat 用于连接两个或多个数组 该方法不会改变现有的数组 仅会返回被连接数组的一个副本 2 join 用于把数组中的所有元素放入一个字符串 元素是通过指定的分隔符进行分隔的 默认使用 号分割 不改变原数组 3 push 可向数组的