javascript - 展开语法如何影响数组拼接

Question

我找到了下面的代码，不知道A和B有什么区别:

var fruits = ["Banana", "Orange", "Apple", "Mango"];

一个

fruits.splice(2,0,["Lemon", "Kiwi"]);

B

fruits.splice(...[2,0].concat(["Lemon", "Kiwi"]));

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var A = fruits.splice(2, 0, ["Lemon", "Kiwi"]);
var B = fruits.splice(...[2, 0].concat(["Lemon", "Kiwi"]));

console.log(A)
console.log(B)

Answer 1

首先，语句 A 和语句 B 会产生不同的结果。

在 语句 A 中，您在位置 2 插入一个数组 (["Lemon", "Kiwi"]) 作为数组元素，同时删除 0 个项目。因此，您要在位置 2 的另一个字符串数组中插入一个字符串数组。

var fruits = ["Banana", "Orange", "Apple", "Mango"];


fruits.splice(2,0,["Lemon", "Kiwi"]);

console.log(fruits);

但是，语句B更有趣。要完全理解它，首先要像这样注销它的核心部分:

console.log(...[2,0].concat(["Lemon", "Kiwi"]));  // basic array concatenation then spread

如您所见，它会生成 2 0 Lemon Kiwi。然后它作为参数传递给 fruits.splice(..here..)。根据array#splice它将在位置 2 处输入两个字符串 (Lemon & Kiwi)，同时删除 0 个元素。

var fruits = ["Banana", "Orange", "Apple", "Mango"];

fruits.splice(...[2,0].concat(["Lemon", "Kiwi"]));
// is same as fruits.splice(2, 0, 'Lemon', 'Kiwi')

console.log(fruits);

注意:

• array#splice 更新原始数组。
• 语句 A 在父级中插入一个数组 (IE ["Lemon", "Kiwi"])字符串数组，而 语句 B 在父字符串数组中插入两个字符串(IE 'Lemon', 'Kiwi')。