Array.sort工作不正常

Array.sort not working correctly

本文关键字:不正常 工作 sort Array      更新时间:2023-09-26

我需要sort函数来将日期从最早日期排序到最晚日期。如何在任务表中修复此问题?

var tasks = new Array();
var index = 0;
function addTask() {
    var temptask = document.getElementById("taskinfo").value;
    var td = document.getElementById("taskdate").value;
    var tempdate = new Date(td);
    //add array and populate from tempdate and temptask
    //generate html table from 2d javascript array
    tasks[index] = {
        Date: tempdate,
        Task: temptask,
    };  
    index++
    tasks.sort(function(a,b){return new Date(b.Date).getTime() - new Date(a.Date).getTime()});
    var tablecode = "<table class = 'tasktable'>" +
        "<tr>"+
        "<th>Date</th>"+
        "<th>Task</th>"+
        "</tr>";
    for (var i = 0; i < tasks.length; i++) {
        tablecode = tablecode + "<tr>" +
            "<td>" + tasks[i]["Date"].toDateString() + " </td>" +
            "<td>" + tasks[i]["Task"] + " </td>" +
            "</tr>";
    }
    tablecode = tablecode + "</table>";
    document.getElementById("bottomright").innerHTML = tablecode;
    return false;
}

我尝试了许多不同的语法变体,但无法使sort函数按降序排序

由于日期表示为

自1970年1月1日UTC以来的毫秒数
(https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date)

您要查找的排序顺序是升序而不是降序。此外,正如@birdspider已经评论的那样,创建新的Date对象和调用getTime()方法是没有用的。它们具有可比性。

要总结以上几点,请尝试使用以下排序功能:

function sortDatesAsc(tempdateA, tempdateB) {
    return tempdateA - tempdateB < 0 ? -1 : (tempdateA > tempdateB ? 1 : 0);
}
tasks.sort(sortDatesAsc);

您要从b.Date中减去a.Date,这与您想要的正好相反。

把它们翻过来(去掉不必要的new Date()包装,尽管它们实际上并没有破坏任何东西),你就会得到正确的排序:

var tasks = [],
    index = 0;
function addTask() {
  var temptask = document.getElementById("taskinfo").value;
  var td = document.getElementById("taskdate").value;
  var tempdate = new Date(td);
  tasks[index] = {
    Date: tempdate,
    Task: temptask,
  };
  index++
  tasks.sort(function(a, b) {
    return a.Date.getTime() - b.Date.getTime()
  });
  var tablecode = "<table class='tasktable'>" +
    "<tr>" +
    "<th>Date</th>" +
    "<th>Task</th>" +
    "</tr>";
  for (var i = 0; i < tasks.length; i++) {
    tablecode += "<tr>" +
      "<td>" + tasks[i]["Date"].toDateString() + " </td>" +
      "<td>" + tasks[i]["Task"] + " </td>" +
      "</tr>";
  }
  tablecode += "</table>";
  document.getElementById("bottomright").innerHTML = tablecode;
  return false;
}
document.getElementById('add').addEventListener('click', addTask);
<p>Task:
<input type="text" id="taskinfo" /></p>
<p>Date:
<input type="date" id="taskdate" /></p>
<button id="add">add</button>
<div id="bottomright"></div>