资讯专栏INFORMATION COLUMN

关于JS数组API的总结

PiscesYE / 2760人阅读

摘要:在学习的道路上,数组是一个很重要的部分,数组的很多,也很容易混淆,每次对数组操作时都要去查文档,学习的路上也不能一直前进,有时候要停下来做做总结,我总结了平时比较常用的一些数组,希望能够帮到你。如果没有满足条件的元素,则返回。

在学习JS的道路上,数组是一个很重要的部分,数组的API很多,也很容易混淆,每次对数组操作时都要去查文档,学习的路上也不能一直前进,有时候要停下来做做总结,我总结了平时比较常用的一些数组API,希望能够帮到你。

arry.push()

把一个元素增加到数组的末尾,返回值为新数组的长度arry.length,示例:

let arry = [2, 9, 5]
let returnValue = arry.push(4)
console.log(returnValue) // 4
console.log(arry) // [2, 9, 5, 4]
arry.pop()

删除数组中最后一个元素,返回值为删除的元素,示例:

let arry = [2, 9, 5]
let returnValue = arry.pop()
console.log(returnValue) // 5
console.log(arry) // [2, 9]
arry.unshift()

push方法类似,区别在于它是在数组的前面添加元素,返回值为新数组的长度arry.length,示例:

let arry = [2, 9, 5]
let returnValue = arry.unshift(4)
console.log(returnValue) // 4
console.log(arry) // [4, 2, 9, 5]
arry.shift()

pop方法类似,区别在于它是删除数组前面的元素,返回值依然是被删除的元素,示例:

let arry = [2, 9, 5]
let returnValue = arry.shift()
console.log(returnValue) // 2
console.log(arry) // [9, 5]

由此可知,使用pushshift组合可以实现数据的‘先进先出’当然也可以使用unshiftpop

arry.reverse()

把数组反向排序,这里要注意它会改变原来的数组,而不会创建新的数组,示例:

let arry = [2, 9, 5]
arry.reverse()
console.log(arry) // [ 5, 9, 2 ]
arry.sort()

对数组进行排序,可接受参数,参数必须是函数,如果不没有参数 则是按照字符编码的顺序进行排序,示例:

let arry = [10, 5, 40, 1000]
console.log(arry.sort()) // [ 10, 1000, 40, 5 ]

如果数字想要按大小排列,可写入参数:

let arr = [3, 1, 7]
console.log(arr.sort((a, b) => a - b)) // [ 1, 3, 7 ]
arry.forEach(item, index)arry.map(item, index)

两者都是对数组遍历,index表示数组索引,不是必须的参数区别在于map方法会返回一个新的数组,示例:

let arry = [1, 5, 10, 15];
let arry1 = arry.map( x => x + 2);
console.log(arry1) // [ 3, 7, 12, 17 ]
arry.some()

用于检测数组中的元素是否满足指定条件,参数也是函数如果有一个元素满足条件,则表达式返回true , 剩余的元素不会再执行检测。如果没有满足条件的元素,则返回false。

let arry = [1, 5, 10, 15];
console.log(arry.some(item => item > 10)) // true
arry.every()

用于检测数组中的所有元素是否满足指定条件,只有当数组中灭一个元素都满足条件时,表达式返回true , 否则返回false,示例:

let arry = [5, 10, 15];
console.log(arry.every(item => item > 2)) // true
arry.filter()

它创建一个新的数组,原数组不变,新数组中的元素是通过检查指定数组中符合条件的所有元素,示例:

let arry = [1, 5, 10, 15];
let arry1 = arry.filter(item => item > 5)
console.log(arry) // [ 1, 5, 10, 15 ]
console.log(arry1) // [ 10, 15 ]
arry.join()

把数组元素合并为一个字符串,如果不带参数,默认用逗号分隔

let arry = [5, 10, 15];
console.log(arry.join()) // 5,10,15
// 添加参数
let arry = [5, 10, 15];
console.log(arry.join(".")) // 5.10.15
arry.splice(index, hm, add)

