J'ai une liste d'objets que je souhaite trier en fonction d'un champ attrde type chaîne. J'ai essayé d'utiliser-

list.sort(function (a, b) {
    return a.attr - b.attr
})

mais a constaté que -cela ne semble pas fonctionner avec les chaînes en JavaScript. Comment puis-je trier une liste d'objets en fonction d'un attribut avec une chaîne de type?

Utilisez String.prototype.localeCompareun par votre exemple:

list.sort(function (a, b) {
    return ('' + a.attr).localeCompare(b.attr);
})

Nous forçons a.attr à être une chaîne pour éviter les exceptions. localeCompareest pris en charge depuis Internet Explorer 6 et Firefox 1. Vous pouvez également voir le code suivant utilisé qui ne respecte pas les paramètres régionaux:

if (item1.attr < item2.attr)
  return -1;
if ( item1.attr > item2.attr)
  return 1;
return 0;

Une réponse mise à jour (octobre 2014)

J'étais vraiment ennuyé par cet ordre de tri naturel des chaînes, j'ai donc pris un certain temps pour enquêter sur ce problème. J'espère que ça aide.

Longue histoire courte

localeCompare()le support des personnages est dur à cuire, utilisez-le. Comme indiqué par Shog9, la réponse à votre question est:

return item1.attr.localeCompare(item2.attr);

Bogues trouvés dans toutes les implémentations javascript personnalisées "ordre de tri des chaînes naturelles"

Il existe de nombreuses implémentations personnalisées, essayant de faire une comparaison de chaînes plus précisément appelée "ordre de tri des chaînes naturelles"

En "jouant" avec ces implémentations, j'ai toujours remarqué un choix étrange "d'ordre de tri naturel", ou plutôt des erreurs (ou des omissions dans le meilleur des cas).

En règle générale, les caractères spéciaux (espace, tiret, esperluette, crochets, etc.) ne sont pas traités correctement.

Vous les trouverez ensuite apparaissant mélangés à différents endroits, généralement cela pourrait être:

• certains seront entre le «Z» majuscule et le «a» minuscule
• certains seront entre le «9» et le «A» majuscule
• certains seront après «z» en minuscules

Quand on aurait pu s'attendre à ce que tous les caractères spéciaux soient "regroupés" en un seul endroit, à l'exception peut-être du caractère spécial espace (qui serait toujours le premier caractère). C'est-à-dire, soit tous avant les nombres, soit tous entre les chiffres et les lettres (les minuscules et les majuscules étant «ensemble» l'un après l'autre), ou tous après les lettres.

Ma conclusion est qu'ils ne parviennent pas tous à fournir un ordre cohérent lorsque je commence à ajouter des caractères à peine inhabituels (c'est-à-dire des caractères avec des signes diacritiques ou des caractères tels qu'un tiret, un point d'exclamation, etc.).

Recherche sur les implémentations personnalisées:

• Natural Compare Lite https://github.com/litejs/natural-compare-lite : échoue au tri de manière cohérente https://github.com/litejs/natural-compare-lite/issues/1 et http://jsbin.com/bevututodavi/ 1 / éditer? Js, console , tri de base des caractères latins http://jsbin.com/bevututodavi/5/edit?js,console
• Natural Sort https://github.com/javve/natural-sort : échoue au tri de manière cohérente, voir le problème https://github.com/javve/natural-sort/issues/7 et voir les caractères latins de base triant http: // jsbin. com / cipimosedoqe / 3 / edit? js, console
• Javascript Natural Sort https://github.com/overset/javascript-natural-sort : semble plutôt négligé depuis février 2012, échoue au tri de manière cohérente, voir le problème https://github.com/overset/javascript-natural-sort/issues/16
• Alphanum http://www.davekoelle.com/files/alphanum.js , échoue au tri de manière cohérente, voir http://jsbin.com/tuminoxifuyo/1/edit?js,console

Implémentations natives de "l'ordre de tri des chaînes naturelles" des navigateurs via localeCompare()

localeCompare()la plus ancienne implémentation (sans les paramètres régionaux et les arguments d'options) est prise en charge par IE6 +, voir http://msdn.microsoft.com/en-us/library/ie/s4esdbwz(v=vs.94).aspx (faites défiler jusqu'à localeCompare ( ) méthode). La localeCompare()méthode intégrée fait un bien meilleur travail de tri, même les caractères internationaux et spéciaux. Le seul problème avec la localeCompare()méthode est que "les paramètres régionaux et l'ordre de tri utilisés dépendent entièrement de l'implémentation". En d'autres termes, lorsque vous utilisez localeCompare tel que stringOne.localeCompare (stringTwo): Firefox, Safari, Chrome et IE ont un ordre de tri différent pour les chaînes.

