JavaScript 数组反转

摘要：在本教程中，您将学习如何使用 JavaScript 数组 reverse() 方法，该方法可以反转数组中元素的顺序。

JavaScript 数组反转方法简介

reverse() 方法反转 数组 中元素的顺序，并返回修改后的数组，元素按反转顺序排列。

以下是 reverse() 方法的语法

Array.prototype.reverse()
Code language: JavaScript (javascript)

reverse() 方法不接受任何参数。它就地反转数组的元素并返回反转后的数组。

reverse() 方法是通用的。这意味着您可以对具有 length 属性和整数键属性的非数组对象调用它。

请注意，您不能对字符串调用 reverse()，因为字符串是不可变的。

要反转数组中元素的顺序并返回数组的副本而不修改原始数组，可以使用 toReversed() 方法。

JavaScript 数组 reverse() 方法示例

让我们探索一些使用 JavaScript 数组 reverse() 方法的示例。

1) 对字符串数组使用 JavaScript 数组 reverse() 方法

以下示例使用 reverse() 方法反转字符串数组

const colors = ['red','green','blue'];
colors.reverse();

console.log(colors);Code language: JavaScript (javascript)

输出

['blue', 'green', 'red']Code language: JavaScript (javascript)

2) 对数字数组使用 JavaScript 数组 reverse() 方法

以下示例使用 reverse() 方法反转数组中数字的顺序

const scores = [1, 3, 5, 7];
scores.reverse();

console.log(scores);Code language: JavaScript (javascript)

输出

[7, 5, 3, 1]Code language: JavaScript (javascript)

3) 对对象数组使用 JavaScript 数组 reverse() 方法

以下示例使用 reverse() 方法反转数组中对象的顺序

const books = [
  { title: 'Eloquent JavaScript', author: 'Marijn Haverbeke' },
  { title: 'JavaScript: The Good Parts', author: 'Douglas Crockford' },
  { title: 'JavaScript: The Definitive Guide', author: 'David Flanagan' },
];

books.reverse();

console.log(books);Code language: JavaScript (javascript)

输出

[
    {
        "title": "JavaScript: The Definitive Guide",
        "author": "David Flanagan"
    },
    {
        "title": "JavaScript: The Good Parts",
        "author": "Douglas Crockford"
    },
    {
        "title": "Eloquent JavaScript",
        "author": "Marijn Haverbeke"
    }
]Code language: JavaScript (javascript)

4) 对稀疏数组使用 reverse()

当您对稀疏数组调用 reverse() 方法时，该数组将保持稀疏。reverse() 方法将空插槽复制到它们各自的索引上作为空插槽

const scores = [1,,7,5];
scores.reverse();

console.log(scores);Code language: JavaScript (javascript)

输出

[5, 7, empty, 1]Code language: JavaScript (javascript)

5) 对非数组对象使用 JavaScript 数组 reverse()

以下示例说明了如何在具有 length 属性和整数键属性的对象上调用 reverse() 方法

const arrayLike = {
  length: 3,
  unrelated: "bar",
  2: 2,
  3: 3, // ignored by reverse() since length is 3
};
console.log(Array.prototype.reverse.call(arrayLike));Code language: JavaScript (javascript)

输出

{0: 2, 3: 3, length: 3, unrelated: 'bar'}Code language: JavaScript (javascript)

在此示例中，reverse() 方法首先访问 array 的 length 属性。随后，它迭代每个具有从 0 到 length / 2 的整数键的属性。

在此过程中，它会交换数组两端对应索引的值。此外，该方法还会删除任何没有相应源属性的目标属性。

总结

• 使用 JavaScript 数组 reverse() 方法就地反转数组中元素的顺序。