web-dev-qa-db-fra.com

Quel est le meilleur moyen de convertir un nombre en chaîne en JavaScript?

Quel est le "meilleur" moyen de convertir un nombre en chaîne (en termes d'avantage de vitesse, de clarté, de mémoire, etc.)?

Quelques exemples:

  1. String(n)

  2. n.toString()

  3. ""+n

  4. n+""

430
Pacerier

comme ça:

var foo = 45;
var bar = '' + foo;

En fait, même si je le fais généralement comme ceci pour des raisons de commodité simple, il semble que plus de 1 000 itérations pour la vitesse brute, il existe un avantage pour .toString()

Voir Tests de performance ici (pas par moi, mais trouvé quand je suis allé écrire le mien): http://jsben.ch/#/ghQYR

Le plus rapide basé sur le test JSPerf ci-dessus: str = num.toString();

Il est à noter que la différence de vitesse n'est pas trop significative si l'on considère qu'elle peut effectuer la conversion de quelque manière que ce soit 1 million de fois en 0,1 seconde.

Mise à jour: La vitesse semble varier considérablement d'un navigateur à l'autre. Sur Chrome, num + '' semble être le plus rapide sur la base de ce test http://jsben.ch/#/ghQYR

Update 2: Encore une fois basé sur le test ci-dessus, il convient de noter que Firefox 20.0.1 exécute la .toString() environ 100 fois plus lentement que l'exemple '' + num.

425
scunliffe

À mon avis, n.toString() prend le prix pour sa clarté et je ne pense pas qu'il entraîne de frais généraux supplémentaires. 

297
CarlosZ

Les conversions explicites sont très claires pour une personne novice dans la langue. L'utilisation de la contrainte de type, comme d'autres l'ont suggéré, crée une ambiguïté si un développeur ne connaît pas les règles de contrainte. En fin de compte, le temps passé par le développeur coûte plus cher que le temps de calcul; par conséquent, j'optimiserais pour le premier au détriment du dernier. Cela étant dit, dans ce cas, la différence est probablement négligeable, mais sinon, je suis sûr qu'il existe quelques compresseurs JavaScript décents qui optimiseront ce genre de choses.

Donc, pour les raisons ci-dessus, je choisirais: n.toString() ou String(n). String(n) est probablement un meilleur choix car il n'échouera pas si n est null ou non défini.

57
Bryan Kyle

... l'analyseur JavaScript tente d'analyser la notation de points sur un nombre en tant que littéral à virgule flottante.

2..toString(); // the second point is correctly recognized
2 .toString(); // note the space left to the dot
(2).toString(); // 2 is evaluated first

La source

20
Mohammad Arif

La langue dans la joue évidemment:

var harshNum = 108;
"".split.call(harshNum,"").join("");

Ou, dans ES6, vous pouvez simplement utiliser template strings :

var harshNum = 108;
`${harshNum}`;
13
cssimsek

Le moyen le plus simple de convertir une variable en chaîne est d’ajouter une chaîne vide à cette variable. 

5.41 + ''    // Result: the string '5.41'
Math.PI + '' // Result: the string '3.141592653589793'
11
sgokhales

D'autres réponses couvraient déjà d'autres options, mais je préfère celle-ci:

s = `${n}`

Bref, succinct, déjà utilisé dans de nombreux autres endroits (si vous utilisez une version framework/ES moderne), il est donc prudent que tout programmeur le comprenne.

Non pas que cela compte (généralement) beaucoup, mais cela semble aussi être parmi les plus rapides par rapport à autres méthodes .

5
johndodo

Si vous avez besoin de formater le résultat en un/ nombre de décimales spécifique, par exemple pour représenter la devise, vous avez besoin de quelque chose comme la méthode toFixed().

number.toFixed( [digits] )

digits est le nombre de chiffres à afficher après la décimale.

5
Tim

J'aime les deux premiers car ils sont plus faciles à lire. J'ai tendance à utiliser String(n) mais c'est juste une question de style qu'autre chose.

C’est à moins que vous ayez une ligne comme

var n = 5;
console.log ("the number is: " + n);

ce qui est très explicite

2
Aleadam

Je pense que cela dépend de la situation mais vous pouvez quand même utiliser la méthode .toString() car elle est très claire à comprendre.

2
Serghei

J'ai utilisé https://jsperf.com pour créer un scénario de test dans les cas suivants:

number + ''
`${number}`
String(number)
number.toString()

https://jsperf.com/number-string-conversion-speed-comparison

Les résultats du 24 juillet 2018 indiquent que number + '' est le plus rapide de Chrome, dans Firefox, qui est lié aux littéraux de chaîne de modèle.

String(number) et number.toString() sont tous deux environ 95% plus lents que l'option la plus rapide.

 performance tests, description above

2
Erick

Si je devais tout prendre en considération, je suggérerais de suivre 

var myint = 1;
var mystring = myint + '';
/*or int to string*/
myint = myint + ''

IMHO, c'est le moyen le plus rapide de convertir en chaîne. Corrigez-moi si je me trompe.

1
Kumar

La seule solution valable pour presque tous les cas existants et futurs possibles (l'entrée est un nombre, null, undefined, Symbol, tout le reste) est String(x). N'utilisez pas 3 méthodes simples pour une opération simple, en vous basant sur des hypothèses de type valeur, comme "ici, je convertis certainement nombre en chaîne et ici certainement booléen en chaîne".

Explication:

String(x) gère les valeurs NULL, indéfinies, Symboles, [tout] et appelle .toString() pour les objets.

'' + x appelle .valueOf() sur x (attribution au numéro), jette sur symboles, peut fournir des résultats dépendants de la mise en oeuvre.

x.toString() jette à zéro et indéfini.

Remarque: String(x) échouera quand même sur des objets sans prototype tels que Object.create(null).

Si vous n'aimez pas les chaînes telles que 'Hello, undefined' ou souhaitez prendre en charge des objets sans prototype, utilisez la fonction de conversion de type suivante:

/**
 * Safely casts any value to string. Null and undefined are converted to ''.
 * @param  {*} value
 * @return {string}
 */
function string (str) {
  return value == null ? '' : (typeof value === 'object' && !value.toString ? '[object]' : String(value));
}
1
Alexander Shostak

.toString () est la fonction de conversion de texte intégrée, je ne suis pas un expert en la matière, mais chaque fois que nous comparons des méthodologies explicites de transtypage de types intégrés, les solutions de contournement intégrées sont toujours préférées. 

1
Mubeen Khan

Nous pouvons également utiliser le constructeur String . Selon this benchmark , il s'agit du moyen le plus rapide de convertir un nombre en chaînes dans Firefox 58, même s'il est plus lent que " + num dans le navigateur populaire Google Chrome.

0
peter

Si vous êtes curieux de savoir lequel est le plus performant, voyez où je compare les différentes conversions Nombre -> Chaîne.

On dirait que 2+'' ou 2+"" sont les plus rapides.

https://jsperf.com/int-2-string

0
Alex Cory

Il semble que les résultats soient similaires lorsqu’on utilise node.js. J'ai couru ce script:

let bar;
let foo = ["45","foo"];

console.time('string concat testing');
for (let i = 0; i < 10000000; i++) {
    bar = "" + foo;
}
console.timeEnd('string concat testing');


console.time("string obj testing");
for (let i = 0; i < 10000000; i++) {
    bar = String(foo);
}
console.timeEnd("string obj testing");

console.time("string both");
for (let i = 0; i < 10000000; i++) {
    bar = "" + foo + "";
}
console.timeEnd("string both");

et a obtenu les résultats suivants:

❯ node testing.js
string concat testing: 2802.542ms
string obj testing: 3374.530ms
string both: 2660.023ms

Des temps similaires à chaque fois que je l'ai couru. 

0
Shahaed

La méthode toFixed() résoudra également le problème.

var n = 8.434332;
n.toFixed(2)  // 8.43
0
Shaik Rasool

Je vais rééditer ceci avec plus de données quand j'en aurai le temps, car maintenant c'est très bien ...

Test dans nodejs v8.11.2: 2018/06/06

let i=0;
    console.time("test1")
    for(;i<10000000;i=i+1){
    	const string = "" + 1234;
    }
    console.timeEnd("test1")
    
    i=0;
    console.time("test1.1")
    for(;i<10000000;i=i+1){
    	const string = '' + 1234;
    }
    console.timeEnd("test1.1")
    
    i=0;
    console.time("test1.2")
    for(;i<10000000;i=i+1){
    	const string = `` + 1234;
    }
    console.timeEnd("test1.2")
    
    i=0;
    console.time("test1.3")
    for(;i<10000000;i=i+1){
    	const string = 1234 +  '';
    }
    console.timeEnd("test1.3")
    
    
    i=0;
    console.time("test2")
    for(;i<10000000;i=i+1){
    	const string = (1234).toString();
    }
    console.timeEnd("test2")
    
    
    i=0;
    console.time("test3")
    for(;i<10000000;i=i+1){
    	const string = String(1234);
    }
    console.timeEnd("test3")
    
    
    i=0;
    console.time("test4")
    for(;i<10000000;i=i+1){
    	const string = `${1234}`;
    }
    console.timeEnd("test4")
    
    i=0;
    console.time("test5")
    for(;i<10000000;i=i+1){
    	const string = 1234..toString();
    }
    console.timeEnd("test5")
    
    i=0;
    console.time("test6")
    for(;i<10000000;i=i+1){
    	const string = 1234 .toString();
    }
    console.timeEnd("test6")

sortie  

test1: 72.268ms
test1.1: 61.086ms
test1.2: 66.854ms
test1.3: 63.698ms
test2: 207.912ms
test3: 81.987ms
test4: 59.752ms
test5: 213.136ms
test6: 204.869ms
0
DarckBlezzer

Récemment, les méthodes 3 et 4 ne sont pas appropriées, car les chaînes sont copiées puis assemblées. Pour un petit programme, ce problème est insignifiant, mais pour toute application Web réelle, cette action qui nécessite de manipuler des chaînes de fréquence peut affecter les performances et la lisibilité. 

Voici le lien la lecture

0
roger