深入JS的splice()函数

JavaScript中的splice()函数是一种非常强大和有用的函数。它能够在数组中增加、删除、替换元素。splice()函数修改并返回原数组，可以处理多个元素。

一、 splice()函数的用法

splice()函数被广泛应用于JavaScript的开发之中，是一个非常有用的函数。它的主要作用是在数组中插入、删除或替换元素。 1、用splice()函数删除数组元素：


const fruits = ['banana', 'apple', 'orange', 'melon'];
fruits.splice(1,1);
console.log(fruits);

输出：['banana', 'orange', 'melon'] 2、用splice()函数替换数组元素：


const fruits = ['banana', 'apple', 'orange', 'melon'];
fruits.splice(1,2,'pear','peach');
console.log(fruits);

输出：['banana', 'pear', 'peach', 'melon'] 3、用splice()函数插入数组元素：


const fruits = ['banana', 'apple', 'orange', 'melon'];
fruits.splice(2,0,'pear','peach');
console.log(fruits);

输出：['banana', 'apple', 'pear', 'peach', 'orange', 'melon']

二、splice()函数的参数

splice()函数的参数有3个，第一个参数表示需要修改的起始元素的下标，第二个参数表示需要删除的元素数量，第三个参数表示需要添加的元素。如果不想删除任何元素，那就将第二个参数设置为0。如果想删除最后N个元素，可以将第一个参数设置为数组长度-N。如果要插入多个元素，可以在第三个参数中传递多个参数。

三、splice()函数的返回值

splice()函数会返回被删除的元素数组，如果没有删除元素，则返回一个空数组。 1、返回被删除的元素：


const fruits = ['banana', 'apple', 'orange', 'melon'];
const removedFruits = fruits.splice(1,2);
console.log(fruits);
console.log(removedFruits);

输出：['banana', 'melon'] ['apple', 'orange'] 2、没有删除元素时返回空数组：


const fruits = ['banana', 'apple', 'orange', 'melon'];
const removedFruits = fruits.splice(1,0,'pear','peach');
console.log(fruits);
console.log(removedFruits);

输出：['banana', 'pear', 'peach', 'apple', 'orange', 'melon'] []

四、splice()函数的注意事项

1、splice()函数会修改原数组，但它也可以通过复制原数组来避免修改原数组。 2、splice()函数不仅能够修改数组的内容，而且可以返回被删掉的元素。 3、splice()函数也可以用来增加、删除字符串中的字符，但是此时需要用split()和join()函数把字符串转换成数组和反向转换。 4、splice()函数的操作时间比较长，当数组较大时性能开销比较大，需要考虑使用其他性能更好的替代函数。