js里相似的方法比较系列(二)slice,splice,split方法区别

大家好,我是李俊辉!如果您觉得文章有用,请帮忙点个赞或关注,也为我鼓励一下,坚持写下去!

javascript有很多方法名称相似、功能相似,搞的很多新同学云里雾里,一直处于似懂非懂,不懂又懂的状态(至少我刚学前端前2年是这样的^^||)。主要原因就是懒得花时间整理这些东西,感觉知道是干嘛的就行了。但是当开发碰到问题的时候(特别是字符串或者数组算法问题),往往想不起来到底应该用哪个方法才是更好的选择。始终在心里是个技术结。当你真正踏实下来打算提高自己的时候,这些方法的区别都是你不得不吃透的一块内容。
为此,我准备了八个系列(暂定8个,将来想起来再补充)专门讲解这些让人郁闷的类似功能。

不知道大家对slice, splice, splite是肿么样的感觉,反正我刚接触到这三个函数的时候整个人都懵了,因为一个个长的跟孪生兄弟似的,每次用的时候都会混,甚至懒得记住他们的功能。所以为了帮组和我一样有困扰的人,我们来解决它。

三个方法除了长得像,其实功能完全不一样,为了帮助记忆,先总结一下:

1.sliceArrayString都有的方法,功能也和字符串的slice是一样,截取区间值用的。String的slice()方法请看上篇文章:js里相似的方法比较系列(一)String的slice,substring,substr方法区别。
2.splice仅是数组Array的方法,splice比slice外观上多个p,这一个p蹦出了天差地别,功能超级强大。它能用来插入、删除甚至替换数组的元素。
3.split仅仅是字符串的方法,外观上也有p,但是少了ce,还多了个t。这个t厉害了,一脚把字符串踢成了多段,吓得字符串变成了数组。没错,split()方法就是用来把一个字符串分割成字符串数组。

下面我就来分别说说他们:

1.slice(数组)

用法:array.slice(start, end)

解释:slice()该方法用于对数组进行部分截取,并返回一个数组副本;参数start是截取的开始数组索引,end参数等于你要截取的最后一个元素的索引位置加上1的值(可选)

//如果不传入参数二,那么将从参数一的索引位置开始截取,一直到数组尾
var a=[1,2,3,4,5,6];
var b=a.slice(0,3);    //[1,2,3]
var c=a.slice(3);       //[4,5,6]

//如果两个参数中的任何一个是负数,array.length会和它们相加,试图让它们成为非负数,举例说明:
//当只传入一个参数,且是负数时,length会与参数相加,然后再截取
var a=[1,2,3,4,5,6];
var b=a.slice(-1);    //[6]

//当只传入一个参数,是负数时,并且参数的绝对值大于数组length时,会截取整个数组
var a=[1,2,3,4,5,6];
var b=a.slice(-6);    //[1,2,3,4,5,6]
var c=a.slice(-8);    //[1,2,3,4,5,6]

//当传入两个参数一正一负时,length也会先于负数相加后,再截取
var a=[1,2,3,4,5,6];
var b=a.slice(2,-3);    //[3]

//当传入一个参数,大于length时,将返回一个空数组
var a=[1,2,3,4,5,6];
var b=a.slice(6);  //[]


2.splice(数组)

用法:array.splice(start, deleteCount, item,…..,itemX)

解释:splice() 方法用于插入、删除或替换数组的元素。splice方法从array中移除一个或多个元素,如果你愿意的话可以用新的item替换它们。参数start是从数组array中移除元素的开始位置。参数deleteCount是要移除的元素的个数。
如果有额外的参数,那么 item,…..,itemX会插入到被移除元素的位置上。
splice()方法返回一个包含被移除元素的数组。

//从1位置索引开始,删除3个,增加一个
var fruits = ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango'];
var fruSp = fruits.splice(1, 3, 'Peach');
console.log(fruits); //['Banana', 'Peach', 'Mango']
console.log(fruSp); //返回:['Orange', 'Lemon', 'Apple']


3.split(字符串)

用法:string.split(separator, limit)

解释:split()方法用于把一个字符串分割成字符串数组。把这个string分割成片段来创建一个新的字符串数组,但不改变原始字符串。
separator参数可以是一个分隔符,它可以是字符串或一个正则表达式。如果separator是一个空字符(‘’),会返回一个单字符的数组。
limit(可选参数)可以限制被分割的片段数量。

var a = "0123456";
var b = a.split(""); 
console.log(a); // 0123456
console.log(b); // ['0', '1', '2', '3', '4', '5', '6']

var c = a.split("", 3); 
console.log(c); // ['0', '1', '2']

var phone = "010-88888888-188";
console.log(phone.split('-')); // ['010', '88888888', '188']

var str=”How are you doing today ?”;
console.log(str.split("")); //['How', 'are', 'you', 'doing', 'today', '?']

今天就到这吧,下一节我们讲解 “js相似方法比较系列(三)charAt,indexof,findIndex,lastindexof,includes,find的区别”,敬请期待~!

如果您觉得文章有用,请帮忙点个赞或关注,也为我鼓励一下,坚持写下去,在此感谢!

转载一定注明出处!
本文地址:https://www.jianshu.com/p/b81142790cc4
2020年2月14日 新冠状病毒期间憋在家

参考地址:
https://www.cnblogs.com/webjoker/p/5218114.html
https://blog.csdn.net/yw00yw/article/details/81063038

你可能感兴趣的:(js里相似的方法比较系列(二)slice,splice,split方法区别)