Question

我有一组用户，根据他们的角色将信息附加或添加到列表中。

if (user.role === 'Student') {
    rosterElement.appendChild(studentList);
} else {
    $(rosterElement).prepend(studentList);
}

如上所示，如果用户的角色是学生，则按姓氏的字母顺序将其附加到列表中。如果他们不是学生，那么他们就是一名教师，他们会被列入名单。但是，根据姓氏，它们以反向alpa顺序排列，如下所示。

    STUDENT                ROLE
    Jerome Terrell         Instructor
    Priyanka Maheshwaran   Instructor
    Thomas Lee             Instructor
    Angela Lee             Instructor
    Eric Firestone         Student
    Marshall Lee           Student
    Devansh Patel          Student
    Chris Ryker            Student

有没有办法按字母顺序添加对象数组。我已尝试使用.before（）并以alpa顺序成功地预装了教师，但将它们放在 studentList div之前，从而导致格式问题。如果您有任何建议，请提供。感谢

修改

studentList是以javascript表示的列表项（li）的实例，而rosterElement是列表的实例（ul）。 javascript代码遍历用户列表，并将用户的数据附加或预先添加到列表

Answer 1

只需在其中使用两个div，然后将教师添加到第一个，将学生添加到第二个：

$(rosterElement).html("<div></div><div></div>");

userList.forEach(function(user){

   $(rosterElement).children().eq(
     user.role === 'Student'?1:0
   ).append(JSON.stringify(user))

});

Answer 2

如果您在创建元素之前对studentList进行排序，那么您（在代码简单性和性能方面）可能会更好。

至于（在撰写本文时），我没有studentList内容的例子，我将假设以下结构

var userList = [ { name: 'John Doe', role: 'Student' }, ... ]

在这种情况下，我会像这样对userList进行排序：

userList.sort(function(a, b) {
  //  if the roles match, sort by name
  if (a.role === b.role) {
    //  return -1 (a before b), 0 (do not change current order) 
    //  or 1 (a after b)
    return a.name < b.name ? -1 : Number(a.name > b.name);
  }

  //  non-student roles go before student roles
  return a.role !== 'Student' ? -1 : 1;
});

如果您需要保留userList的初始订单，则需要知道sort会对其进行修改，因此您需要创建副本（如果列表非常大，请考虑这是一个性能命中），然后对其进行排序并用于渲染;

var orderedUserList = userList.slice().sort(...)

按字母顺序排列对象| JavaScript的

2 个答案: