这是我参与11月更文挑战的第12天,活动详情查看:2021最后一次更文挑战
写在前面:
- 个人前端网站:zhangqiang.hk.cn
- 欢迎加入博主的前端学习qq交流群::706947563,专注前端开发,共同学习进步!
前期相关文章:
- js数组常用方法1 : juejin.cn/post/699370…
- js数组常用方法2 : juejin.cn/post/700000…
0 前言
英语不太好,splice(拼接)、slice(切)、split(分割)这几个方法总是记不熟,今天特地自己总结一下,这样以后过来翻自己的博客就行了,省的每次都要百度.. 然后再采用熟能生巧法来记下它们。
1 核心
-
slice:截取功能
- 截取数组为主,也可以截取字符串
- 返回新的数组,包含截取的元素
- 不改变原数组
-
splice():数组增删查改
- 只能对数组增删查改,字符串无效
- 返回新的数组,内容是被删除的元素
- 会改变原数组
-
split:字符串 => 数组
- 字符串的方法,不是数组的方法。
- 返回一个字符串数组。
2 实例详解
2.1 slice 数组截取
- 返回一个新的数组对象,且是浅拷贝的。
- 原数组不变。
const arr = ['a', 'b', 'c', 'd', 'e'];
console.log(arr.slice(2));
console.log(arr.slice(2, 4));
console.log(arr.slice(1, 5));
console.log(arr.slice(-2));
console.log(arr.slice(2, -1));
控制台输出为:
2.2 splice 数组增删改查
- 在给定位置删除任意个元素,并可选择插入任意个元素,以数组形式返回被删除的元素。
- 会改变原数组。
let arr1 = ['a', 'b', 'c', 'd', 'e'];
let arr2 = ['a', 'b', 'c', 'd', 'e'];
let arr3 = ['a', 'b', 'c', 'd', 'e'];
let arr4 = ['a', 'b', 'c', 'd', 'e'];
let arr5 = ['a', 'b', 'c', 'd', 'e'];
let arr6 = ['a', 'b', 'c', 'd', 'e'];
arr1.splice(1); // 在数组下标为1的位置开始,删除包括自身与其后面所有元素
arr2.splice(-2); // 删除最后两个元素。
arr3.splice(1, 3); //从数组下标为1的位置开始删除元素,一共删除三个元素
arr4.splice(1, 0, 'yoyo'); // 纯增加。在数组下标为1的位置插入一个'yoyo'字符串
arr5.splice(1, 0, 'シャブアシャブアシャブ', 'パクパクパクパク') // 纯增加。增加多个。
arr6.splice(-3, 2, 'Yeah');// 更改。 从最后数第三个位置开始,网游删除包括其自身2个元素,然后插入'Yeah'
console.log(arr1);
console.log(arr2);
console.log(arr3);
console.log(arr4);
console.log(arr5);
console.log(arr6);
控制台输出为:
2.3 split
split()
是字符串的方法,不是数组的方法。其意思为通过指定分隔符分割字符串返回一个数组。
const str = 'a$b$c$d';
console.log(str.split('$'));
控制台输出为:
参考链接:
developer.mozilla.org/zh-CN/docs/…
参考链接里面还有个深浅拷贝,这里可以参考:www.cnblogs.com/echolun/p/7…
😏 彩蛋
- 再分享一个好玩的东西
将鼠标悬停停止我主页的头像上面,有好玩的事情发生哦~