splice-slice-split

三个方法总是记不清,经常搞混,记录一下

splice

splice 数组方法 提供三个参数 不同参数实现不同方法 会改变原数组
1. 删除数组中指定索引的元素 返回值为被删除的元素(数组格式)
参数一: 为要删除项的索引(从哪开始删除)
参数二: 删除的个数

const arr = [1, 2, 3, 4, 5]

const delItem = arr.splice(0, 1)

console.log(arr)  // [ 2, 3, 4, 5 ]
console.log(delItem) // [ 1 ]

2. 往数组指定索引位置添加元素 返回值为空数组
参数一: 为要添加的索引位置(往哪个索引位置添加)
参数二: 只能为 0
参数三: 要添加的项

const arr = [1, 2, 3, 4, 5]

const addArr = arr.splice(0, 0, '添加了')

console.log(arr)  // [ '添加了', 1, 2, 3, 4, 5 ]

console.log(addArr) // []

3. 替换数组中指定的项 返回被替换(删除)的元素
1. 参数一: 要替换的元素的索引
2. 参数二: 要删除的个数
3. 参数三: 替换的值

const arr = [1, 2, 3, 4, 5]

const changeArr = arr.splice(0, 1, 999)

console.log(arr)  // [ 999, 2, 3, 4, 5 ]

console.log(changeArr)  // [ 1 ]

slice

数组方法 通过索引位置截取数组 不会改变原数组
1. 不传参数会浅拷贝一个数组

const arr = [1, 2, 3, 4, 5]

const changeArr = arr.slice()

changeArr[0] = '哈哈哈哈'

console.log(arr)  // [ 1, 2, 3, 4, 5 ]
console.log(changeArr)  // [ '哈哈哈哈', 2, 3, 4, 5 ]

2. 截取数组
参数一: 截取的起始位置(索引, 最后结果包括)
参数二: 截取的结束位置(索引, 最后结果不包括)

const arr = [1, 2, 3, 4, 5]

const changeArr = arr.slice(1, 3)


console.log(arr)  // [ 1, 2, 3, 4, 5 ]
console.log(changeArr)  // [ 2, 3 ]

参数二如果为负数 则表示从数组末尾结束

const arr = [1, 2, 3, 4, 5]

const changeArr = arr.slice(0, -1)


console.log(arr)  // [ 1, 2, 3, 4, 5 ]
console.log(changeArr)  // [ 1, 2, 3, 4 ]

参数一如果为负数则表示从数组末尾开始

const arr = [1, 2, 3, 4, 5]

const changeArr = arr.slice(-1)


console.log(arr)  // [ 1, 2, 3, 4, 5 ]
console.log(changeArr)  // [ 5 ]

split

字符串方法 用于把一个字符串以什么分割成数组
1. 只传一个参数
以参数分割成数组
如果传空字符串则会把每个字符都进行分割 成为数组单独元素
如果传字符串中包含的字符 则会以这个字符来分割成数组(包含的字符会被剔除)

const str = 'Hello JavaScript!'

const splitStr = str.split('')  // [  'H', 'e', 'l', 'l', 'o',  ' ', 'J', 'a', 'v', 'a',  'S', 'c', 'r', 'i', 'p',  't', '!']

const splitStr = str.split('a') // [ 'Hello J', 'v', 'Script!' ]]

2. 参数二: 返回的数组的最大长度

const str = 'Hello JavaScript!'

const splitStr = str.split('', 3)  // [ 'H', 'e', 'l' ]

const splitStr = str.split('a', 3) // [ 'Hello J', 'v', 'Script!' ]]

posted @   加利福尼亚的阳光  阅读(15)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 无需6万激活码!GitHub神秘组织3小时极速复刻Manus,手把手教你使用OpenManus搭建本
· C#/.NET/.NET Core优秀项目和框架2025年2月简报
· 什么是nginx的强缓存和协商缓存
· 一文读懂知识蒸馏
· Manus爆火,是硬核还是营销?
点击右上角即可分享
微信分享提示