splice 是「做事的方法」(修改数组),不是「返回结果的方法」,先做事,再返回结果
你怀疑 return splice(...) 的写法有问题,这个判断非常准确——绝大多数场景下直接 return 数组的 splice 方法返回值,都是不符合业务预期的错误写法,核心问题出在 splice 方法的返回值特性和开发者的常见认知偏差上,下面分核心问题、正确写法、特殊注意点三部分讲清楚:
一、核心问题:splice 的返回值不是你想的那样
JavaScript 中数组的 splice(start[, deleteCount[, item1[, item2[, ...]]]]) 方法,核心作用是「修改原数组」(删除/插入/替换元素),而它的返回值是「被从原数组中删除的元素组成的新数组」(如果没有删除任何元素,返回空数组 [])。
开发者的常见误区是:误以为 splice 会返回「修改后的原数组」,因此直接 return splice(...),最终得到的不是修改后的数组,而是被删掉的元素(或空数组),完全偏离业务需求。
二、正确写法:先执行 splice 修改原数组,再 return 原数组
因为 splice 是直接修改原数组的(原地修改,无新数组创建),所以正确逻辑是:先调用 splice 完成数组的增/删/改,再单独 return 原数组,示例如下:
示例1:删除数组元素后返回修改后的数组(错误 vs 正确)
// 错误写法:return splice 返回的是「被删除的元素数组」
function wrongHandleArr(arr) {
return arr.splice(1, 2); // 从索引1开始,删除2个元素
}
// 正确写法:先splice修改原数组,再return原数组
function rightHandleArr(arr) {
arr.splice(1, 2); // 第一步:修改原数组(原地删除)
return arr; // 第二步:返回修改后的原数组
}
// 测试
const originalArr = [1,2,3,4,5];
console.log(wrongHandleArr(originalArr)); // 输出 [2,3](被删除的元素),不是修改后的数组
console.log(rightHandleArr(originalArr)); // 输出 [1,4,5](修改后的原数组),符合预期
示例2:插入元素后返回修改后的数组
function insertAndReturn(arr) {
arr.splice(2, 0, 6, 7); // 从索引2开始,删除0个元素,插入6、7
return arr; // 返回修改后的原数组
}
const arr = [1,2,3,4];
console.log(insertAndReturn(arr)); // 输出 [1,2,6,7,3,4],符合预期
三、特殊注意点:无删除操作时,splice 返回空数组
如果调用 splice 时仅做「插入元素」操作(deleteCount = 0),此时没有任何元素被删除,splice 会直接返回空数组 [],这是最容易踩坑的场景:
function wrongInsert(arr) {
return arr.splice(1, 0, 'a'); // 仅插入,无删除
}
console.log(wrongInsert([1,2,3])); // 输出 [],完全不符合「返回修改后数组」的预期
总结
-
核心错误:
splice返回被删除的元素数组(无删除则返回 []),而非修改后的原数组,直接 return 会偏离需求; -
核心特性:
splice是原地修改原数组的方法,不会创建新数组; -
正确范式:先执行 arr.splice(...) 完成修改,再单独 return arr;
-
避坑重点:仅插入元素时,
return splice(...)会直接返回空数组,务必避免。
简单说:splice 是「做事的方法」(修改数组),不是「返回结果的方法」,先做事,再返回结果。
更多推荐

所有评论(0)