JavaScript中一行与两行调用array splice()结果为何不同？

代码示例 #

代码1： #

let targetArr = ["hello", "world", "my", "name"];
let errnewArr = Array.from(targetArr).splice(2, 1);
console.log("errnewArr array : " + errnewArr.length);

代码2： #

targetArr = ["hello", "world", "my", "name"];
let newArr = Array.from(targetArr);
newArr.splice(2, 1);
console.log("new array : " + newArr.length);

两段代码逻辑相似，仅splice方法的调用形式不同：一段采用Array.from()链式调用splice，另一段先将Array.from()结果赋值给变量再调用splice。但结果差异显著：errnewArr长度为1，newArr长度为3。请问为何会出现该差异？

原因解析 #

核心差异在于**splice方法的返回值特性**：

• splice是直接修改原数组的方法，它的返回值是被删除元素组成的数组，而非修改后的原数组本身。

代码1的执行逻辑 #

Array.from(targetArr).splice(2, 1) 中，Array.from先创建原数组的副本，紧接着调用splice(2,1)——该操作删除副本中索引2的1个元素（即"my"），然后将被删除元素组成的数组（["my"]）赋值给errnewArr，因此errnewArr.length为1。而被修改后的副本数组因未被变量保存，直接被垃圾回收。

代码2的执行逻辑 #

先将Array.from创建的副本赋值给newArr，再调用newArr.splice(2,1)——此时splice直接修改了newArr本身（数组长度从4变为3），而splice返回的被删除元素数组未被接收。最后打印的是修改后newArr的长度，自然为3。

总结：

• 代码1：变量存储的是splice的返回值（被删元素数组）
• 代码2：变量存储的是原数组副本，splice修改了该副本，打印的是修改后数组的长度

内容的提问来源于stack exchange，提问作者DNB5brims