最近学习了数组与字符串，在练习的过程中，经常弄混数组中的slice,splice,以及字符串中的substr,substring,slice。然后自己总结了一下他们之间的区别。
数组中的slice与splice
slice(start_index,end_index)
- 不操作原数组，返回一个新数组
- 在数组选取的时候抽取不到下标为end_index的元素,即:类似于 start_index <= 新数组 < end_index
- end_index为负数时， 则它表示在原数组中的倒数第几个元素结束抽取
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> </body> <script> var arr = [1,2,3,4,5,6,7,8]; //从start_index开始到end_index的前一位结束 var res = arr.slice(1,5); console.log(res,arr);//[2, 3, 4, 5] [1, 2, 3, 4, 5, 6, 7, 8] //只有start_index,会一直截取数组到最后一项 var res = arr.slice(2); console.log(res); //[3, 4, 5, 6, 7, 8] //只有start_index,且start_index为负数,会从原数组中的倒数第几个元素开始提取，直到最后一项 var res = arr.slice(-2); console.log(res); //[7, 8] //start_index,大于数组长度，返回空数组 var res = arr.slice(9); console.log(res); //[] //slice中什么都不写，会默认从第一项截取到最后一项 var res = arr.slice(); console.log(res); //[1, 2, 3, 4, 5, 6, 7, 8] //start_index为负数,end_index为正数,返回空数组 var res = arr.slice(-2,1); console.log(res);//[] //start_index为负数,end_index为负数 //原数组中的倒数第"start_index"个元素到最后"end_index"个元素 var res = arr.slice(-5,-2); console.log(res);//[4, 5, 6] //如果end_index大于数组长度，会截取到数组末尾 var res = arr.slice(2,9); console.log(res);//[3, 4, 5, 6, 7, 8] </script> </html>
splice(start_index,length，replaceitem)
- 操作原数组的，同时将截取的数据返回到新的数组，原数组的长度也会改变
- replaceitem，截取之后在原来截取数组的位置新增的数据，可以有多个
- 选取范围：从start_index开始，选取"length"个数据
- 可以实现对数组的增加、修改、删除
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> </body> <script> // var arr = [1,2,3,4,5,6,7,8]; //以下没有添加replaceitem的情况，可以用作数组的删除操作 //从下标 0开始，选取3个数据 // var res = arr.splice(0,3); // console.log(res,arr);//[1, 2, 3] [4, 5, 6, 7, 8] //如果start_index超出数组长度，则会返回空数组 // var res = arr.splice(11,3); // console.log(res,arr);//[] [1, 2, 3, 4, 5, 6, 7, 8] //如果start_index是负值，则表示起始位置是从数组末位开始的第几位（从-1计数) // var res = arr.splice(-3,2); // console.log(res,arr);//[6, 7] [1, 2, 3, 4, 5, 8] // 如果start_index的绝对值大于数组的长度，则表示开始位置为第0位。 // var res = arr.splice(-11,2); // console.log(res,arr);//[1, 2] [3, 4, 5, 6, 7, 8] //如果 length 是 0 或者负数，则不移除元素。 // var res = arr.splice(2,0); // console.log(res,arr);//[] [1, 2, 3, 4, 5, 6, 7, 8] //添加replaceitem的情况，可以用作数组的修改，增加操作 var arr = [1,2,3,4,5,6,7,8]; //末尾新增,想加在数组的其他地方只需要改变splice的start_index即可 // var res = arr.splice(8,0,"hello") // console.log(res,arr) //[] [1, 2, 3, 4, 5, 6, 7, 8, "hello"] //修改,截取掉不需要的项，换上需要的数据 var res = arr.splice(6,1,"hello") console.log(res,arr) //[7] [1, 2, 3, 4, 5, 6, "hello", 8] </script> </html>
字符串中的substr、substring、slice
subStr(start_index,length)
- 选取范围：从start_index开始，选取"length"个数据
-
如果忽略 length，则 substr 提取字符，直到字符串末尾
-
如果 length 为 0 或负值，则 substr 返回一个空字符串。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> </body> <script> var str = "abcdefgh"; var res = str.substr(1,3); console.log(res,str); //bcd abcdefgh //start_index 为正值，且大于或等于字符串的长度，则 substr 返回一个空字符串。 var res = str.substr(10,3); console.log(res,str); // res结果为空 abcdefgh // start_index为负值，则 substr 把它作为从字符串末尾开始的一个字符索引。 var res = str.substr(-3,2); console.log(res,str); //fg abcdefgh // start_index为负值，且绝对值大于字符串长度，则从0开始选取 var res = str.substr(-20,2); console.log(res,str); //ab abcdefgh //如果忽略 length，则 substr 提取字符，直到字符串末尾。。 var res = str.substr(-3); console.log(res,str); //fgh abcdefgh var res = str.substr(3); console.log(res,str); //defgh abcdefgh //如果 length 为 0 或负值，则 substr 返回一个空字符串。 var res = str.substr(4,0) console.log(res); //空 </script> </html>
substring(start_index,end_index)
- 截取范围：从start_index开始到end_index之前的字符，不包括end
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> </body> <script> var str = "abcdefghijk" var res = str.substring(2,5); console.log(res,str); //cde abcdefghijk // 如果省略 end_index, 提取字符一直到字符串末尾。 var res = str.substring(2); console.log(res,str); //cdefghijk abcdefghijk // 如果任一参数小于 0 或为 NaN，则被当作 0。 var res = str.substring(-1,5); console.log(res,str); //abcde abcdefghijk </script> </html>
slice(start_index,end)
字符串中的slice和上面数组中的slice用法完全一致
slice和substring区别
- substring不能直接接受负值作为参数，如果传递了一个负值，则默认使用0
- slice可以传递一个负数作为参数，将会从后边计算
希望能对伙伴们起到作用，如果有伙伴发现不足之处，请伙伴们指点！
最后，用一句诗与伙伴们共勉-----不经一番寒彻骨，怎得梅花扑鼻香！