Recherche sur les implémentations natives du navigateur:

• http://jsbin.com/beboroyifomu/1/edit?js,console - comparaison des caractères latins de base avec localeCompare () http://jsbin.com/viyucavudela/2/ - comparaison des caractères latins de base avec localeCompare () pour tester sur IE8
• http://jsbin.com/beboroyifomu/2/edit?js,console - caractères latins de base dans la comparaison de chaînes: contrôle de cohérence dans la chaîne vs lorsqu'un caractère est seul
• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/localeCompare - IE11 + prend en charge les nouveaux arguments de paramètres régionaux et d'options

Difficulté de "l'ordre de tri naturel des chaînes"

La mise en œuvre d'un algorithme solide (ce qui signifie: cohérent mais couvrant également un large éventail de caractères) est une tâche très difficile. UTF8 contient plus de 2000 caractères et couvre plus de 120 scripts (langues) . Enfin, il existe quelques spécifications pour ces tâches, il est appelé "Algorithme de Collation Unicode", qui peut être trouvé à http://www.unicode.org/reports/tr10/ . Vous pouvez trouver plus d'informations à ce sujet sur cette question que j'ai publiée /software/257286/is-there-any-language-agnostic-specification-for-string-natural-sorting-order

Conclusion finale

Donc, compte tenu du niveau actuel de support fourni par les implémentations personnalisées javascript que j'ai rencontrées, nous ne verrons probablement jamais rien se rapprocher de la prise en charge de tous ces caractères et scripts (langues). Par conséquent, je préfère utiliser la méthode localeCompare () native des navigateurs. Oui, il a l'inconvénient d'être non cohérent entre les navigateurs, mais les tests de base montrent qu'il couvre une gamme beaucoup plus large de caractères, permettant des ordres de tri solides et significatifs.

Donc, comme l'a souligné par Shog9, la réponse à votre question est:

return item1.attr.localeCompare(item2.attr);

Lectures complémentaires:

• /software/257286/is-there-any-language-agnostic-specification-for-string-natural-sorting-order
• Comment faites-vous la comparaison de chaînes en JavaScript?
• Javascript: type naturel de chaînes alphanumériques
• Tableau de tri d'éléments numériques et alphabétiques (tri naturel)
• Trier un tableau alphanumérique mixte
• https://web.archive.org/web/20130929122019/http://my.opera.com/GreyWyvern/blog/show.dml/1671288
• https://web.archive.org/web/20131005224909/http://www.davekoelle.com/alphanum.html
• http://snipplr.com/view/36012/javascript-natural-sort/
• http://blog.codinghorror.com/sorting-for-humans-natural-sort-order/

Merci à la gentille réponse de Shog9, qui m'a mis dans la "bonne" direction je crois

Réponse (dans ECMAScript moderne)

list.sort((a, b) => (a.attr > b.attr) - (a.attr < b.attr))

Ou

list.sort((a, b) => +(a.attr > b.attr) || -(a.attr < b.attr))

La description

La conversion d'une valeur booléenne en un nombre donne les résultats suivants:

• true -> 1
• false -> 0

Considérez trois modèles possibles:

• x est plus grand que y: (x > y) - (y < x)-> 1 - 0->1
• x est égal à y: (x > y) - (y < x)-> 0 - 0->0
• x est plus petit que y: (x > y) - (y < x) -> 0 - 1->-1

(Alternative)

• x est plus grand que y: +(x > y) || -(x < y)-> 1 || 0->1
• x est égal à y: +(x > y) || -(x < y)-> 0 || 0->0
• x est plus petit que y: +(x > y) || -(x < y)->0 || -1->-1

Ces logiques sont donc équivalentes aux fonctions typiques de comparateur de tri.

if (x == y) {
    return 0;
}
return x > y ? 1 : -1;

Vous devez utiliser> ou <et == ici. La solution serait donc:

list.sort(function(item1, item2) {
    var val1 = item1.attr,
        val2 = item2.attr;
    if (val1 == val2) return 0;
    if (val1 > val2) return 1;
    if (val1 < val2) return -1;
});

Fonction flèche ternaire imbriquée

(a,b) => (a < b ? -1 : a > b ? 1 : 0)

puisque les chaînes peuvent être comparées directement en javascript, cela fera le travail

list.sort(function (a, b) {
    return a.attr > b.attr ? 1: -1;
})

la soustraction dans une fonction de tri n'est utilisée que lorsque le tri non alphabétique (numérique) est souhaité et bien sûr cela ne fonctionne pas avec les chaînes

J'avais été gêné à ce sujet depuis longtemps, alors j'ai finalement fait des recherches et vous donner cette raison de longue haleine pour laquelle les choses sont comme elles sont.

