ES12 中的实例方法：Array.prototype.slice()（非突变数组）

在 JavaScript 开发中，数组是一种常见的数据结构，而对于数组的操作也是开发中必不可少的一部分。在 ES12 中，Array.prototype.slice() 方法被引入，它可以在不改变原数组的情况下返回一个新的数组，使得数组操作更加灵活和方便。

方法介绍

Array.prototype.slice() 方法可以接收两个参数，第一个参数表示要复制的起始位置，第二个参数表示要复制的结束位置（不包含结束位置）。如果没有传递参数，则会复制整个数组。该方法返回一个新的数组，不会改变原始数组。

const arr = [1, 2, 3, 4, 5];
const copyArr = arr.slice(1, 4);
console.log(copyArr); // [2, 3, 4]
console.log(arr); // [1, 2, 3, 4, 5]

需要注意的是，如果复制的起始位置或结束位置是负数，则表示从数组末尾开始计算，例如 -1 表示数组的最后一个元素。

const arr = [1, 2, 3, 4, 5];
const copyArr = arr.slice(-3, -1);
console.log(copyArr); // [3, 4]
console.log(arr); // [1, 2, 3, 4, 5]

应用场景

Array.prototype.slice() 方法在实际开发中非常常见，可以用于以下场景：

复制数组

该方法最基本的应用场景是复制数组，在不改变原数组的情况下生成一个新的数组。这在需要对数组进行操作时非常有用，可以避免因为操作不当而导致原数组被修改。

const arr = [1, 2, 3, 4, 5];
const copyArr = arr.slice();
console.log(copyArr); // [1, 2, 3, 4, 5]
console.log(arr); // [1, 2, 3, 4, 5]

截取数组

有时候需要对数组进行截取操作，例如只需要数组的前几个元素或者后几个元素。此时可以使用 Array.prototype.slice() 方法来截取数组。

const arr = [1, 2, 3, 4, 5];
const frontArr = arr.slice(0, 3);
const endArr = arr.slice(-3);
console.log(frontArr); // [1, 2, 3]
console.log(endArr); // [3, 4, 5]
console.log(arr); // [1, 2, 3, 4, 5]

数组拼接

有时候需要将两个数组拼接在一起，可以使用 Array.prototype.slice() 方法来实现。

const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
const newArr = arr1.slice().concat(arr2.slice());
console.log(newArr); // [1, 2, 3, 4, 5, 6]
console.log(arr1); // [1, 2, 3]
console.log(arr2); // [4, 5, 6]

总结

Array.prototype.slice() 方法是一个非常实用的数组方法，可以在不改变原数组的情况下生成一个新的数组。它的应用场景非常广泛，可以用于复制数组、截取数组和数组拼接等操作。在实际开发中，我们应该充分利用该方法来提高代码的可读性和可维护性。

来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/65bb480badd4f0e0ff3fabe9