当前位置: 首页 > news >正文

JavaScript中.splice()的用法

JavaScript Array splice() 方法详解

Array.prototype.splice() 是 JavaScript 数组的核心方法,用于在指定位置添加/删除元素,并返回被删除的元素,同时直接修改原数组。其语法为:

array.splice(startIndex, deleteCount, item1, item2, ...)
参数说明:
  • startIndex:操作起始位置(索引从 0 开始)
  • deleteCount:要删除的元素数量(若为 0 则不删除)
  • item1, item2...:要添加的新元素(可选)

使用示例

1. 删除元素
let fruits = ['🍎', '🍌', '🍇', '🍊'];
let removed = fruits.splice(1, 2);  // 从索引1开始删除2个元素console.log(fruits);  // 输出: ['🍎', '🍊'] (原数组被修改)
console.log(removed); // 输出: ['🍌', '🍇'] (返回被删除元素)
2. 添加元素
let colors = ['red', 'green', 'blue'];
colors.splice(1, 0, 'yellow', 'purple'); // 在索引1处添加元素console.log(colors); 
// 输出: ['red', 'yellow', 'purple', 'green', 'blue']
3. 替换元素
let numbers = [10, 20, 30, 40];
let replaced = numbers.splice(2, 1, 99); // 将索引2的元素替换为99console.log(numbers);  // 输出: [10, 20, 99, 40]
console.log(replaced); // 输出: [30] (被替换的元素)
4. 删除末尾元素
let arr = [1, 2, 3, 4, 5];
arr.splice(-2, 1); // 倒数第2位开始删除1个元素console.log(arr); // 输出: [1, 2, 3, 5]

关键特性

  1. 修改原数组:与 slice() 不同,splice() 直接改变原数组
  2. 负索引支持startIndex 可为负数(从末尾倒数)
  3. 返回被删除元素:始终返回数组(无删除时返回空数组)
  4. 高效操作:适合需要同时添加/删除的场景

⚠️ 注意:当 deleteCount 大于剩余元素数时,会删除从起始位置到末尾的所有元素。


与 slice() 对比

方法修改原数组返回内容主要用途
splice()被删除的元素添加/删除元素
slice()新数组(子数组)提取子数组
// 示例对比
let a = [1,2,3];
a.splice(0,1);    // 返回 [1], a变为[2,3]
let b = [1,2,3];
b.slice(0,1);     // 返回 [1], b仍为[1,2,3]
http://www.lryc.cn/news/600415.html

相关文章:

  • 从压缩到加水印,如何实现一站式图片处理
  • 动态SQL标签
  • 【动态规划-斐波那契数列模型】理解动态规划:斐波那契数列的递推模型
  • 【深度之眼机器学习笔记】04-01-决策树简介、熵,04-02-条件熵及计算举例,04-03-信息增益、ID3算法
  • 深分页性能问题分析与优化实践
  • [硬件电路-94]:模拟器件 - 信号耦合,让被放大信号与静态工作点的直流偏置信号完美的融合
  • 算子推理是什么
  • Linux进程:系统运行的核心机制
  • 网安-中间件-Redis未授权访问漏洞
  • Datawhale AI 夏令营—科大讯飞AI大赛(大模型技术)—让大模型理解表格数据(列车信息表)
  • 中文语音识别与偏误检测系统开发
  • Spring boot Grafana优秀的监控模板
  • 【自动化运维神器Ansible】Ansible常用模块之File模块详解
  • flutter环境安装
  • 单片机中的三极管
  • Flutter开发实战之Widget体系与布局原理
  • 力扣 hot100 Day56
  • LeetCode 刷题【15. 三数之和】
  • 新手向:Git下载全攻略
  • 统计与大数据分析与数学金融课程解析
  • C++查询mysql数据
  • RabbitMQ--Springboot解决消息丢失
  • JavaWeb01——基础标签及样式(黑马视频笔记)
  • Android WorkManager 详解:高效管理后台任务
  • InstructBLIP:通过指令微调迈向通用视觉-语言模型
  • Android Data Binding 深度解析与实践指南
  • 像素、视野、光源,都有哪些因素影响测量精度?
  • 数据中心-时序数据库InfluxDB
  • 【影刀RPA_初级课程_我的第一个机器人】
  • jxORM--查询数据