De la spécification :

Section 11.9.4   The Strict Equals Operator ( === )

The production EqualityExpression : EqualityExpression === RelationalExpression
is evaluated as follows: 
- Let lref be the result of evaluating EqualityExpression.
- Let lval be GetValue(lref).
- Let rref be the result of evaluating RelationalExpression.
- Let rval be GetValue(rref).
- Return the result of performing the strict equality comparison 
  rval === lval. (See 11.9.6)

Alors maintenant, nous passons à 11.9.6

11.9.6   The Strict Equality Comparison Algorithm

The comparison x === y, where x and y are values, produces true or false. 
Such a comparison is performed as follows: 
- If Type(x) is different from Type(y), return false.
- If Type(x) is Undefined, return true.
- If Type(x) is Null, return true.
- If Type(x) is Number, then
...
- If Type(x) is String, then return true if x and y are exactly the 
  same sequence of characters (same length and same characters in 
  corresponding positions); otherwise, return false.

C'est tout. L'opérateur triple égal appliqué aux chaînes renvoie vrai si les arguments sont exactement les mêmes chaînes (même longueur et mêmes caractères aux positions correspondantes).

Cela ===fonctionnera donc dans les cas où nous essayons de comparer des chaînes qui pourraient provenir de différentes sources, mais qui, nous le savons, finiront par avoir les mêmes valeurs - un scénario assez courant pour les chaînes en ligne dans notre code. Par exemple, si nous avons une variable nommée connection_stateet que nous souhaitons savoir dans lequel des états suivants se ['connecting', 'connected', 'disconnecting', 'disconnected']trouve actuellement, nous pouvons utiliser directement le=== .

Mais il y a plus. Juste au-dessus de 11.9.4, il y a une courte note:

NOTE 4     
  Comparison of Strings uses a simple equality test on sequences of code 
  unit values. There is no attempt to use the more complex, semantically oriented
  definitions of character or string equality and collating order defined in the 
  Unicode specification. Therefore Strings values that are canonically equal
  according to the Unicode standard could test as unequal. In effect this 
  algorithm assumes that both Strings are already in normalized form.

Hmm. Et maintenant? Les cordes obtenues de l'extérieur peuvent, et très probablement, être unicodey étranges, et nos doux ===ne leur rendront pas justice. En vient localeCompareà la rescousse:

15.5.4.9   String.prototype.localeCompare (that)
    ...
    The actual return values are implementation-defined to permit implementers 
    to encode additional information in the value, but the function is required 
    to define a total ordering on all Strings and to return 0 when comparing
    Strings that are considered canonically equivalent by the Unicode standard. 

On peut rentrer maintenant.

tl; dr;

Pour comparer des chaînes en javascript, utilisez localeCompare; si vous savez que les chaînes n'ont pas de composants non ASCII car ce sont, par exemple, des constantes de programme internes, alors cela ===fonctionne aussi.

Dans votre opération dans votre question initiale, vous effectuez l'opération suivante:

item1.attr - item2.attr

Donc, en supposant que ce sont des nombres (ie item1.attr = "1", item2.attr = "2") Vous pouvez toujours utiliser l'opérateur "===" (ou d'autres évaluateurs stricts) à condition de garantir le type. Les éléments suivants devraient fonctionner:

return parseInt(item1.attr) - parseInt(item2.attr);

S'ils sont alphaNumeric, alors utilisez localCompare ().

list.sort(function(item1, item2){
    return +(item1.attr > item2.attr) || +(item1.attr === item2.attr) - 1;
}) 

Comment ils fonctionnent des échantillons:

+('aaa'>'bbb')||+('aaa'==='bbb')-1
+(false)||+(false)-1
0||0-1
-1

+('bbb'>'aaa')||+('bbb'==='aaa')-1
+(true)||+(false)-1
1||0-1
1

+('aaa'>'aaa')||+('aaa'==='aaa')-1
+(false)||+(true)-1
0||1-1
0

<!doctype html>
<html>
<body>
<p id = "myString">zyxtspqnmdba</p>
<p id = "orderedString"></p>
<script>
var myString = document.getElementById("myString").innerHTML;
orderString(myString);
function orderString(str) {
    var i = 0;
    var myArray = str.split("");
    while (i < str.length){
        var j = i + 1;
        while (j < str.length) {
            if (myArray[j] < myArray[i]){
                var temp = myArray[i];
                myArray[i] = myArray[j];
                myArray[j] = temp;
            }
            j++;
        }
        i++;
    }
    var newString = myArray.join("");
    document.getElementById("orderedString").innerHTML = newString;
}
</script>
</body>
</html>

var str = ['v','a','da','c','k','l']
var b = str.join('').split('').sort().reverse().join('')
console.log(b)