Travailler avec de nombres en Javascript - Letecode

Nombre en Javascript

Dernière mise à jour : 13/06/2022

Dans ce chapitre, vous apprendrez à représenter des nombres en JavaScript.

Travailler avec des nombres

JavaScript prend en charge les nombres entiers et à virgule flottante qui peuvent être représentés en notation décimale, hexadécimale ou octale. Contrairement à d'autres langages, JavaScript ne traite pas différemment les nombres entiers et à virgule flottante. Tous les nombres en JavaScript sont représentés sous forme de nombres à virgule flottante. Voici un exemple démontrant les nombres dans différents formats :

var x = 2;  // nombre entier
var y = 3.14;  // nombre décimal
var z = 0xff;  // nombre héxadecimal

Les très grands nombres peuvent être représentés en notation exponentielle, par exemple 6.02e+23 (identique à 6.02x10 23 ).

var x = 1.57e4;  // même que 15700
var y = 4.25e+6;  // même que 4.25e6 or 4250000
var z = 4.25e-6;  // mêmê que 0.00000425

Conseil : Le plus grand entier sûr en JavaScript est 9007199254740991 (253-1), tandis que le plus petit entier sûr est -9007199254740991 (-(253-1)).

Les nombres peuvent également être représentés en notation hexadécimale (base 16). Les nombres hexadécimaux sont préfixés par 0x. Ils sont couramment utilisés pour représenter les couleurs . Voici un exemple :

var x = 0xff;  // same as 255
var y = 0xb4;  // same as 180
var z = 0x00;  // same as 0

Remarque : Les nombres entiers peuvent être représentés en notation décimale, hexadécimale et octale. Les nombres à virgule flottante peuvent être représentés en notation décimale ou exponentielle.

Opérer sur des nombres et des chaînes

Comme vous le savez dans les chapitres précédents, l'opérateur + est utilisé à la fois pour l'addition et la concaténation. Ainsi, effectuer des opérations mathématiques sur des nombres et des chaînes peut produire des résultats intéressants. L'exemple suivant vous montrera ce qui se passe lorsque vous ajoutez des nombres et des chaînes :

var x = 10;
var y = 20;
var z = "30";
// Addition de deux nombres
console.log(x + y); // 30
// Addition des chaînes, le résultat est une chaîne
console.log(z + z); // '3030'
// Addition d'un nombre et une chaîne, le résultat est une chaîne
console.log(x + z); // '1030'
// Adding des nombres avec des chaînes, le calcul sera fait de gauche à droite
console.log(x + y + z); // 'The result is: 3030'

Si vous observez attentivement l'exemple ci-dessus, vous constaterez que le résultat de la dernière opération n'est pas simplement une simple concaténation de chaînes, car les opérateurs ayant la même priorité sont évalués de gauche à droite . C'est pourquoi, puisque les variables x et y sont toutes deux des nombres, elles sont ajoutées en premier, puis le résultat est concaténé avec la variable z qui est une chaîne, d'où le résultat final est 30 + "30" = "3030".

Mais, si vous effectuez d'autres opérations mathématiques comme la multiplication, la division ou la soustraction, le résultat sera différent. JavaScript convertira automatiquement les chaînes numériques (c'est-à-dire les chaînes contenant des valeurs numériques) en nombres dans toutes les opérations numériques, comme illustré dans l'exemple suivant :

var x = 10;
var y = 20;
var z = "30";
console.log(y - x); // 10
console.log(z - x); // 20
console.log(x * z); // 300
console.log(z / x); // 3

De plus, si vous essayez de multiplier ou de diviser des nombres avec des chaînes qui ne sont pas numériques, cela renvoie NaN(Pas un nombre). De plus, si vous utilisez NaN dans une opération mathématique, le résultat sera également NaN.

 

var x = 10;
var y = "foo";
var z = NaN;
console.log(y - x); // NaN
console.log(x * y); // NaN
console.log(x / y); // NaN
console.log(x + z); // NaN
console.log(y + z); // foo NaN

Représentant l'infini

L'infini représente un nombre trop grand pour être géré par JavaScript. JavaScript a un mot-clé spécial Infinity et -Infinity pour représenter respectivement l'infini positif et négatif. Par exemple, en divisant par 0 return Infinity, comme illustré ci-dessous :

