javascript - 根据搜索输入按字母顺序对数组进行排序

Question

如果我有一个数组，例如:

["Adambb", "Andrebw", "Bob", "Billy", "Sandrab", "Xaviercb"]

我在搜索框中输入(例如)“B”，如何在 JavaScript 中重新排序数组，使其结果与最接近的字符串(也按字母顺序排列)匹配？

例如，在搜索框中输入“B”会将数组重新排序为:

["Billy", "Bob", "Adambb", "Andrebw", "Sandrab", "Xaviercb"]

我希望数组能够像任何搜索系统一样重新排序。由于某种原因，我无法在网上找到这个答案。要么我没有正确地提出我的问题，要么我只是找不到与我的问题类似的任何内容。

Answer 1

另一种方法是检查字符串是否以输入的值开头，然后决定顺序。

• 当a和b以输入的值开头时进行字符串比较。
• 如果 a 以输入的值开头，而 b 不是，则将 a 放在开头。
• 如果 b 以输入的值开头，而 a 则不将 b 放在开头。
• 否则，进行默认字符串比较。

var array = [{id: "157", tag: "Adambb", course: "Adambb - Calculus I"}, {id: "158", tag: "Andrebw", course: "Andrebw - Ca I"}, {id: "159", tag: "Bob", course: "Bob - Cass I"}, {id: "160", tag: "Billy", course: "Billy - uus I"}, {id: "161", tag: "Sandrab", course: "Sandrab - allus I"}, {id: "162", tag: "Xaviercb", course: "Xaviercb - Cal I"}];

var input = 'Sa'; // Changed to illustrate the behavior.

var sorted = array.sort((a, b) => {
   if (a.course.startsWith(input) && b.course.startsWith(input)) return a.course.localeCompare(b.course);
   else if (a.course.startsWith(input)) return -1;
   else if (b.course.startsWith(input)) return 1;
     
   return a.course.localeCompare(b.course);;
});

console.log(sorted);

.as-console-wrapper { max-height: 100% !important; top: 0; }

另一种方法是检查字符串是否包含输入的值并决定顺序。

• 当a和b包含输入的值时进行字符串比较。
• 如果 a 包含输入的值，而 b 不包含，则将 a 放在开头。
• 如果 b 包含输入的值，而 a 不包含，则将 b 放在开头。
• 否则，进行默认字符串比较。

var array = [{id: "157", tag: "Adambb", course: "Adambb - Calculus I"}, {id: "158", tag: "Andrebw", course: "Andrebw - Ca I"}, {id: "159", tag: "Bob", course: "Bob - Cass I"}, {id: "160", tag: "Billy", course: "Billy - uus I"}, {id: "161", tag: "Sandrab", course: "Sandrab - allus I"}, {id: "162", tag: "Xaviercb", course: "Xaviercb - Cal I"}];

var input = 'r'; // Changed to illustrate the behavior.

var sorted = array.sort((a, b) => {
   if (a.course.indexOf(input) !== -1 && b.course.indexOf(input) !== -1) return a.course.localeCompare(b.course);
   else if (a.course.indexOf(input) !== -1) return -1;
   else if (b.course.indexOf(input) !== -1) return 1;
     
   return a.course.localeCompare(b.course);
});

console.log(sorted);

.as-console-wrapper { max-height: 100% !important; top: 0; }