Array.prototype.toReversed()是ES2023新增的不可变反转方法，返回新数组且不修改原数组，语义更清晰、性能更优，适用于函数式编程和React等场景。

Array.prototype.toReversed() 是 ES2023 引入的原生方法，专为“不修改原数组、返回新反转数组”而设计，是 slice().reverse() 的语义更清晰、性能更优的替代方案。

为什么用 toReversed() 而不是 reverse()？

reverse() 是破坏性方法——它直接修改原数组并返回该数组引用；而 toReversed() 总是返回一个**全新数组**，原数组保持完全不变。这对函数式编程、React 状态更新、不可变数据流等场景至关重要。

• ✅ 安全：无需担心副作用或意外污染原始数据
• ✅ 明确：方法名直述意图，“to + 过去分词”表示“转为…的新副本”（类似 toSorted()、toSpliced()）
• ✅ 高效：V8 等引擎对其做了专门优化，比 [...arr].reverse() 或 arr.slice().reverse() 更快且内存友好

基础用法与兼容性注意

调用方式极其简单：

const original = [1, 2, 3, 4];
const reversed = original.toReversed(); // [4, 3, 2, 1]
console.log(original); // [1, 2, 3, 4] —— 未改变

⚠️ 注意：目前（2026年5月）该方法已在 Chrome 117+、Firefox 119+、Safari 17.4+、Edge 117+ 原生支持；若需兼容旧环境，可使用 core-js 提供 polyfill：

import 'core-js/actual/array/to-reversed';
// 或全局引入
// import 'core-js/stable/array/to-reversed';

结合其他不可变操作链式使用

toReversed() 天然适合与其他 ES2023 不可变数组方法组合，形成清晰的数据处理流水线：

const nums = [5, 1, 9, 3, 7];
<p>// 先升序排列，再反转 → 得到降序，全程无副作用
const descending = nums.toSorted((a, b) => a - b).toReversed();
// [9, 7, 5, 3, 1]</p><p>// 过滤偶数后反转
const oddsReversed = nums.filter(n => n % 2 !== 0).toReversed();
// [7, 3, 9, 1]

这种写法避免了中间变量和临时数组拷贝，语义连贯，逻辑自解释。

与常见克隆方式对比（性能与语义）

以下三种方式都实现“反转克隆”，但语义与效率不同：

• arr.toReversed()：语义精准、引擎优化、推荐首选
• [...arr].reverse()：创建展开新数组再反转，多一次遍历，可读性稍弱
• arr.slice().reverse()：历史常用写法，但 slice() 语义是“截取”，非“克隆”，易造成理解偏差

在现代项目中，只要目标环境支持，应优先使用 toReversed() 替代上述两者。