substring、substr、splice和slice的区别

1. substring()

substring(start,stop)表示返回从start(包含)到stop(不包含)的新字符串,此方法不会改变原字符串.

举例说明:

var str = "0123456789";
console.log(str.substring(1,5))//"1234" length为5-1
console.log(str.substring(0,9),str)//"012345678"  "0123456789"

其中start是必填项，stop为选填项，如果stop不填, 那表示从start截取到字符串结尾，例如：

var str = "0123456789";
console.log(str.substring(1))//"123456789"

如果start比stop大, 函数也不会报错, 函数执行的时候会先将两个参数互换位置. 例如:

var str = "0123456789";
console.log(str.substring(8,4))//"4567"

如果start和stop相等, 则返回一个空字符串, 例如:

var str = "0123456789";
console.log(str.substring(6,6))//""

如果start或stop为负数, 则方法执行前会将负数变为0, 例如:

var str = "0123456789";
console.log(str.substring(-2,6))//"012345"
console.log(str.substring(2,-6))//"01"
console.log(str.substring(-2,-6))//""

2. substr()

substr(start, length)表示返回从start(包含)开始的length长度的字符串, 不改变原字符串. 与substring相比，第二个参数由代表结束的下标stop变成了规定新字符串长度的length,例如：

var str = "0123456789";
console.log(str.substr(1,5))//"12345" length为5
console.log(str.substr(2,6),str)//"234567" "0123456789"

其中start是必填项, length是选填项, 如果length不填, 则表示从start截取到字符串结尾, 例如:

var str = "0123456789";
console.log(str.substr(1))//"123456789"

如果start为负数, 则start=str.length+start, 例如:

var str = "0123456789";
console.log(str.substr(-1))//"9"
console.log(str.substr(-6,3))//"456"

如果length为负数或者为0, 则返回空字符串, 例如:

var str = "0123456789";
console.log(str.substr(1,0))//""
console.log(str.substr(-1,-1))//""
console.log(str.substr(-1,0))//""

3. slice()

slice()可操作数组和字符串, substring和substr只可以操作字符串, splice()只可以操作数组.

slice(start, stop)表示返回从start(包含)到stop(不包含)的新字符串/数组, 此方法不改变原字符串/原数组, 和substring功能类似. 例如:

var str = "0123456789";
    arr = [0,1,2,3,4,5,6,7,8,9];
console.log(str.slice(1,6))//"12345"
console.log(arr.slice(1,6))//[1,2,3,4,5]

其中start是必填项, stop是选填项, 如果stop不填, 则表示截取从start到字符串/数组结尾, 例如:

var str = "0123456789";
    arr = [0,1,2,3,4,5,6,7,8,9];
console.log(str.slice(1))//"123456789"
console.log(arr.slice(1))//[1,2,3,4,5,6,7,8,9]

和substring()不同, 如果start比stop大(不会互换), 或者start和stop相等, 则截取为空, 例如:

var str = "0123456789";
    arr = [0,1,2,3,4,5,6,7,8,9];
console.log(str.slice(3,3))//""
console.log(arr.slice(3,3))//[]
console.log(str.slice(6,5))//""
console.log(arr.slice(6,5))//[]

需要特别注意的是，如果 start或者stop为负数，那么负数的选项从数组尾部开始算起的位置，最后一个数字为-1，倒数第二个数字为-2，依次类推。例如

var str = "0123456789";
console.log(str.slice(6,-1))//"678"
console.log(str.slice(-6,-1))//"45678"
console.log(str.slice(-6,8))//"4567"

4. splice()

splice()只可以操作数组,不可以操作字符串

splice(start, length, items)表示从下标start处截取length长度的元素, 在start处为原数组添加items, 返回原数组, splice()方法会直接修改原数组.例如:

var arr = [0,1,2,3,4,5,6,7,8,9];
console.log(arr.splice(1,3,2,3,4))//[1,2,3]
console.log(arr);//[0,2,3,4,4,5,6,7,8,9] 原数组被截取走了1,2,3，并加入了2,3,4

其中start和length为必填项，items为选填项，如果length为0或者负数，则返回空数组(这里与substr相似)，例如：

var arr = [0,1,2,3,4,5,6,7,8,9];
console.log(arr.splice(1,0,2,3,4))//[]
console.log(arr);//[0,2,3,4,1,2,3,4,5,6,7,8,9] 直接在原数组下标0处并加入了2,3,4

var arr = [0,1,2,3,4,5,6,7,8,9];
console.log(arr.splice(1,-9,2,3,4))//[]
console.log(arr);//[0,2,3,4,1,2,3,4,5,6,7,8,9] 直接在原数组下标0处并加入了2,3,4

如果start为负数，则原理和slice相似, 负数从右往左截取，最后一位数字为-1，倒数第二位为-2，依次类推，例如:

var arr = [0,1,2,3,4,5,6,7,8,9];
console.log(arr.splice(-1,1,2,3,4))//[9]
console.log(arr);//[0,1,2,3,4,5,6,7,8,2,3,4] 从右往左截取1位，也就是9，并加入2,3,4