var x = 5 / 0;
console.log(x); // Infinity
var y = -5 / 0;
console.log(y); // -Infinity

Remarque : L'infini est une valeur spéciale qui représente l'infini mathématique ∞, qui est supérieur à n'importe quel nombre. Le typeof Number de retour de l'opérateur pour une valeur Infinity.

Éviter les problèmes de précision

Parfois, les opérations sur les nombres à virgule flottante produisent des résultats inattendus, comme illustré ici :

var x = 0.1 + 0.2;
console.log(x) // 0.30000000000000004

Comme vous pouvez le voir, le résultat est 0.30000000000000004 plutôt que celui attendu 0.3. Cette différence est appelée erreur de représentation ou erreur d' arrondi . Cela se produit parce que JavaScript et de nombreux autres langages utilisent une forme binaire (base 2) pour représenter les nombres décimaux (base 10) en interne. Malheureusement, la plupart des fractions décimales ne peuvent pas être représentées exactement sous forme binaire, de sorte que de petites différences se produisent.

Pour éviter ce problème, vous pouvez utiliser la solution quelque chose comme ceci :

var x = (0.1 * 10 + 0.2 * 10) / 10;
console.log(x) // 0.3

JavaScript arrondit les nombres à virgule flottante à 17 chiffres, ce qui est suffisant dans la plupart des cas. De plus, en JavaScript, les entiers (nombres sans fractions ni notation exponentielle) sont précis jusqu'à 15 chiffres, comme le montre l'exemple suivant :

var x = 999999999999999;
console.log(x); // 999999999999999
var y = 9999999999999999;
console.log(y); // 10000000000000000

Effectuer des opérations sur des nombres

JavaScript fournit plusieurs propriétés et méthodes pour effectuer des opérations sur des valeurs numériques. Comme vous le savez déjà dans les chapitres précédents, en JavaScript, les types de données primitifs peuvent agir comme des objets lorsque vous y faites référence avec la notation d'accès aux propriétés (c'est-à-dire la notation par points).

Dans les sections suivantes, nous examinerons les méthodes numériques les plus couramment utilisées.

Analyser des entiers à partir de chaînes

La méthode parseInt() peut être utilisée pour analyser un entier à partir d'une chaîne. Cette méthode est particulièrement pratique dans les situations où vous avez affaire à des valeurs telles que des unités CSS, par exemple 50px, 12pt, etc. et que vous souhaitez en extraire la valeur numérique.

Si la méthode parseInt() rencontre un caractère qui n'est pas numérique dans la base spécifiée, elle arrête l'analyse et renvoie la valeur entière analysée jusqu'à ce point. Si le premier caractère ne peut pas être converti en nombre, la méthode retournera NaN(pas un nombre).

Les espaces de début et de fin sont autorisés. Voici un exemple :

console.log(parseInt("3.14"));  // 3
console.log(parseInt("50px"));  // 50
console.log(parseInt("12pt"));  // 12
console.log(parseInt("0xFF", 16));  // 255
console.log(parseInt("20 years"));  // 20
console.log(parseInt("Year 2048"));  // NaN
console.log(parseInt("10 12 2018"));  // 10

Remarque : La méthode parseInt() tronque les nombres en valeurs entières, mais elle ne doit pas être utilisée comme substitut de la méthode Math.floor().

De même, vous pouvez utiliser la méthode parseFloat() pour analyser un nombre à virgule flottante à partir d'une chaîne. La méthode parseFloat() fonctionne de la même manière que la méthode parseInt(), sauf qu'elle récupère à la fois des entiers et des nombres avec des décimales.

console.log(parseFloat("3.14"));  // 3.14
console.log(parseFloat("50px"));  // 50
console.log(parseFloat("1.6em"));  // 1.6
console.log(parseFloat("124.5 lbs"));  // 124.5
console.log(parseFloat("weight 124.5 lbs"));  // NaN
console.log(parseFloat("6.5 acres"));  // 6.5

Conversion de nombres en chaînes

La méthode  toString() peut être utilisée pour convertir un nombre en son équivalent de chaîne. Cette méthode accepte éventuellement un paramètre entier compris entre 2 et 36 spécifiant la base à utiliser pour représenter les valeurs numériques. Voici un exemple :

