博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
吐槽Javascript系列二:数组中的splice和slice方法
阅读量:7228 次
发布时间:2019-06-29

本文共 1539 字,大约阅读时间需要 5 分钟。

战斗英雄你当,漂亮媳妇儿你娶,怎么啥好事都被你给占了——《激情燃烧的岁月》

谈起这两个方法,新手不蒙,我是不信!正如吐槽Javascript系列一:slice()、substr()和 substring()中提到的,字符串中也有一个slice方法,极易混淆!

但其实呢,在数组中,他们还是很好区分的。

splice

splice,译为拼接,它的功能非常强大,能够删除,新增,修改原数组,功能三合一哦,我们先来看它的删除功能:

// 删除let colors = ['red', 'green', 'blue']let removed = colors.splice(0, 1)console.log(removed) // [ 'red' ]console.log(colors) // [ 'green', 'blue' ]

上面代码中,splice接收了二个参数,第一个参数表示要删除的第一项的位置,第二个参数表示要删除的项数。

我们再来看看它的添加功能:

// 添加let colors = ['red', 'green', 'blue']let removed = colors.splice(1, 0, 'yellow', 'orange')console.log(removed) // []console.log(colors) // [ 'red', 'yellow', 'orange', 'green', 'blue' ]

上面代码中,splice接收了四个参数,第一个参数表示要删除的第一项的位置,第二个参数表示要删除的项数,从第三个参数开始,表示要添加的项。

我们再来看看它的替换功能:

// 替换let colors = ['red', 'green', 'blue', 'orange']let removed = colors.splice(2, 1, 'yellow', )console.log(removed) // [ 'blue' ]console.log(colors) // [ 'red', 'green', 'yellow', 'orange' ]

上面代码中,splice接收了三个参数,第一个参数表示要删除的第一项的位置,第二个参数表示要删除的项数,第三个参数表示要添加的项。

原来,它的替换功能实际上是通过删除和添加来完成的。

说完splice,接下来说slice。

slice

slice,译为切开,我们来看例子:

let arr = ['red', 'green', 'blue', 'yellow']let arr1 = arr.slice(1)let arr2 = arr.slice(1, 2)console.log(arr1) // [ 'green', 'blue', 'yellow' ]console.log(arr2) // [ 'green' ]console.log(arr) // [ 'red', 'green', 'blue', 'yellow' ]

slice接受一或两个参数,即要返回项的起始和结束位置。在只有一个参数的情况下,slice()方法返回从该参数指定位置开始到当前数组末尾的所有项。它并不改变原数组。

吐槽splice

我曾经一直困惑数组中的删除方法,当知道删除这项伟大的任务竟然交给了splice,我心里是失望的。

不应该是del或者remove才像话吗?删除的功能它占了也就算了,添加的功能它也占了!它既能添加,也能删除,还能拼接,那它为什么没有七十二变?

吐槽slice

一个西瓜,被菜刀切成几块,这西瓜还是原来的西瓜吗?那一个数组,被你切了几下,那数组还是原来的数组吗?

转载地址:http://rzcfm.baihongyu.com/

你可能感兴趣的文章
Android电量优化
查看>>
[爬虫手记] 我是如何在3分钟内开发完一个爬虫的
查看>>
【译】Css Grid VS Flexbox: 实践比较
查看>>
iOS 开发知识索引
查看>>
Linux iptables命令
查看>>
webpack的使用
查看>>
干货 | 基于Go SDK操作京东云对象存储OSS的入门指南
查看>>
D3.js入门
查看>>
一次和前端的相互甩锅的问题记录
查看>>
纯OC实现iOS DLNA投屏功能了解一下
查看>>
RxJava -- fromArray 和 Just 以及 interval
查看>>
LC #75 JS
查看>>
js正则验证代码库
查看>>
常见面试题—css实现垂直水平居中
查看>>
lc682. Baseball Game
查看>>
重学前端-css选择器
查看>>
iOS开发之扫描二维码
查看>>
Android黑科技: 快速找到view所在的xml文件
查看>>
linux分区方案
查看>>
003-Java技术体系
查看>>