【发布时间】:2020-05-16 13:44:04
【问题描述】:
我有以下功能:
const sort = (query) => (choiceA, choiceB) => choiceA.name.toLowerCase().localeCompare(choiceB.name.toLowerCase()),
用法如下:
newSearches = newSearches.sort(sort(query));
例如,在这个例子中,tarascon 应该是第一个结果,等等...
const query = 't';
const choices = [
{
"name": "Marseille 1er arrondissement"
},
{
"name": "Marseille 2ème arrondissement"
},
{
"name": "Marseille 3ème arrondissement"
},
{
"name": "Marseille 4ème arrondissement"
},
{
"name": "Marseille 5ème arrondissement"
},
{
"name": "Marseille 6ème arrondissement"
},
{
"name": "Marseille 7ème arrondissement"
},
{
"name": "Marseille 8ème arrondissement"
},
{
"name": "Marseille 9ème arrondissement"
},
{
"name": "Marseille 10ème arrondissement"
},
{
"name": "Marseille 11ème arrondissement"
},
{
"name": "Marseille 12ème arrondissement"
},
{
"name": "Marseille 13ème arrondissement"
},
{
"name": "Marseille 14ème arrondissement"
},
{
"name": "Marseille 15ème arrondissement"
},
{
"name": "Marseille 16ème arrondissement"
},
{
"name": "Le Tholonet"
},
{
"name": "Saint-Marc-Jaumegarde"
},
{
"name": "Beaurecueil"
},
{
"name": "Saint-Antonin-sur-Bayon"
},
{
"name": "Aix-en-Provence"
},
{
"name": "Saint-Étienne-du-Grès"
},
{
"name": "Mas-Blanc-des-Alpilles"
},
{
"name": "Mimet"
},
{
"name": "Simiane-Collongue"
},
{
"name": "Port-de-Bouc"
},
{
"name": "Coudoux"
},
{
"name": "La Destrousse"
},
{
"name": "Lamanon"
},
{
"name": "Puyloubier"
},
{
"name": "Saint-Paul-lès-Durance"
},
{
"name": "Vernègues"
},
{
"name": "Saint-Savournin"
},
{
"name": "Gardanne"
},
{
"name": "Aurons"
},
{
"name": "Ventabren"
},
{
"name": "Peypin"
},
{
"name": "Vauvenargues"
},
{
"name": "Vitrolles"
},
{
"name": "Berre-l'Étang"
},
{
"name": "Miramas"
},
{
"name": "Tarascon"
},
{
"name": "Les Pennes-Mirabeau"
},
{
"name": "Gignac-la-Nerthe"
},
{
"name": "Allauch"
},
{
"name": "Arles"
},
{
"name": "Saint-Rémy-de-Provence"
},
{
"name": "Châteauneuf-les-Martigues"
},
{
"name": "Port-Saint-Louis-du-Rhône"
},
{
"name": "Septèmes-les-Vallons"
},
{
"name": "Cornillon-Confoux"
},
{
"name": "Saint-Chamas"
},
{
"name": "Cassis"
},
{
"name": "Fos-sur-Mer"
},
{
"name": "Salon-de-Provence"
},
{
"name": "Saint-Martin-de-Crau"
},
{
"name": "Bouc-Bel-Air"
},
{
"name": "La Barben"
},
{
"name": "Pélissanne"
},
{
"name": "Rognac"
},
{
"name": "Charleval"
},
{
"name": "Roquevaire"
},
{
"name": "Mallemort"
},
{
"name": "Plan-de-Cuques"
},
{
"name": "Auriol"
},
{
"name": "Aubagne"
},
{
"name": "Lambesc"
},
{
"name": "Gémenos"
},
{
"name": "Eyguières"
},
{
"name": "Grans"
},
{
"name": "Saintes-Maries-de-la-Mer"
},
{
"name": "Carnoux-en-Provence"
},
{
"name": "Cabriès"
},
{
"name": "Jouques"
},
{
"name": "Martigues"
},
{
"name": "Éguilles"
},
{
"name": "Paradou"
},
{
"name": "Maussane-les-Alpilles"
},
{
"name": "Les Baux-de-Provence"
},
{
"name": "Trets"
},
{
"name": "Sénas"
},
{
"name": "La Fare-les-Oliviers"
},
{
"name": "Meyreuil"
},
{
"name": "La Ciotat"
},
{
"name": "Ceyreste"
},
{
"name": "Saint-Estève-Janson"
},
{
"name": "Le Puy-Sainte-Réparade"
},
{
"name": "Carry-le-Rouet"
},
{
"name": "La Roque-d'Anthéron"
},
{
"name": "Meyrargues"
},
{
"name": "Lançon-Provence"
},
{
"name": "Marignane"
},
{
"name": "Fuveau"
},
{
"name": "La Bouilladisse"
},
{
"name": "Belcodène"
},
{
"name": "Saint-Victoret"
},
{
"name": "Le Rove"
},
{
"name": "Saint-Cannat"
},
{
"name": "Venelles"
},
{
"name": "Cuges-les-Pins"
},
{
"name": "Riboux"
},
{
"name": "Peynier"
},
{
"name": "Châteauneuf-le-Rouge"
},
{
"name": "Rousset"
},
{
"name": "Istres"
},
{
"name": "Ensuès-la-Redonne"
},
{
"name": "La Penne-sur-Huveaune"
},
{
"name": "Roquefort-la-Bédoule"
},
{
"name": "Rognes"
},
{
"name": "Gréasque"
},
{
"name": "Peyrolles-en-Provence"
},
{
"name": "Velaux"
},
{
"name": "Mouriès"
},
{
"name": "Saint-Mitre-les-Remparts"
},
{
"name": "Aureille"
},
{
"name": "Cadolive"
},
{
"name": "Sausset-les-Pins"
},
{
"name": "Alleins"
},
{
"name": "Fontvieille"
},
{
"name": "Fourques"
},
{
"name": "Artigues"
},
{
"name": "Rians"
},
{
"name": "Plan-d'Aups-Sainte-Baume"
},
{
"name": "Saint-Zacharie"
},
{
"name": "Nans-les-Pins"
},
{
"name": "Pourrières"
},
{
"name": "Pertuis"
},
{
"name": "Mirabeau"
},
{
"name": "La Bastidonne"
},
{
"name": "Beaumont-de-Pertuis"
},
{
"name": "Puyvert"
},
{
"name": "Cucuron"
},
{
"name": "Lourmarin"
},
{
"name": "Cadenet"
},
{
"name": "Vaugines"
},
{
"name": "Vitrolles-en-Lubéron"
},
{
"name": "Grambois"
},
{
"name": "Cabrières-d'Aigues"
},
{
"name": "Peypin-d'Aigues"
},
{
"name": "Sannes"
},
{
"name": "Ansouis"
},
{
"name": "La Bastide-des-Jourdans"
},
{
"name": "La Tour-d'Aigues"
},
{
"name": "La Motte-d'Aigues"
},
{
"name": "Lauris"
},
{
"name": "Villelaure"
},
{
"name": "Saint-Martin-de-la-Brasque"
}
];
const sort = (query) => (choiceA, choiceB) => !isNaN(query) || (
choiceA.name.toLowerCase().localeCompare(choiceB.name.toLowerCase()) && query.indexOf(choiceA.name.toLowerCase()) === -1
);
const filter = (query) => (choice) => choice.name.toLowerCase().includes(query.toLowerCase());
document.getElementById('search').addEventListener('click', () => {
const q = document.getElementById('query').value;
const newSearches = choices.filter(filter(q)).sort(sort(q));
document.getElementById('result').innerHTML = JSON.stringify(newSearches.map(s => s.name), null, 2);
}, true);
#result {
display: block;
width: 100vw;
}
<input id="query" type="text" />
<button id="search" type="button">search<button>
<pre id="result"></pre>
enter code here到目前为止,这将仅通过比较名称按字母顺序排序,而不管查询如何,我如何更新它以便根据提供的查询按字母顺序排序?
【问题讨论】:
-
请在您的代码中为
newSearches分享一些数据,并分享您的预期输出应该是什么样子以及排序后现在的样子。 -
什么是
query?有排序的方向吗? -
@adiga,标题中写着query是一个字符串。由于
query是一个字符串,例如,如果我查询p,我希望首先使用Paris,而不是Saint-Tropes。 -
我添加了一个例子
-
如果
query="p",在搜索结果中Maussane-les-Alpilles应该高于Paris还是低于Paris?该名称包括P,但它不以p开头。您想检查name是否以query开头,还是只想检查它是否包含在name中?
标签: javascript sorting ecmascript-2016