js【详解】arr.splice() 数组拼接

简介: js【详解】arr.splice() 数组拼接

arr.splice() 的含义

splice的中文释义为“拼接”,arr.splice() 即剪切掉数组中一个连续的片段后,再拼接上一个新片段。

arr.splice() 的语法

let newArr = arr.splice(起始索引index, 删除的个数, 新增元素1, 新增元素2...)   // 返回被删除元素组成的新数组

会改变原数组

第三个及之后的参数表示:向原数组中添加新的元素,这些元素将会自动插入到开始位置索引的前面。

若未指定删除的个数,则从起始索引index到数组最后一个元素全部删除

arr.splice() 的使用

// 范例1 —— 从第index为1的位置开始,删除之后的所有元素
let arr1 = ["a", "b", "c", "d", "e", "f"];
let result1 = arr1.splice(1); 
 
arr1:["a"]
result1:["b","c","d","e","f"]
//范例2 —— 删除最后两个元素
let arr = ["a", "b", "c", "d", "e", "f"];
let result = arr.splice(-2); 
 
arr:["a","b","c","d"]
result:["e","f"]
//范例3 —— 从index为1的元素开始,一共删除三个元素
let arr = ["a", "b", "c", "d", "e", "f"];
let result = arr.splice(1, 3); 
 
arr:["a","e","f"]
result:["b","c","d"]
//范例4 —— 从index为1的元素开始,一共删除三个元素,并且在 index=1 的前面追加两个元素
let arr = ["a", "b", "c", "d", "e", "f"];
let result = arr.splice(1, 3, "新增元素1", "新增元素2");
 
arr:["a","新增元素1","新增元素2","e","f"]
result:["b","c","d"]
//范例5 —— E6语法实现数组合并-将arr2合并到arr1
let arr1 = ["a", "b", "c"];
let arr2 = ["1", "2", "3"];
 
arr1.splice(0, 0, ...arr2);
 
arr1: [ '1', '2', '3', 'a', 'b', 'c' ]


目录
相关文章
|
12月前
|
JavaScript 前端开发
JS几种拼接字符串的方法
JS几种拼接字符串的方法
183 1
|
7月前
|
JavaScript 前端开发 API
JavaScript中通过array.map()实现数据转换、创建派生数组、异步数据流处理、复杂API请求、DOM操作、搜索和过滤等,array.map()的使用详解(附实际应用代码)
array.map()可以用来数据转换、创建派生数组、应用函数、链式调用、异步数据流处理、复杂API请求梳理、提供DOM操作、用来搜索和过滤等,比for好用太多了,主要是写法简单,并且非常直观,并且能提升代码的可读性,也就提升了Long Term代码的可维护性。 只有锻炼思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一下,还可以收藏起来以备不时之需,有疑问和错误欢迎在评论区指出~
|
7月前
|
数据采集 JavaScript 前端开发
JavaScript中通过array.filter()实现数组的数据筛选、数据清洗和链式调用,JS中数组过滤器的使用详解(附实际应用代码)
用array.filter()来实现数据筛选、数据清洗和链式调用,相对于for循环更加清晰,语义化强,能显著提升代码的可读性和可维护性。博客不应该只有代码和解决方案,重点应该在于给出解决方案的同时分享思维模式,只有思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一下,还可以收藏起来以备不时之需,有疑问和错误欢迎在评论区指出~
|
12月前
|
自然语言处理 前端开发 JavaScript
🛠️ JavaScript数组操作指南:20个精通必备技巧🚀
本文详细介绍了 JavaScript 中的 20 个高效数组操作技巧,涵盖了从基本的添加、移除元素,到数组转换和去重等高级操作。强调了不可变性的重要性,提供了清晰的代码示例,帮助开发者编写更整洁和高效的代码。无论是新手还是经验丰富的开发者,这些技巧都将显著提升您的编码能力,使您在项目中更具竞争力。
187 2
|
12月前
|
JavaScript 前端开发 测试技术
JS都有哪些操作数组的方法
JS都有哪些操作数组的方法
337 3
|
12月前
|
JavaScript
js删除数组中已知下标的元素
js删除数组中已知下标的元素
277 4
|
12月前
|
JavaScript 前端开发 Java
【javaScript数组,函数】的基础知识点
【javaScript数组,函数】的基础知识点
103 5
|
12月前
|
缓存 JavaScript 前端开发
JavaScript中数组、对象等循环遍历的常用方法介绍(二)
JavaScript中数组、对象等循环遍历的常用方法介绍(二)
157 1
|
12月前
|
JavaScript 前端开发 索引
探索JavaScript数组:基础
探索JavaScript数组:基础
81 3
|
12月前
|
JavaScript 前端开发 索引
JS 删除数组元素( 5种方法 )
JS 删除数组元素( 5种方法 )
580 1