它既可以删除特定的元素,也可以在特定位置增加元素,也可以删除增加同时搞定,index是起始位置,hm是要删除元素的个数,add是要增加的元素,上例子:

let myFish = ["angel", "clown", "mandarin", "sturgeon"]
myFish.splice(2, 0, "drum") // hm为0 表示不删除任何元素
console.log(myFish) // [ "angel", "clown", "drum", "mandarin", "sturgeon" ]
let myFish = ["angel", "clown", "mandarin", "sturgeon"]
myFish.splice(2, 1, "drum")
console.log(myFish)  // [ "angel", "clown", "drum", "sturgeon" ]
arry.concat()

用于连接两个或多个数组,返回值为连接后的新数组,原数组不变,示例:

let arry1 = [1, 2, 3]
let arry2 = [4, 5, 6]
arry1.concat(arry2)
console.log(arry1.concat(arry2)) // [ 1, 2, 3, 4, 5, 6 ]

这些就是关于数组常用的api,可以大胆地添加收藏,以备不时之需~

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/89865.html

相关文章

  • JS】JavaScript数组以及数组API学习总结

    摘要:返回数组内容的字符串表示形式将数组中每个元素转为字符串,并用逗号连接。拍照连接符将数组中每个元素转为字符串,用自定义的连接符连接每个元素需要用变量借助。 关于数组篇的记录,纯自己总结,会持续更新~ 原生js方法 1:创建数组的几种方法: var arr = []; var arr = new Array(); var arr = [1,2]; var arr = new Arr...

    roundstones 评论0 收藏0
  • JavasScript重难点知识

    摘要:忍者级别的函数操作对于什么是匿名函数,这里就不做过多介绍了。我们需要知道的是,对于而言,匿名函数是一个很重要且具有逻辑性的特性。通常,匿名函数的使用情况是创建一个供以后使用的函数。 JS 中的递归 递归, 递归基础, 斐波那契数列, 使用递归方式深拷贝, 自定义事件添加 这一次,彻底弄懂 JavaScript 执行机制 本文的目的就是要保证你彻底弄懂javascript的执行机制,如果...

    forsigner 评论0 收藏0
  • 前端面试知识点目录整理

    摘要:写在前面金三银四又到了一年一度的跳槽季相信大家都在准备自己面试笔记我也针对自己工作中所掌握或了解的一些东西做了一个目录总结方便自己复习详细内容会在之后一一对应地补充上去有些在我的个人主页笔记中也有相关记录这里暂且放一个我的面试知识点目录大家 写在前面: 金三银四, 又到了一年一度的跳槽季, 相信大家都在准备自己面试笔记, 我也针对自己工作中所掌握或了解的一些东西做了一个目录总结,方便自...

    xzavier 评论0 收藏0
  • 前端面试知识点目录整理

    摘要:写在前面金三银四又到了一年一度的跳槽季相信大家都在准备自己面试笔记我也针对自己工作中所掌握或了解的一些东西做了一个目录总结方便自己复习详细内容会在之后一一对应地补充上去有些在我的个人主页笔记中也有相关记录这里暂且放一个我的面试知识点目录大家 写在前面: 金三银四, 又到了一年一度的跳槽季, 相信大家都在准备自己面试笔记, 我也针对自己工作中所掌握或了解的一些东西做了一个目录总结,方便自...

    enda 评论0 收藏0
  • webpack 基础与项目优化实践总结

    摘要:前言本文基于,主要涉及基本概念基本配置和实际项目打包优化。关于概念方面参考官网,常用配置来自于网络资源,在文末有相关参考链接,实践部分基于自己的项目进行优化配置。同一文件中,修改某个影响其他。 前言:本文基于weboack4.x,主要涉及webpack4 基本概念、基本配置和实际项目打包优化。关于概念方面参考官网,常用配置来自于网络资源,在文末有相关参考链接,实践部分基于自己的项目进行...

    Scorpion 评论0 收藏0

发表评论

0条评论

PiscesYE

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<