javascript数组常用api使用汇总(一)

javascript数组常用api使用汇总(一)

  • unshift向数组的开头添加一个或更多元素,并返回新的长度。
  • shift删除并返回数组的第一个元素并返回删除的元素。
  • push向数组的末尾添加一个或更多元素,并返回新的长度。
  • pop删除数组的最后一个元素并返回删除的元素。
  • splice从数组中添加或删除元素。
  • copyWithin从数组的指定位置拷贝元素到数组的另一个指定位置中。
  • concat连接两个或更多的数组,并返回结果。
  • fill使用一个固定值来填充数组。
  • indexOf搜索数组中的元素,并返回它所在的位置。
  • lastIndexOf搜索数组中的元素,并返回它最后出现的位置。
  • includes判断一个数组是否包含一个指定的值。
  • join把数组的所有元素放入一个字符串。

unshift、shift、push、pop 数组的增删方法

  const arr = [1, 2, 3]
  arr.unshift(0) // 4
  // 多个元素按正常顺序插入
  arr.unshift(-1, -2) // 6
  arr.shift() // -1

  arr.push(4) // 6
  arr.push(5, 6) // 8
  arr.pop() // 6

因为js没有堆栈的概念,基本都是用数组来表示,想出就出想进就进,想从哪出就从哪出,想从哪进就从哪进。

splice、copyWithin、concat、fill 其它操作方法

splice是数组里面比较强大的操作方法,可以包括了增删改。可以接受三个参数

  • 参数一:想要操作数组的具体位置
  • 参数二:需要删除的个数,不需要删除填0个
  • 参数三+:需要添加的元素,可以添加多个元素

    返回值:返回删除元素组成的数组,如果删除元素是0则返回空数组
  const arr = [1, 2, 3, 4, 5]
  // 增
  arr.splice(arr.length - 1, 0, 6) // 在数组的最后一个位置后面新增元素6

  arr.splice(2, 2) // [3, 4]
  // 上面删除了数组arr从位置索引2开始计算的2个元素,并返回组成的数组

  // 如果需要修改数组的某个元素,这里用到的是替换,将原来的元素删除然后替换成新的元素
  arr.splice(0, 1, 12) // 这里已经将数组arr的0索引处的元素替换成了12

copyWithin方法用于从数组的指定位置拷贝元素到数组的另一个指定位置中。

  • 参数一*:复制到指定目标索引位置
  • 参数二:元素复制的起始位置
  • 参数三:停止复制的索引位置 (默认为 array.length)。如果为负值,表示倒数

    返回修改后的数组
    const arr = [1, 2, 3, 4]
    arr.copyWithin(2, 0) // [1, 2, 1, 2]
    注意:引用数据类型拷贝只是拷贝数据引用地址

concat方法合并两个及以上的数组并返回一个新数组

  const arr = [1, 2, 3, 4]
  const arr1 = [5, 6, 7, 8]
  const arr2 = arr.concat(arr1, [9, 10])
  console.log(arr, arr2) // [1, 2, 3, 4] [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
  // 不会改变原数组需要接住它返回的新数组

fill方法是将数组的所有元素填充为某个元素

  const arr = [1, 2, 3, 4, 5, 6]
  arr.fill(5) // [5, 5, 5, 5, 5, 5]
注意:引用数据类型都是指向一个地址的

indexOf、lastIndexOf、includes 查询方法

indexOflastIndexOfincludes这三个基本查询方法跟前面介绍的字符串的三个方法类似

  const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 1, 0]
  // 从数组前面开始查找,找到相同的值则返回对应的数组位置索引
  arr.indexOf(1) // 0
  // 从数组后面开始查找,找到相同的值则返回对应的数组位置索引
  arr.lastIndexOf(1) // 9
  // 查找数组中是否有指定元素
  arr.includes(2) // true
  arr.includes(10) // false

join

join方法是将数组按照特定的字符拼接成字符串

  const arr = [52342, 41341, 65434]
  arr.join('-') // 52342-41341-65434
  // 上面演示将数组arr用-符号拼接成字符串。join如果不传参数则默认为','
18 声望
0 粉丝
0 条评论
推荐阅读
单文件组件下的vue,可以擦出怎样的火花
与时俱进吧,看着 vue3 和 vite,虽然不会用,但还是心痒痒,然后就把原先基于 vue@2 的实现做了重构。不周之处,大家见谅!下面关于过期的内容,我就用删除线标记了。

leftstick65阅读 45.2k评论 18

从零搭建 Node.js 企业级 Web 服务器(零):静态服务
过去 5 年,我前后在菜鸟网络和蚂蚁金服做开发工作,一方面支撑业务团队开发各类业务系统,另一方面在自己的技术团队做基础技术建设。期间借着 Node.js 的锋芒做了不少 Web 系统,有的至今生气蓬勃、有的早已夭折...

乌柏木150阅读 12.4k评论 10

正则表达式实例
收集在业务中经常使用的正则表达式实例,方便以后进行查找,减少工作量。常用正则表达式实例1. 校验基本日期格式 {代码...} {代码...} 2. 校验密码强度密码的强度必须是包含大小写字母和数字的组合,不能使用特殊...

寒青56阅读 7.9k评论 11

JavaScript有用的代码片段和trick
平时工作过程中可以用到的实用代码集棉。判断对象否为空 {代码...} 浮点数取整 {代码...} 注意:前三种方法只适用于32个位整数,对于负数的处理上和Math.floor是不同的。 {代码...} 生成6位数字验证码 {代码...} ...

jenemy46阅读 6.1k评论 12

从零搭建 Node.js 企业级 Web 服务器(十五):总结与展望
总结截止到本章 “从零搭建 Node.js 企业级 Web 服务器” 主题共计 16 章内容就更新完毕了,回顾第零章曾写道:搭建一个 Node.js 企业级 Web 服务器并非难事,只是必须做好几个关键事项这几件必须做好的关键事项就...

乌柏木66阅读 6.2k评论 16

再也不学AJAX了!(二)使用AJAX ① XMLHttpRequest
「再也不学 AJAX 了」是一个以 AJAX 为主题的系列文章,希望读者通过阅读本系列文章,能够对 AJAX 技术有更加深入的认识和理解,从此能够再也不用专门学习 AJAX。本篇文章为该系列的第二篇,最近更新于 2023 年 1...

libinfs40阅读 6.4k评论 12

封面图
从零搭建 Node.js 企业级 Web 服务器(一):接口与分层
分层规范从本章起,正式进入企业级 Web 服务器核心内容。通常,一块完整的业务逻辑是由视图层、控制层、服务层、模型层共同定义与实现的,如下图:从上至下,抽象层次逐渐加深。从下至上,业务细节逐渐清晰。视图...

乌柏木44阅读 7.5k评论 6

18 声望
0 粉丝
宣传栏