JavaScript affichant un flottant à 2 décimales

316

Je voulais afficher un nombre à 2 décimales.

Je pensais pouvoir utiliser toPrecision(2)en JavaScript.

Cependant, si le nombre est 0.05, je comprends 0.0500. Je préfère que ça reste le même.

Voir sur JSbin .

Quelle est la meilleure façon de procéder?

Je peux penser à coder quelques solutions, mais j'imagine (j'espère) que quelque chose comme ça est intégré?

alex
la source

Réponses:

560
float_num.toFixed(2);

Remarque:toFixed() arrondira ou garnira de zéros si nécessaire pour respecter la longueur spécifiée.

Jason McCreary
la source
61
Mais il renvoie une chaîne, pas un flottant!
Anwar
38
L'auteur de la question veut "l'afficher", donc une chaîne est parfaite
Christophe Marois
7
Et vous pouvez toujours utiliser parseFloat (float_num.toFixed (2)) pour reconvertir la chaîne en float tout en ne conservant que deux décimales.
Hankrecords
3
@anwar, vous ne pouvez pas arrondir un flotteur de manière fiable (sans doute vous pouvez arrondir un flotteur du tout) - vous obtiendrez quelque chose comme 0,0500 ou même 0,0500000000001. Voir floating-point-gui.de
jmc
2
@Hankrecords ce que vous avez dit n'est pas vrai. Si j'ai '43 .01 'et que je parseFloat alors j'obtiens 43.01 MAIS si j'ai '43 .10' j'obtiendrai 43.1: D pas ce que je veux.
Lucian Tarna
50

Vous pouvez le faire avec la toFixedfonction, mais c'est bogué dans IE . Si vous voulez une solution fiable, regardez ma réponse ici .

Elias Zamaria
la source
26
La technologie devrait être développée plutôt que de s'adapter à IE ... (btw. Dans le noeud js float_num.toFixed(2);fonctionne très bien)
fider
14

Je ne sais pas comment j'en suis arrivé à cette question, mais même si cela fait de nombreuses années que cela a été posé, je voudrais ajouter une méthode rapide et simple que je suis et elle ne m'a jamais déçu:

var num = response_from_a_function_or_something();

var fixedNum = parseFloat(num).toFixed( 2 );
panos
la source
1
Pourquoi parseFloat()là - bas? Il ne doit être utilisé que si le nombre provient d'une chaîne.
alex
3
Dans certains cas, lorsque j'obtiens une valeur d'attribut "data-" avec jquery d'un élément, si j'utilise uniquement toFixed, cela produit une erreur. parseFloat le corrige.
panos
2
Oui, c'est ce que je voulais dire ci - dessus si cela venait d'une chaîne . Mais l'utiliser est toujours un mauvais conseil.
alex
8

number.parseFloat(2) fonctionne mais il renvoie une chaîne.

Si vous souhaitez le conserver en tant que type de nombre, vous pouvez utiliser:

Math.round(number * 100) / 100

rnmalone
la source
4

Vous pouvez essayer de mélanger Number()et toFixed().

Faites convertir votre numéro cible en une jolie chaîne de X chiffres, puis convertissez la chaîne formatée en un nombre.

Number( (myVar).toFixed(2) )


Voir l'exemple ci-dessous:

var myNumber = 5.01;
var multiplier = 5;
$('#actionButton').on('click', function() {
  $('#message').text( myNumber * multiplier );
});

$('#actionButton2').on('click', function() {
  $('#message').text( Number( (myNumber * multiplier).toFixed(2) ) );
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<button id="actionButton">Weird numbers</button>
<button id="actionButton2">Nice numbers</button>

<div id="message"></div>

George-Paul B.
la source
Merci pour votre belle référence.
Arman H
1

La toFixed()méthode formate un nombre en utilisant une notation à virgule fixe.

et voici la syntaxe

numObj.toFixed([digits])

L' argument chiffres est facultatif et par défaut est 0. Et le type de retour est une chaîne et non un nombre. Mais vous pouvez le convertir en nombre en utilisant

numObj.toFixed([digits]) * 1

Il peut également générer des exceptions comme TypeError,RangeError

Voici tous les détails et la compatibilité dans le navigateur.

Sunil Garg
la source
1
let a = 0.0500
a.toFixed(2);

//output
0.05
Rizo
la source
-1

J'ai fait cette fonction. Cela fonctionne bien mais renvoie une chaîne.

function show_float_val(val,upto = 2){
  var val = parseFloat(val);
  return val.toFixed(upto);
}
Syed Nurul Islam
la source