在 ECMAScript 2017 中，JavaScript 语言新增了一个有趣的方法 Array.prototype.copyWithin，它能够让我们轻松地复制数组元素。在这篇文章中，我们将详细地探究它的用法、学习以及指导意义，并提供有用的示例代码。
引言
在过去，很多开发者都为了复制一个数组而使用不同的技术。比如，循环遍历并逐一复制数组元素、使用原生 JavaScript 的 splice 方法以及对数组进行 slice 操作。然而，这些方法都有它们自己的限制，或者导致效率低下。
在 ECMAScript 2017 标准中，我们终于有了一个快速且易于使用的方法：Array.prototype.copyWithin。它能够在数组内覆盖现有元素并返回修改后的数组，而不改变它的长度。
用法
Array.prototype.copyWithin 的原型定义如下：
arr.copyWithin(target, start[, end])
这里的三个参数分别是：
- target：要覆盖的位置索引，必须。
- start：元素复制的起始位置索引，可选，默认值为 0（负数表示从数组末尾开始计数）。
- end：元素复制的结束位置索引（不包括），可选，默认值为数组长度（负数表示从数组末尾开始计数）。
在调用该函数之后，它会将数组元素复制到目标位置，覆盖现有元素。如果参数中省略了 start 或 end，它们的默认值将分别为 0 和 length，从而将整个数组复制到目标位置。
需要注意的是，我们使用该方法时需要确保 target 的值小于数组的长度，同时 end 的值不能大于数组的长度。
示例
接下来，我们来看一些例子，更好地了解这个方法的使用和效果。
复制一个数组的元素
我们可以使用简单的方法，快速地将整个数组的元素拷贝至目标位置。
const arr1 = [1, 2, 3, 4, 5]; arr1.copyWithin(2); // [1, 2, 1, 2, 3]
以上代码将从索引为 2 开始拷贝原数组中的元素，并覆盖索引 2 开始的位置。如果省略 end 参数，则默认为数组长度。
用部分元素替换另一部分
我们可以用一部分元素替换数组中另一部分元素，速度非常快。
const arr2 = [1, 2, 3, 4, 5]; arr2.copyWithin(0, 3); // [4, 5, 3, 4, 5]
以上代码将原数组中索引从 3 开始的元素复制到索引 0 的位置。
限定范围内复制数组元素
在一些情况下，我们需要在数组的特定位置内复制一些元素。在这里，我们可以使用 start 和 end 参数来限制范围。
const arr3 = [1, 2, 3, 4, 5]; arr3.copyWithin(2, 0, 2); // [1, 2, 1, 2, 5]
以上代码将元素从索引 0 开始复制到索引 2，截止到索引 2。
指导意义
使用 Array.prototype.copyWithin 有以下几个好处：
- 在处理大型数组时，它可以快速地复制元素。
- 不像slice，它不需要创建一个新的数组，在性能上更优越。
- 它为开发者提供了一个简单的、直观的方法来复制数组元素，不再需要编写大量循环或使用其他语言特定的方法。
结论
在这篇文章中，我们详细地探究了 ECMAScript 2017 的新功能：Array.prototype.copyWithin。我们介绍了这个方法的用法、学习以及指导意义，并提供了一些实用的示例代码。这个方法无疑会在 JavaScript 开发中广泛使用，并且会在未来的标准中得到更广泛的支持。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6747c9125883fc5ebfe25c01
