当前位置：首页 > news >正文

js中的 slice、splice、split、substring、substr

news 2025/8/10 3:06:59

数组中的slice和splice

slice:截取数组
splice:删除、插入、替换数组

slice:

若只有一个参数表示从当前位置截取到最后一位
若有两个参数表示从第一个参数开始截取到第二个参数（不包括第二个参数的位置）
若只有一个参数且是负数表示从倒数位置开始截取到最后一位

var aaa = [1, 2, 3, 4, 5]
var bbb = aaa.slice(2)
console.log(bbb)  // [3,4,5]
var ccc = aaa.slice(2, 3)
console.log(ccc)  // [3]
var ddd = aaa.slice(-2)
console.log(ddd)  // [4,5] 从倒数第二位开始截取到最后一位
var eee = aaa.slice(-2, 6)
console.log(eee)  // [4,5] 从倒数第二位开始截取到第6位 由于其长度小于6位 所以默认截取到最后
var fff = aaa.slice(-4, 6) 从倒数第四位开始截取到第6位 由于其长度小于6位 所以默认截取到最后
console.log(fff)  // [2,3,4,5]
var fff2 = aaa.slice(-4, 3) 从倒数第四位开始截取到第3位 不包含第三位 即截取到第二位
console.log(fff2)  // [2,3] 
var ggg = aaa.slice(2, -6)  
console.log(ggg)  // [] 从索引为2开始截取  截取长度为0
var hhh = aaa.slice(-2, -6)
console.log(hhh)  // [] 从索引为2开始截取  截取长度为0 只要是负数都是0
console.log(aaa)  // [1,2,3,4,5]

说明：

slice截取后，返回一个新数组，不会影响原来数组
slice传入一个负数，表示从倒数的位置开始截取截取的第二个参数是从截取之后的位置往后开始计算的。截取的第二个参数不能是负数否则就返回的是一个空数组

splice：

一个参数：若这个参数是负数，表示从倒数项开始计算删除的位置到最后一项
一个参数：表示要删除的项的起始位置到最后一项
两个参数：一个参数表示要删除的起始位置，第二个参数表示要删除的项数
三个参数：第一个参数要删除的起始位置，第二个参数表示要删除的项数，第三个删除表示要插入的项，若第二个参数是为0 表示没有删除直接就是插入，若第二个参数不是0，则表示要删除某一些项就是替换，若后面还有其他的参数就是要插入或要替换的项目

var aaa = [1, 2, 3, 4, 5]
var bbb = aaa.splice(-2)
console.log(bbb)  // [4,5] 从倒数第二位开始删除  直到最后一项
console.log(aaa) // [1,2,3]var aaa1 = [1, 2, 3, 4, 5]
var bbb1 = aaa1.splice(2) 
console.log(bbb1)  // [3,4,5] 从第二位开始删除  直到最后一项
console.log(aaa1) // [1,2]var aaa11 = [1, 2, 3, 4, 5]
var bbb11 = aaa11.splice(2, 2)
console.log(bbb11)  // [3,4]
console.log(aaa11) // [1,2,5]var aaa22 = [1, 2, 3, 4, 5]
var bbb22 = aaa22.splice(2, 0, "22", "23")
console.log(bbb22)  // []
console.log(aaa22) // [1,2,"22","33",3,4,5]var aaa33 = [1, 2, 3, 4, 5]
var bbb33 = aaa33.splice(2, 2, "11", "22")
console.log(bbb33)  // [3,4]
console.log(aaa33) // [1,2,"11","22",5]

说明：

splice之后的返回的删除之后的数组，会影响原数组，原数组就是操作之后的数组
splice当删除的项是0的时候，要替换的位置就是当前索引之前的位置，而不是当前索引之后的位置

字符串中的slice和split
slice方法和数组中的slice方法一致

split：分割：将字符串分割成数组

只有一个参数，表示要分割的位置
若是什么都没有传或者字符串中没有对应的字符则表示不分割
若传入的是一个空字符串表示分割每一个字符串
若传入的是一个空格表示以空格的位置进行分割

var a = "hello xiaoming"
console.log(a.split())      // "hello xiaoming"
console.log(a.split(""))    // ["h","e","l","l","o"," ","x","i","a","o","m","i","n","g"]
console.log(a.split(" "))   // ["hello","xiaoming"] 
console.log(a.split("o"))   // ["hell"," xia","ming"]
console.log(a.split("o 0")) // "hello xiaoming"

说明：

分割位置定了以后，被分割的字符串将被丢掉

substring和str

这两个都是截取字符串长度的第一个参数均表示开始截取的位置第二个参数含义不一样
substring表示要截取到位置的索引，不包含最后的位置
substr表示要截取的长度

var b = "hello xiaoming";
console.log(b.substring(0, 7))    // "hello x"
console.log(b.substring(1, 2))    // "e"
console.log(b.substring(2, 1))    // "e"
console.log(b.substring(-1, 2))   // "he"  负数作为0处理 等价于0-2
console.log(b.substring(-4, 5))   // "hello"  负数作为0处理 等价于0-5
console.log(b.substring(4, -5))   // "hell"  负数作为0处理 等价于4-0 然后调换位置变为0-4
console.log(b.substring(-4, -5))   //       负数作为0处理 等价于0-0  无任何截取console.log("---------")console.log(b.substr(0, 7))       // "hello x"
console.log(b.substr(1, 2))       // "el"
console.log(b.substr(2, 1))       // "l"
console.log(b.substr(-1, 2))      // "g"  从倒数位置开始截取 因为是最后一位  所以只有一个g
console.log(b.substr(-4, 5))      // "ming"  从倒数位置开始截取 截取5位 因为长度不够 所以就只有4位
console.log(b.substr(-4, 3))      // "min"  从倒数位置开始截取 截取3位 
console.log(b.substr(4, -5))      //    第二个参数负数表示0  表示无任何截取
console.log(b.substr(-4, -5))     //    第二个参数负数表示0  表示无任何截取