Firefox 不会对对象数组进行排序，但 Chrome 和 Opera 会

Question

当我尝试对我的对象数组进行排序时，它在 Chrome 和 Safari 中运行顺利，但 Firefox 根本不会对其进行排序。

您可以在此处查看它的 JSFiddle。点击表格标题进行排序： http://jsfiddle.net/g5y3smu0/

这是另一个在所有 3 个浏览器中都可以进行排序的小提琴：http://jsfiddle.net/srp89xyg/

你可以在后一个小提琴中看到我不再使用localeCompare()，然后它就像一个魅力，但这不是我想要的那种。

我已经 checked 并且 Firefox 支持 localeCompare() 很长时间了。

我很困惑这里可能存在什么问题...有人知道发生了什么或解决此问题的方法吗？

请注意，小提琴的东西是我为了这个问题而制作的。我正在开发一个 AngularJS 应用程序，并选择使用 React 样板来制作小提琴。不要因为我没有使用 React 的最佳实践等而嘲笑我 ;)

Answer 1

查看您的代码，您似乎正在使用 localCompare 并在更大、更小或等于 localCompare 的情况下模拟结果。

我将您在 sortRecipientsByProperty 中的这部分代码简化为此，并且使用 Firefox，当您单击时，数据显示为按 a-z 排序，如果再次单击，则按 z-a 排序。

if (this.state[prop] === undefined || this.state[prop] === false) {
    this.state.items.sort((a, b) => (a[prop].localeCompare(b[prop], {ignorePunctuation: true})));
}
else {
    this.state.items.sort((a, b) => (b[prop].localeCompare(a[prop], {ignorePunctuation: true})));
}

使用 localeCompare 的代码中有错字，因此结果不正确：

this.state.items.sort(
    (a, b) => (
        (a[prop].localeCompare(b[prop], {ignorePunctuation: true})) < 0 ? -1 : 
        (b[prop].localeCompare(a[prop], {ignorePunctuation: true})) > 0 ? 1 : 0));

您首先检查 a 与 b 然后 b 与 a 您应该在这两种情况下测试 a 与 b （或 b 与 a 始终或不将测试 0）。 这就是解释，因为 localeCompare 已经处理了所有情况，最好只使用一次。