Question

我有一个这样的对象数组：

let guests = [{name: 'a'},{name: 'c'},{name: 'b'}]

我正在尝试按降序然后升序对其进行排序：

let guests = [{
  name: 'a'
}, {
  name: 'c'
}, {
  name: 'b'
}]
console.log(guests)

var var1 = guests.sort((a, b) => a.name < b.name)
console.log(var1)

var var2 = guests.sort((a, b) => a.name > b.name)
console.log(var2)

所有三个控制台的结果是：

[{name: 'a'}, {name: 'b'}, {name: 'c'}]

我不明白的是为什么所有这三个console.log都会向我显示一个按升序排序的。有两个console.log在排序之前发生。

现在，我知道该数组是在排序后进行操作的。但是我不明白的是为什么排序之前的console.log会受到影响。为了与我期望的正常行为进行比较，我使用了一个字符串数组。

let guests = ['a','c','b']

jsfiddle示例：example 在这里console.log对我来说更有意义。

Answer 1

这不是bug，尽管Array.sort（）返回的数组只是一个引用，所以它会影响原始数组，而不是副本（就地算法）。为了获得一个新的数组，您必须在进行排序之前先克隆该数组（切片，lodash deepClone等）。

ref：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort

文档中的重要行：

已排序的数组。请注意，数组是按顺序排序的，因此不会进行复制。

工作示例：

let guests = [{
  name: 'a'
}, {
  name: 'c'
}, {
  name: 'b'
}]
console.log(guests)

var var1 = guests.slice(0).sort((a, b) => a.name < b.name)
console.log(var1)

var var2 = guests.slice(0).sort((a, b) => a.name > b.name)
console.log(var2)

注意

console.log 的实现因浏览器而异，直接更改对象时不能依赖它，因为获取对象本身可能是异步的。

注释2

var 语句也是该问题的一部分，因为起吊：

var声明，无论它们出现在哪里，都将在执行任何代码之前进行处理。这称为提升，下面将进一步讨论。

参考：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/var#Description

Answer 2

您正在修改一个阵列，因此所有控制台日志都会受到影响。

您正在做的只是将var1和var2设置为对来宾的引用。

如果要查看单独的结果，则需要该阵列的新副本。您可以对原始数组执行.slice（0）。

let guests = [{name: 'a'},{name: 'c'},{name: 'b'}]
console.log(guests)

var var1 = guests.slice(0).sort((a,b)=> a.name<b.name ? 1:-1)
console.log(var1)

var var2 = guests.slice(0).sort((a,b)=> a.name>b.name ? 1:-1)
console.log(var2)

Answer 3

您可以将JSON.stringify用于控制台。控制台中没有刷新功能，因此您不能在不更改引用的情况下进行更改。

多次对对象数组进行排序会导致浏览器控制台出现怪异错误JavaScript

3 个答案: