一 splice
1. 概述
splice 是 JavaScript 数组对象的一个方法，用于改变原数组的内容。它可以添加、删除或替换数组中的元素。
2. 语法
array.splice(start, deleteCount, item1, item2, ...)
-
start: 需要改变的数组的起始索引。如果是负数，则表示从数组末尾开始计数。
-
deleteCount: 要删除的元素的数量。如果设置为 0，则不会删除任何元素。
-
item1, item2, …: 可选参数，表示要添加到数组中的新元素。可以添加多个元素。
3 返回值
splice 方法返回一个包含被删除元素的数组。如果没有删除元素，则返回一个空数组。
4 示例
4.1 删除元素
let fruits = ['apple', 'banana', 'cherry', 'date'];
// 从索引 1 开始，删除 2 个元素
let removed = fruits.splice(1, 2);
console.log(fruits); // 输出: ['apple', 'date']
console.log(removed); // 输出: ['banana', 'cherry']
在这个例子中，从 fruits 数组中删除了 banana 和 cherry，并返回了删除的元素。
4.2 添加元素
let colors = ['red', 'green', 'blue'];
// 从索引 1 开始，不删除任何元素，添加 'yellow' 和 'purple'
colors.splice(1, 0, 'yellow', 'purple');
console.log(colors); // 输出: ['red', 'yellow', 'purple', 'green', 'blue']
此示例显示如何在数组中插入元素，而不删除任何现有元素。
4.3 替换元素
let numbers = [1, 2, 3, 4, 5];
// 从索引 2 开始，删除 1 个元素，并添加 6
numbers.splice(2, 1, 6);
console.log(numbers); // 输出: [1, 2, 6, 4, 5]
在这个例子中，3 被 6 替换。
4.4 删除所有元素
let array = [1, 2, 3, 4, 5];
// 从索引 0 开始，删除所有元素
array.splice(0, array.length);
console.log(array); // 输出: []
通过将 deleteCount 设置为数组长度，可以清空数组。
4.5 使用负索引
let items = ['a', 'b', 'c', 'd', 'e'];
// 从倒数第二个元素开始，删除 2 个元素
let removedItems = items.splice(-2, 2);
console.log(items); // 输出: ['a', 'b', 'c']
console.log(removedItems); // 输出: ['d', 'e']
使用负索引可以从数组的末尾开始进行操作。
5. 注意事项
- 直接修改原数组: splice 方法不仅返回删除的元素，还会直接修改调用它的原数组，因此在使用时需谨慎。
- 负索引: 可以使用负数作为 start 参数，以从数组末尾开始计数。
- 无返回值: 如果没有删除元素，返回的是一个空数组。对于添加元素，返回值也仅与删除的元素相关。
- 性能考虑: 对于频繁的插入和删除操作，可以考虑其他数据结构（如链表），因为 splice 在大数组中可能会导致性能问题。
- 链式调用:由于 splice 修改原数组，之后的操作可能会受到影响。因此，在连续调用时需特别小心。
二 slice
1. 概述
slice 是 JavaScript 数组对象的一个方法，用于返回数组的一个片段（浅拷贝）。，包含从开始索引到结束索引（不包括结束索引）之间的元素。
2. 语法
array.slice(start, end)
- start: (可选) 开始提取的索引，默认为 0。如果是负数，则表示从数组末尾开始计数。
- end: (可选) 截止提取的索引，默认为数组长度。如果是负数，则表示从数组末尾开始
计数。
3. 返回值
slice 方法返回一个新数组，包含从 start 到 end 之间的元素（不包括 end 索引的元素）。原数组不会被改变。
4. 示例
4.1 基本用法
let fruits = ['apple', 'banana', 'cherry', 'date'];
// 从索引 1 提取到索引 3
let selectedFruits = fruits.slice(1, 3);
console.log(selectedFruits); // 输出: ['banana', 'cherry']
console.log(fruits); // 输出: ['apple', 'banana', 'cherry', 'date'] (原数组未被修改)
4.2 使用负索引
let colors = ['red', 'green', 'blue', 'yellow'];
// 从倒数第二个元素提取到最后一个元素
let selectedColors = colors.slice(-2);
console.log(selectedColors); // 输出: ['blue', 'yellow']
4.3 提取部分数组
let numbers = [1, 2, 3, 4, 5];
// 提取前 3 个元素
let partNumbers = numbers.slice(0, 3);
console.log(partNumbers); // 输出: [1, 2, 3]
4.4 提取整个数组
let animals = ['cat', 'dog', 'fish'];
// 提取整个数组
let allAnimals = animals.slice();
console.log(allAnimals); // 输出: ['cat', 'dog', 'fish']
5. 注意事项
- 返回新数组: slice 不会修改原数组，而是返回一个新数组。对于不想改变原数组的情况非常有用。
- 负索引: 可以使用负数作为 start 或 end 参数，以从数组的末尾进行提取。
- 浅拷贝: slice 方法返回的是一个浅拷贝。对于嵌套数组或对象，如果原数组中的元素是引用类型，那么新数组中的元素仍然指向相同的引用。