javascript - 了解 sort() compareFunction

标签 javascript jquery

我正在使用一个电子商务平台,该平台无法对我们的产品属性字段的选项进行重新排序。这真的很糟糕,因为要插入一个新选项,您几乎必须删除所有现有选项并重新开始。我正在尝试在客户端进行。这是我正在使用的(这个是鞋码):

  • 9 EE
  • 9 1/2 EE
  • 10 EE
  • 10 1/2 效率
  • 11 EE
  • 11 1/2 EE
  • 9 EEEE
  • 9 1/2 天
  • 9 1/2 EEEE
  • 10 EEEE
  • 10 1/2 EEEE
  • 11 EEEE
  • 9天
  • 11 1/2 EEEE

这些其实是一些<option>的文字在一个表格中。值的格式为 X Y Z其中:

  • X是一个整数
  • Y是字符串“1/2”,可能不存在
  • Z是字母代码,可以是“D”、“E”、“EEE”或“EEEE”,并且可能不存在

上面的期望顺序是这样的:

  • 9天
  • 9 1/2 天
  • 9 EE
  • 9 1/2 EE
  • 9 EEEE
  • 9 1/2 EEEE
  • 10 EE
  • 10 1/2 效率
  • 10 EEEE
  • 10 1/2 EEEE
  • 11 EE
  • 11 1/2 EE
  • 11 EEEE
  • 11 1/2 EEEE

我对 javascript 的 sort() 了解了一些函数,但还不能完全理解传递给它的比较函数是如何工作的。到目前为止我已经知道了:

<select>
    <option>9 EE</option>
    <option>9 1/2 EE</option>
    <option>10 EE</option>
    <option>10 1/2 EE</option>
    <option>11 EE</option>
    <option>11 1/2 EE</option>
    <option>9 EEEE</option>
    <option>9 1/2 D</option>
    <option>9 1/2 EEEE</option>
    <option>10 EEEE</option>
    <option>10 1/2 EEEE</option>
    <option>11 EEEE</option>
    <option>9 D</option>
    <option>11 1/2 EEEE</option>
</select>

我从这个答案中的代码开始:https://stackoverflow.com/a/667198/398242

$("select").html($("option").sort(function (a, b) {
    return a.text == b.text ? 0 : a.text < b.text ? -1 : 1
}));

像这样对项目进行排序(甚至不适用于第一个条件):

  • 10 1/2 EE
  • 10 1/2 EEEE
  • 10 EE
  • 10 EEEE
  • 11 1/2 EE
  • 11 1/2 EEEE
  • 11 EE
  • 11 EEEE
  • 9 1/2 D
  • li>9 1/2 EE
  • 9 1/2 EEEE
  • 9 D
  • 9 EE
  • 9 EEEE

我在 javascript 中看到了 '11' > '9'返回 false ,这对我来说毫无意义。

MDN describes the compare function argument因此,我有点明白了:

function compare(a, b) {
  if (a is less than b by some ordering criterion)
     return -1;
  if (a is greater than b by the ordering criterion)
     return 1;
  // a must be equal to b
  return 0;
}

...但我不知道如何调整它以满足我的要求。我已经尝试了一些东西,但我只是觉得我在黑暗中拍摄。我试图表明我已经花了一些时间来尝试理解这个问题。我有兴趣了解更多信息,但现在我只想解决这个问题。

http://jsfiddle.net/DnwJ6/有什么线索吗?

最佳答案

既然您已经设置了文本格式,一种方法是在比较文本元素之前对其进行规范化。

这个解决方案可能不是最优的,但可以完成工作

$("select").html($("option").sort(function (a, b) {
    return nomalize(a.text) < nomalize(b.text) ? -1 : 1;
}));

function nomalize(val){
    var parts =  val.split(' '), op = '';

    op = parts[0].length == 1 ? '0' + parts[0] : parts[0];
    if(parts.length > 1){
        if(/[a-z]/i.test(parts[1])){
            op += '0/0' + parts[1];
        } else {
            op += parts[1]
        }
    }

    op += parts.length > 2 ? parts[2] : '';
    return op;
}

演示:Fiddle

如果有人可以提出任何解决方案来进一步优化它,那就太好了

关于javascript - 了解 sort() compareFunction,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17562100/

相关文章:

javascript - IndexedDB 搜索键并排序

javascript - jQuery .flip() 在 2 秒间隔内不起作用

jquery - 基于 HTML <li> 标签的动态 jQuery

javascript - 即使使用 parseInt 转换计算后我仍然得到 NaN

javascript - jQuery UI 对话框使用 setTimeout 自动关闭

javascript - Svelte 中的原生 JavaScript

javascript - 对本地文件系统的 AJAX 请求在 Chrome 中不起作用?

javascript - 如何检测图像加载失败的原因?

javascript - id ="nodeName"在html5中是保留的吗?

javascript - 在 JQuery 中从 Angular 调用 ng-attr-id