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é?

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.


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 .


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 );

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


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>


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.


1
let a = 0.0500
a.toFixed(2);

//output
0.05

-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);
}
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.