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

Question

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

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

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

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

我已经检查过，Firefox 已经支持localeCompare()了很长时间。

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

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

标签： javascriptsortingfirefox

Answer 1

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

我将您在 sortRecipientsByProperty 中的这部分代码简化为此，并使用 Firefox，当您单击时，数据显示为 az，如果再次单击，则为 za。

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 进行对比，您应该在两种情况下都针对 b 进行对比（或 b 对比 a 始终或不将测试 <0 更改为 >0）。这就是解释，因为 localeCompare 已经处理了所有情况，最好只使用一次。