在 JavaScript 中怎样倒序数组

如果你需要倒序数组元素的顺序，这里有一种代码技巧是你做到。你可以使用数组方法 “reverse()” ⏪

尝试一种新的称谓 #CodeRecipes。我通常 google 想要解决问题。这些是你应该保持习惯技巧，因为不是单方面的 “如果” 你使用它，而是 “当” 你使用它 😉

const benjamin = ['👶', '👦', '👨', '👴']

const benjaminButton = benjamin.reverse()

console.log(benjaminButton)
// ['👴', '👨', '👦', '👶']

修改的原数组

一件需要注意的事情是 Array.reverse() 会修改原数组。

const originalArray = ['a', 'b', 'c']
const newArray = originalArray.reverse()

console.log(originalArray) // [ 'c', 'b', 'a' ]
console.log(newArray) // [ 'c', 'b', 'a' ]```

怎样倒序数组却不改变原数组

有一些不修改原数组的方法。让我们了解 👀

使用 slice 和 reverse

const originalArray = ['a', 'b', 'c']
const newArray = originalArray.slice().reverse()

console.log(originalArray) // ['a', 'b', 'c']
console.log(newArray) // [ 'c', 'b', 'a' ]

使用扩展操作符(spread)和 reverse

const originalArray = ['a', 'b', 'c']
const newArray = [...originalArray].reverse()

console.log(originalArray) // ['a', 'b', 'c']
console.log(newArray) // [ 'c', 'b', 'a' ]

使用 reduce 和扩展操作符(spread)

const originalArray = ['a', 'b', 'c']
const newArray = originalArray.reduce((accumulator, value) => {
  return [value, ...accumulator]
}, [])

console.log(originalArray) // ['a', 'b', 'c']
console.log(newArray) // [ 'c', 'b', 'a' ]

使用 reduceRight 和扩展操作符(spread)

const originalArray = ['a', 'b', 'c']
const newArray = originalArray.reduceRight((accumulator, value) => {
  console.log(value)
  return [...accumulator, value]
}, [])

console.log(originalArray) // ['a', 'b', 'c']
console.log(newArray) // [ 'c', 'b', 'a' ]

或者使用 push

const originalArray = ['a', 'b', 'c']
const newArray = originalArray.reduceRight((accumulator, value) => {
  accumulator.push(value)
  return accumulator
}, [])

console.log(originalArray) // ['a', 'b', 'c']
console.log(newArray) // [ 'c', 'b', 'a' ]

社区支持

@aminnair：我决定测试想到的另一种方法，下面是结果：

with slice and reverse: 83.085ms
With one loop: 309.763ms

源代码以及测试情况在这里。

资源

• MDN Web Docs: reverse
• w3schools: reverse
• Stack Overflow: Reverse array in Javascript without mutating original array

本文由 吳文俊 翻译，原文地址 How to reverse an array in JavaScript?