Array.prototype.toReversed() 是 ES2023 引入的非破坏性数组反转方法，它基于原数组创建一个浅拷贝并返回反转后的新数组，具备更清晰的语义和更优的性能表现，兼容现代浏览器及 Node.js 20.2 及以上版本。
在 JavaScript 开发中，数组反转是一个高频操作。以往，开发者习惯使用 array.slice().reverse() 来避免修改原数组。如今，ES2023 提供了更优雅的原生解决方案：Array.prototype.toReversed()。该方法专为“非破坏性反转”设计，直接返回一个顺序反转的全新数组，而原数组保持不变。
基本用法：一行完成克隆 + 反转
其用法极为简洁，直接调用即可实现：
const original = [1, 2, 3, 4]; const reversed = original.toReversed(); // [4, 3, 2, 1] console.log(original); // [1, 2, 3, 4] ← 原数组未变 console.log(reversed); // [4, 3, 2, 1] ← 全新数组
与传统方式对比：为什么推荐 toReversed()
那么，相比传统做法，toReversed() 的优势究竟体现在何处？
- 语义更清晰：
toReversed()的命名意图一目了然——“获取反转后的版本”。而slice().reverse()则表述为“先切片再反转”，增加了一层不必要的操作描述。 - 更强的不可变性保障：这能有效避免开发者误用破坏性的
reverse()方法，从而意外修改原始数据，显著降低了潜在的 Bug 风险。 - 性能略优：主流 JavaScript 引擎（如 V8）已对其进行了内部优化，执行效率通常优于链式调用的
slice().reverse()。 - 兼容性须知：使用前需确认运行环境兼容性，它要求较新的浏览器（Chrome 112+、Firefox 117+、Safari 17.4+）或 Node.js 20.2 及以上版本。对于旧环境，需要准备相应的回退方案。
实际使用建议
了解了这些优势，在实际项目中可以这样加以运用：
- UI 列表渲染：当需要倒序展示消息、日志等列表，同时必须保留后台原始数据顺序时，可直接使用
const uiList = data.toReversed()将结果传给前端组件，简洁高效。 - 链式调用：该方法能无缝嵌入方法链中，使代码更流畅，例如：
items.filter(x => x.active).toReversed().map(renderItem)。 - 注意“浅拷贝”本质：该方法创建的是新数组，但数组内的对象元素依然是引用共享。若需对对象本身进行克隆，则需额外进行深拷贝处理。
- 不直接支持类数组对象：对于
arguments、NodeList等类数组结构，需要先用Array.from()或扩展运算符将其转为真正的数组，然后再调用该方法。
兼容性兜底写法（按需选用）
如果需要兼容尚未支持此方法的老旧环境，封装一个安全的工具函数是稳妥的做法：
function safeToReversed(arr) {
return Array.isArray(arr) && typeof arr.toReversed === 'function'
? arr.toReversed()
: [...arr].reverse();
}
该函数会先检测环境是否支持原生方法，若支持则优先使用，否则回退到利用扩展运算符配合 reverse() 的兼容方案，确保功能在所有环境下均能正常执行。