var x = 10;
var y = x.toString();
console.log(y);  // '10'
console.log(typeof y);  // string
console.log(typeof x);  // number
console.log((12).toString());  // '12'
console.log((15.6).toString());  // '15.6'
console.log((6).toString(2));  // '110'
console.log((255).toString(16));  // 'ff'

Formatage des nombres en notation exponentielle

Vous pouvez utiliser la méthode toExponential() pour formater ou représenter un nombre en notation exponentielle. Cette méthode accepte éventuellement un paramètre entier spécifiant le nombre de chiffres après la virgule décimale. De plus, la valeur renvoyée est une chaîne et non un nombre. Voici un exemple :

var x = 67.1234;
console.log(x.toExponential());  // 6.71234e+1
console.log(x.toExponential(6));  // 6.712340e+1
console.log(x.toExponential(4));  // 6.7123e+1
console.log(x.toExponential(2));  // 6.71e+1

Remarque : La notation exponentielle est utile pour représenter des nombres qui sont soit très grands, soit très petits. Par exemple, 62500000000 peut être écrit comme 625e+8 ou 6.25e+10.

Formatage des nombres en décimales fixes

Vous pouvez utiliser la méthode toFixed() lorsque vous souhaitez formater un nombre avec un nombre fixe de chiffres à droite de la virgule décimale. La valeur renvoyée par cette méthode est une chaîne et elle a exactement le nombre spécifié de chiffres après la virgule décimale. Si le paramètre n'est pas spécifié ou omis, il est traité comme 0. Voici un exemple :

var x = 72.635;
console.log(x.toFixed());  // '73' (pas de partie décimal)
console.log(x.toFixed(2));  // '72.64' (pas d'entier)
console.log(x.toFixed(1));  // '72.6'
var y = 6.25e+5;
console.log(y.toFixed(2)); // '625000.00'
var z = 1.58e-4;
console.log(z.toFixed(2));  // '0.00' ( 1.58e-4 == 0.000158)

Formater les nombres avec précision

Si vous voulez la forme la plus appropriée d'un nombre, vous pouvez utiliser la méthode toPrecision() à la place. Cette méthode renvoie une chaîne représentant le nombre avec la précision spécifiée.

Si la précision est suffisamment grande pour inclure tous les chiffres de la partie entière du nombre, le nombre est formaté à l'aide de la notation à virgule fixe. Sinon, le nombre est formaté en utilisant la notation exponentielle. Le paramètre de précision est facultatif. Voici un exemple :

var x = 6.235;
console.log(x.toPrecision());  // '6.235'
console.log(x.toPrecision(3));  // '6.24' 
console.log(x.toPrecision(2));  // '6.2'
console.log(x.toPrecision(1));  // '6'
var y = 47.63;
console.log(y.toPrecision(2)); // '48'
var z = 1234.5;
console.log(z.toPrecision(2));  // '1.2e+3'

Trouver les plus grands et les plus petits nombres possibles

L'objet Number possède également plusieurs propriétés qui lui sont associées. Les propriétés Number.MAX_VALUE et Number.MIN_VALUE de l'objet Number représentent les nombres positifs possibles les plus grands et les plus petits (les plus proches de zéro, et non les plus négatifs) que JavaScript peut gérer. Ce sont des constantes et leurs valeurs réelles sont 1.7976931348623157e+308, et 5e-324, respectivement.

Un nombre qui se situe en dehors de la plage des nombres possibles est représenté par une constante Number.POSITIVE_INFINITY ou Number.NEGATIVE_INFINITY. Voici un exemple :

 

var a = Number.MAX_VALUE;

console.log(a); // 1.7976931348623157e+308

var b = Number.MIN_VALUE;

console.log(b); // 5e-324

var x = Number.MAX_VALUE * 2;

console.log(x); // Infinity

var y = -1 * Number.MAX_VALUE * 2;

console.log(y); // -Infinity

Consultez également le chapitre sur les opérations mathématiques JavaScript pour en savoir plus sur l'arrondi des nombres, la génération d'un nombre aléatoire, la recherche d'une valeur maximale ou minimale à partir d'un ensemble de nombres, etc.