使用sort对类似于1-1、2-1、1-1-1、2-2类型的数据进行排序

1. 创建模拟数据源然后对该数据进行排序

  const unitList = [
    { unitName: "1-1" },
    { unitName: "1" },
    { unitName: "1-3" },
    { unitName: "1-2" },
    { unitName: "2-2" },
    { unitName: "2-1" },
    { unitName: "1-1-1" },
    { unitName: "2-1-1" },
    { unitName: "1-1-1-1-1-1" },
  ];

解决方案

解决方法1(最优)
unitList .sort((s, t) => {
  if (s.unitName < t.unitName) return -1;
  else return 1;
  return 0;
})
解决方法2

解决思路:把需要排序得value转换成整数,然后通过数值对比进行排序

  // 拿到最大位数比如1-1的位数是2   1-1-1的位数是3
  // replace(/-/g, "")是将字符中的-转换为空  比如把1-1转换成11最终拿数字对比排序
  const maxLength = `${Math.max(
    ...unitList.map((item) => +item.unitName.replace(/-/g, ""))
  )}`.length;
  unitList.forEach((item) => {
    // 拿到当前位数
    const l = `${item.unitName.replace(/-/g, "")}`.length;
    // 对比差异位数
    const diff = maxLength - l;
    // 将差异位数补齐比如1-1和1-1-1 那么此时的补齐差异位数的结果就是1-1-0和1-1-1
    item.tempUnitName = item.unitName + Array(diff).fill("-0").join("");
  });
  // 把每个字符中的-使用正则转换为空那么最终就是[ { unitName: "11" }, { unitName: "1" }, { unitName: "13" }, { unitName: "12" }, { unitName: "22" }, { unitName: "21" }, { unitName: "111" }, { unitName: "211" }, { unitName: "111111" }] 然后使用sort对比每一个元素实现最终的排序
  unitList.sort((a, b) => {
    const tempA = +a.tempUnitName.replace(/-/g, "");
    const tempB = +b.tempUnitName.replace(/-/g, "");
    return tempA - tempB;
  });
解决方法3(推荐)

解决思路:把需要排序得value转换成小数,然后通过数值对比进行排序

  // a-正则匹配到得内容  b-正则匹配到得内容的位置
  const replaceFunction = (a, b) => {
    if (b === 1) return ".";
    return "";
  };
  unitList.sort((a, b) => {
    const tempA = +a.unitName.replace(/-/g, replaceFunction);
    const tempB = +b.unitName.replace(/-/g, replaceFunction);
    return tempA - tempB;
  });

3. 最终的结果是这样的

第二种办法相比第一种复杂度提高了很多,第二种也是我本人的解决方法,后来听了一个朋友的想法和意见接触到了第一种解决方法。

大家如有别的解决办法欢迎交流学习,在此奉上本人的微信号yzh20191124ljt希望能和前端的朋友们共同学习

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章