js 数组splice跟slice

在 JavaScript 中,splice 和 slice 是数组(Array)对象的方法,用于处理数组,但它们的功能和用途有很大的不同。
1. splice

splice 方法用于 修改数组,可以添加、删除或替换数组中的元素。

语法

array.splice(start, deleteCount, item1, item2, ...)

  • start: 必需。表示从数组的哪个索引开始修改。
  • deleteCount: 可选。表示要删除的元素数量。如果为 0,则不删除元素。
  • item1, item2, ...: 可选。要添加到数组的新元素。
    返回值
    splice 返回一个包含被删除元素的数组。如果没有删除任何元素,则返回一个空数组。
    示例
bash 复制代码
let fruits = ['Apple', 'Banana', 'Cherry', 'Date'];
 // 删除元素 
 let removed = fruits.splice(1, 2); 
 // 从索引 1 开始删除 2 个元素 
 console.log(fruits);
  // ['Apple', 'Date']
   console.log(removed); 
   // ['Banana', 'Cherry'] 
   // 添加元素 
   fruits.splice(1, 0, 'Blueberry', 'Coconut'); 
   // 在索引 1 处添加两个新元素 
   console.log(fruits); 
   // ['Apple', 'Blueberry', 'Coconut', 'Date'] 
   // 替换元素 
   fruits.splice(1, 1, 'Avocado'); 
   // 从索引 1 替换 1 个元素 
   console.log(fruits); 
   // ['Apple', 'Avocado', 'Coconut', 'Date']

2. slice

slice 方法用于 提取数组的片段,而不修改原始数组。它返回一个新数组,包含从原数组中提取的元素。

语法

array.slice(start, end)

  • start: 可选。表示提取的开始索引。如果省略,默认为 0。
  • end: 可选。表示提取的结束索引(不包括该索引处的元素)。如果省略,默认为数组的长度。
    返回值
    slice 返回一个新的数组,包含从原数组中提取的元素。
    示例
bash 复制代码
let fruits = ['Apple', 'Banana', 'Cherry', 'Date'];
 // 提取片段
  let citrus = fruits.slice(1, 3); 
  // 从索引 1 提取到索引 3(不包含 3) 
  console.log(citrus); 
  // ['Banana', 'Cherry'] 
  console.log(fruits); 
  // 原数组仍然是 ['Apple', 'Banana', 'Cherry', 'Date'] 
  // 使用负索引 
  let lastFruits = fruits.slice(-2); 
  // 从倒数第二个元素开始提取 console.log(lastFruits); 
  // ['Cherry', 'Date']

总结

  • splice:用于修改原数组(添加、删除或替换元素),返回被删除的元素。
  • slice:用于提取数组的片段,返回一个新的数组,不会修改原数组。
相关推荐
晴天的雨.9924 小时前
【C++算法】和为s的两个数
开发语言·数据结构·c++·算法
开开心心就好7 小时前
批量提取PDF中的图片,直接导出原图
前端·javascript·支持向量机·智能手机·pdf·html·启发式算法
IvanCodes9 小时前
Python 数据处理(十三):JSON、CSV 与数据序列化
开发语言·python
Setsuna_F_Seiei9 小时前
前端转型 Agent 开发 05 之 Agent Hooks 与 Checkpointer(让 Agent 从全自动转变人为可掌控)
前端·agent·ai编程
aramae10 小时前
MySQL复合查询(8)
java·c语言·开发语言·后端·算法
百万蹄蹄向前冲11 小时前
风扇转了一晚上MVP专家团翻车事故
前端·人工智能
默_笙11 小时前
🏛 给 AI 配一间办公室:Harness Engineering 六大模块与它的实现
前端·javascript
linux_cfan13 小时前
videojs v10 源代码系列解读:14 · 谓词守卫:在运行时安全地调用能力
前端·javascript·音视频
qq_25183645713 小时前
springboot vue3 开发实现 拼豆管理系统
java·开发语言·ai编程
kyriewen13 小时前
我扒了 10,221 条 JD:腾讯技术岗 75% 在要 AI
前端·人工智能·ai编程