splice()方法和slice()方法的区别

213 阅读3分钟

1. splice()方法

splice()方法可以用于删除、插入和替换数组的元素。它接受两个参数,第一个参数是要操作的起始索引,第二个参数是要删除的元素个数。可以通过传递第三个及之后的参数来插入新的元素。splice()方法会修改原始数组。它的语法如下:

array.splice(start, deleteCount, item1, item2, ...)
  • start参数表示插入、删除或替换的起始位置。
  • deleteCount参数表示要删除的元素个数。
  • item1, item2, ...参数表示要插入的元素(可选)。

让我们看几个具体的例子来理解splice()方法的用法。

插入元素
let fruits = ['apple', 'banana', 'orange'];
fruits.splice(1, 0, 'pear'); // 在索引为1的位置插入'pear'

在上面的示例中,我们在数组fruits的索引为1的位置插入了字符串’pear’。插入后,数组变为['apple', 'pear', 'banana', 'orange']

删除元素
let numbers = [1, 2, 3, 4, 5];
numbers.splice(2, 1); // 删除索引为2的元素

在上面的示例中,我们使用splice()方法删除了数组numbers中索引为2的元素。删除后,数组变为[1, 2, 4, 5]

替换元素
let colors = ['red', 'green', 'blue'];
colors.splice(1, 1, 'yellow'); // 替换索引为1的元素为'yellow'

在上面的示例中,我们使用splice()方法替换了数组colors中索引为1的元素为’yellow’。替换后,数组变为['red', 'yellow', 'blue']

splice更多示例
let arr = [1, 2, 3, 4, 5];
arr.splice(2, 2); // 删除从索引2开始的2个元素
console.log(arr); // 输出: [1, 2, 5]

arr.splice(1, 0, 'a', 'b'); // 在索引1处插入两个元素
console.log(arr); // 输出: [1, 'a', 'b', 2, 5]

arr.splice(3, 1, 'x', 'y'); // 替换索引3处的元素
console.log(arr); // 输出: [1, 'a', 'b', 'x', 'y', 5]

2. slice()方法

slice()方法用于创建一个新的数组,包含原始数组中的一部分元素。它接受两个参数,第一个参数是要复制的起始索引(包括该索引),第二个参数是要复制的结束索引(不包括该索引)。如果只传递一个参数,则从该索引开始复制到数组的末尾。slice()方法不会修改原始数组。它的语法如下:

array.slice(start, end)
  • start参数表示开始提取的位置(包括该位置的元素),可以是一个负数,表示从数组末尾开始计算。
  • end参数表示结束提取的位置(不包括该位置的元素),可以是一个负数,表示从数组末尾开始计算。

让我们看几个具体的例子来理解slice()方法的用法。

提取子数组
let numbers = [1, 2, 3, 4, 5];
let subArray = numbers.slice(1, 4); // 提取从索引1到索引4(不包括4)的元素

在上面的示例中,我们使用slice()方法从数组numbers中提取了索引1到索引4(不包括4)的元素。提取后,生成了一个新的子数组[2, 3, 4]

复制数组
let originalArray = [1, 2, 3];
let copiedArray = originalArray.slice(); // 复制原数组

在上面的示例中,我们使用slice()方法复制了数组originalArray,生成了一个具有相同元素的新数组[1, 2, 3]

slice更多示例
let arr = [1, 2, 3, 4, 5];
let newArr = arr.slice(1, 4); // 复制索引1到3的元素
console.log(newArr); // 输出: [2, 3, 4]

let newArr2 = arr.slice(2); // 复制索引2到末尾的元素
console.log(newArr2); // 输出: [3, 4, 5]

结论

splice()和slice()方法都是JavaScript数组的方法。

  • splice()方法用于删除、插入和替换数组的元素,它会修改原始数组。
  • splice() 返回删除后的
  • slice()方法用于创建一个新的数组,包含原始数组的一部分元素,它不会修改原始数组。
  • slice() 方法从一个字符串中提取文本并返回一个新的字符串。对它们中的一个的文本进行的更改不会影响另一个字符串。