如何获取元素顺序反转的ReadonlyArray<T>新实例？

嗨，我来给你讲个最简单的解决办法！首先得明确：ReadonlyArray之所以没有reverse()方法，就是因为这个方法会直接修改原数组，违背了“只读”的设计初衷。那要得到反转后的只读数组，核心思路就是先创建原数组的拷贝，在拷贝上执行反转，最后得到的结果自然可以赋值给ReadonlyArray类型。

最简的实现方式有两种，都很直观：

方法一：使用扩展运算符创建拷贝 #

const scoresInAscendingOrder: ReadonlyArray<number> = [1, 2, 3, 5, 9];
const scoresInDescendingOrder: ReadonlyArray<number> = [...scoresInAscendingOrder].reverse();

扩展运算符...会把原只读数组的元素全部提取出来，生成一个新的普通数组，然后我们在这个新数组上调用reverse()（此时修改的只是拷贝后的数组，原数组完全不受影响）。最后TypeScript会自动识别反转后的数组可以赋值给ReadonlyArray类型，因为普通数组是ReadonlyArray的子类型。

方法二：使用Array.from()创建拷贝 #

如果你觉得扩展运算符不够直观，也可以用Array.from()来实现：

const scoresInAscendingOrder: ReadonlyArray<number> = [1, 2, 3, 5, 9];
const scoresInDescendingOrder: ReadonlyArray<number> = Array.from(scoresInAscendingOrder).reverse();

Array.from()同样会基于原只读数组创建一个新的普通数组，后续的反转操作和上面完全一致。

补充说明 #

这两种方式都是浅拷贝，如果你的数组里存储的是引用类型（比如对象、数组），反转后的数组元素和原数组元素会指向同一个引用。如果你的场景不需要深拷贝，这完全没问题；如果需要深拷贝的话，就得额外处理，但绝大多数反转顺序的场景都不需要深拷贝。

内容的提问来源于stack exchange，提问作者Gary McGill