Sur Internet, nous pouvons facilement utiliser des chiffres pour afficher messages non lus, commentaires, likes, tweets, etc., lorsqu'il s'agit de formater des numéros dans une institution bancaire ou financière, le processus d'affichage d'un numéro peut nécessiter un travail supplémentaire.

Si vous avez besoin d'afficher des nombres au format monétaire ou d'être séparés par des virgules, alors vous aimerez certainement cette bibliothèque javascript pour le formatage monétaire des nombres.

Aujourd'hui, nous voulons vous expliquer comment vous pouvez implémenter facilement et simplement une telle fonctionnalité, et également vous présenter un exemple. Alors, commençons.

Commencer

Accounting.js est une bibliothèque javascript sans aucune dépendance. Vous n'avez pas besoin d'intégrer jQuery pour utiliser cette bibliothèque. Téléchargez le code source à partir de , placez-le dans le répertoire approprié, puis créez un lien vers le fichier dans votre document HTML.

Formatage de base

Accounting.js propose plusieurs méthodes de formatage des nombres. Et le premier est formatMoney(). Cette méthode est fonction de base pour convertir des nombres ordinaires en monnaie. Pour l'utiliser, chaque méthode est initialisée avec la comptabilité puis le nom de la méthode est utilisé. Par exemple:

Comptabilité.formatMoney(2000000);
Avec les paramètres par défaut, Accounting.js ci-dessus s'affiche avec un signe dollar américain, avec une virgule tous les trois chiffres et une séparation des dollars des cents.

$2,000,000.00
Certains pays utilisent un séparateur différent pour tous les trois chiffres (milliers). Accounting.js est entièrement localisable. Si vous n'aimez pas l'affichage de la devise par défaut, vous pouvez apporter des modifications à l'aide des options.

Ci-dessous, laissez-moi vous donner un exemple de l'Allemagne, qui n'utilise pas de séparateur pour les milliers :

Comptabilité.formatMoney(2000000, (
symbole : "€",
mille: ".",
décimal: ",",
});
Code donné en conséquence nous donnera:

€2.000.000,00
Si vous souhaitez formater des nombres sans spécifier de symbole monétaire, vous pouvez utiliser la méthode formatNumber() :

Arrondir les nombres

Les nombres peuvent avoir des divisions fractionnaires, mais nous avons l'habitude de les arrondir au nombre entier le plus proche. Dans Accounting.js, nous pouvons utiliser .toFixed() pour cela. Cet exemple nous montre comment nous pouvons exclure les nombres fractionnaires, ainsi que les nombres entiers arrondis à la valeur la plus proche :

Comptabilité.toFixed(102.58, 0);
En conséquence, nous obtiendrons :

103
Construire un convertisseur de devises simple

Dans cette section, nous utiliserons les fonctions ci-dessus pour développer un convertisseur de devises simple. Rien d'extraordinaire, juste trois paires pour montrer comment fonctionne Accounting.js.

DANS cet exemple nous convertirons l'USD en 2 devises appelées KRW (Won coréen) et JPY (Yen japonais).

Utilisons la structure de document suivante :

Comme vous pouvez le voir ci-dessus, nous avons ici 2 lignes avec des éléments div. La première ligne contient une liste déroulante d'options définie sur USD, et elle est désactivée car les utilisateurs ne pourront pas sélectionner de devise dans ce champ. Cette ligne contient également un champ de saisie de type numérique, dans lequel vous devez saisir le montant en USD à convertir.

Sur la deuxième ligne, nous avons également un menu déroulant qui contient 2 devises : le won coréen et le yen japonais. Chaque option a un attribut de valeur et un symbole de données qui contiendra le symbole monétaire. Nous utilisons un élément span pour afficher le résultat converti.

Devis

Au moment de la rédaction, 1 USD était égal à 1077,80 KRW et 102,24 JPY. Nous pouvons obtenir ces valeurs de devis en temps réel en utilisant . Cependant, sur ce moment nous mettons simplement la valeur dans la variable en utilisant la méthode .toFixed() afin d'arrondir la valeur :

Varjpy = comptabilité.toFixed(102.24, 0),
krw = comptabilité.toFixed(1077.80, 0),
Nous offrons un choix

getCurrency = fonction(elem) (
var $curAbbr = elem.find(":selected").val(),
$curSign = elem.find(":selected").data("symbol");
retour(
"symbole" : $curSign,
"valeur" : $curAbbr,
};
};
Fonction de conversion

Nous avons besoin que la conversion se fasse en temps réel. Cela signifie que cela se produira lorsque l'utilisateur saisira des nombres dans le champ de saisie ou basculera entre les devises.

Pour cela, nous appliquons #output-currency ainsi que #input-number avec 3 événements javascript appelés change, et :

$("#output-currency, #input-number").on("change keyup keydown", function() (
// truc
}
Ensuite, nous demandons la valeur de la liste déroulante, #output-currency , en utilisant la fonction getCurrency que nous avons créée ci-dessus. Les valeurs sont séparées à l'intérieur de deux variables $symbol et $val comme suit.

Var $currency = getCurrency($("#output-currency")),
$symbole = $devise["symbole"],
$val = $devise["valeur"] ;
Nous devons également obtenir le nombre du champ de saisie, ainsi que la valeur des guillemets actuels que nous avons définis dans les variables jpy et krw. En utilisant une fonction conditionnelle, nous pouvons décider quelle citation (krw ou jpy) utiliser.

// obtenir le numéro
var multipleNum = ($val == "jpy") ? jpy : crw ;
var $getInput = $("#numéro-entrée").val();
En utilisant les nombres ci-dessus, nous calculons le résultat.

Var $getTotal = ($getInput * mulitplyNum);
Cependant, avant d'imprimer le nombre, enveloppons-le dans un format approprié en utilisant la méthode .formatMoney() :

Varnumber = comptabilité.formatMoney($getTotal, (
symbole : symbole $,
précision : 0
mille: ","
});
Et enfin, nous sortons le format numérique final :

$("#numéro-de-sortie").text(nombre);
Prêt! Vous pouvez voir la démo ci-dessous.

Dans cet article, nous examinerons de plus près les nombres, les opérateurs mathématiques, les façons de convertir un nombre en chaîne et vice versa, ainsi que de nombreux autres points importants.

fonction isFinite

La fonction isFinite permet de vérifier si un argument est un nombre fini.

En guise de réponse fonction donnée renvoie false si l'argument est Infinity , -Infinity , NaN , ou sera converti en l'une de ces valeurs numériques spéciales. Sinon, cette fonction renverra true .

EstFinite(73); // true isFinite(-1/0); // false isFinite(Infinity); // false isFinite(NaN); // false isFinite("Texte"); // FAUX

En plus de la fonction globale isFinite, JavaScript possède également la méthode Number.isFinite. Contrairement à isFinite, il ne force pas la conversion de l'argument en nombre.

EstFinite("73"); // vrai Number.isFinite("73"); // FAUX

fonction isNaN

La fonction isNaN sert à déterminer si un argument est un nombre ou peut être converti en un. Si tel est le cas, la fonction isNaN renvoie false. Sinon, il renvoie vrai.

EstNaN(NaN); //vrai estNaN("25px"); // vrai, parce que 20px n'est pas un nombre isNaN(25.5); //faux estNaN("25.5"); //faux estNaN(" "); //faux, car un espace ou plusieurs espaces sont convertis en 0 isNaN(null); //faux, car la valeur nulle est convertie en 0 isNaN(true); //faux, car true est converti en 1 isNaN(false); //faux, car la valeur fausse est convertie en 0

Si cette action doit être effectuée sans conversion de type, utilisez la méthode Number.isNaN. Cette méthode a été introduite dans le langage depuis ECMAScript 6.

Comment convertir explicitement une chaîne en nombre ?

Vous pouvez convertir explicitement une chaîne en nombre à l'aide des méthodes suivantes :

1. Utiliser opérateur unaire + Le à placer avant la valeur.

+"7.35" ; // 7.35 +"texte" ; // NaN

Cette méthode ignore les espaces au début et à la fin de la ligne, ainsi que \n (saut de ligne).

+"7.35" ; //7.35 +"7.35\n" ; //7.35

En utilisant Par ici notez qu'une chaîne vide ou une chaîne composée d'espaces et de \n est convertie en nombre 0. De plus, il convertit également le type de données null et les booléens en nombre.

Nul; //0 + vrai ; //1 +faux ; //0 +" " ; //0

2. Fonction parseInt . Cette fonction est conçue pour convertir argument d'un entier. Au lieu d'utiliser opérateur unaire +, cette méthode vous permet de convertir une chaîne en un nombre, dans lequel tous les caractères ne sont pas numériques. Il commence à convertir la chaîne, à partir du premier caractère. Et dès qu'elle rencontre un caractère qui n'est pas un caractère numérique, cette fonction arrête son travail et renvoie le nombre résultant.

ParseInt("18px"); //18 parseInt("33.3%"); //33

Cette fonction peut fonctionner avec différents systèmes numérotation (binaire, octale, décimale, hexadécimale). L'indication de la base du système de numération s'effectue au moyen de 2 arguments.

ParseInt("18px", 10); //18 parseInt("33.3%", 10); //33 parseInt("101",2); //5 parseint("B5",16); //181

En plus de la fonction parseInt, JavaScript possède la méthode Number.parseInt. Cette méthode n'est pas différente de la fonction parseInt et a été introduite dans JavaScript avec la spécification ECMASCRIPT 2015(6).

3. Fonction parseFloat . La fonction parseFloat est similaire à parseInt , sauf qu'elle vous permet de convertir l'argument en un nombre fractionnaire.

ParseFloat("33.3%"); //33.3

De plus, la fonction parseFloat, contrairement à parseInt, n'a pas 2 arguments, et donc elle essaie toujours de traiter la chaîne comme un nombre en notation décimale.

ParseFloat("3.14"); parseFloat("314e-2"); parseFloat("0.0314E+2");

En plus de la fonction parseFloat, JavaScript possède la méthode Number.parseFloat. Cette méthode n'est pas différente de la fonction parseFloat et a été introduite dans JavaScript avec la spécification ECMASCRIPT 2015(6).

Convertir un nombre en chaîne

Vous pouvez transformer un nombre en chaîne à l'aide de la méthode toString.

(12.8).toString(); //"12.8"

La méthode toString vous permet également de spécifier la base du système de numération, en tenant compte du fait que vous devez convertir explicitement le nombre en chaîne :

(255).toString(16); //"ff"

Comment vérifier si une variable est un nombre

Vous pouvez déterminer si la valeur d'une variable est un nombre en utilisant l'une des méthodes suivantes :

1. Utilisation des fonctions isNaN et isFinite :

// myVar est une variable if (!isNaN(parseFloat(myVar)) && isFinite(parseFloat(myVar))) ( // myVar est un nombre ou peut être converti en lui );

En tant que fonction:

// fonction function isNumeric(value) ( ​​​​return !isNaN(parseFloat(value)) && isFinite(parseFloat(value)); ) // utilisation var myVar = "12px"; console.log(isNumeric(myVar)); //vrai

Cette méthode vous permet de déterminer si la valeur spécifiée est un nombre ou peut être convertie en celui-ci. Cette variante ne compte pas une chaîne vide, une chaîne d'espaces, null , Infinity , -Infinity , true et false comme un nombre.

2. Utilisation type d'opérateur et les fonctions isFinite, isNaN :

// fonction qui vérifie si la valeur est un nombre function isNumber(value) ( ​​​​return typeof value === "number" && isFinite(value) && !isNaN(value); }; // использование функции isNumber isNumber(18); //true // использование функций для проверки текстовых значений isNumber(parseFloat("")); //false isNumber(parseFloat("Infinity")); //false isNumber(parseFloat("12px")); //true !}

Cette fonction détermine si la valeur spécifiée est de type Nombre, et aussi si elle appartient à l'un des valeurs spéciales Infini, -Infini et NaN. Si c'est le cas, alors cette fonction renvoie vrai.

3. Utilisation de la méthode ECMAScript 6 Number.isInteger(value). Cette méthode vous permet de déterminer si la valeur spécifiée est un entier.

Number.isInteger("20"); //faux, car cette méthode ne traduit pas la chaîne en nombre Number.isInteger(20); // vrai, parce que valeur donnée est un nombre

Nombres pairs et impairs

Vous pouvez vérifier si un nombre est pair ou impair en fonctions suivantes:

// Fonction pour vérifier si un nombre est pair function isEven(n) ( return n % 2 == 0; ) // Fonction pour vérifier si un nombre est impair function isOdd(n) ( return Math.abs(n % 2) == 1 ; )

Mais avant d'effectuer une telle vérification, il est souhaitable de s'assurer que la valeur spécifiée est un nombre :

valeur=20 ; if (Number.isInteger(value)) ( if (isEven(value)) ( console.log("Number " + value.toString() + " - even"); ) )

Nombres premiers en Javascript

Prenons un exemple dans lequel nous dérivons en utilisant Javascript simple nombres de 2 à 100.

// Une fonction qui vérifie si un nombre est premier function isPrime(value) ( ​​​​if (isNaN(value) || !isFinite(value) || value%1 || value< 2) return false; var max=Math.floor(Math.sqrt(value)); for (var i = 2; i< = max; i++) { if (value%i==0) { return false; } } return true; } // создать массив, который будет содержать простые числа от 2 до 100 var primaryNumber = ; for (var i = 2; i <= 100; i++) { if(isPrime(i)) primaryNumber.push(i); } // вывести в консоль простые числа от 2 до 100 console.log(primaryNumber);

Arrondir un nombre en Javascript

Il existe différentes façons d'arrondir un nombre fractionnaire à une valeur entière en JavaScript.

1. Utiliser les méthodes Math.floor , Math.ceil et Math.round spécialement conçues pour cela. La méthode Math.floor arrondit un nombre fractionnaire à l'entier le plus proche, c'est-à-dire supprime simplement la partie fractionnaire. Math.ceil arrondit un nombre fractionnaire à l'entier supérieur le plus proche. Math.round arrondit un nombre vers le haut ou vers le bas en fonction de la valeur de la partie fractionnaire. Si la partie fractionnaire est supérieure ou égale à 0,5, alors vers le haut, sinon le défilement est vers le bas.

Console.log(Math.floor(7.9)); //7 console.log(Math.ceil(7.2)); //8 console.log(Math.round(7.5)); //8

2. Utilisation de la méthode toFixed(precision). Cette méthode arrondit la partie fractionnaire d'un nombre à la précision spécifiée. Le résultat de l'arrondi est renvoyé sous forme de chaîne.

Console.log(7.987.toFixed(2)); //"7.99"

S'il n'y a pas assez de décimales pour former la précision spécifiée du nombre, il est rempli de zéros.

Console.log(7.987.toFixed(5)); //"7.98700"

3. Via la méthode toPrecision(precision). Cette méthode représente un nombre avec la précision spécifiée. En même temps, il peut arrondir non seulement la fraction, mais aussi toute la partie du nombre. Le nombre résultant peut être représenté par cette méthode en fonction du résultat en un point fixe ou sous forme exponentielle.

Console.log((1001).toPrecision(2)); //"1.0e+3" console.log((1001).toPrecision(5)); //"1001.0" console.log((12.4).toPrecision(1)); //"1e+1" console.log((12.4).toPrecision(2)); //"12" console.log((12.4).toPrecision(3)); //"12.4" console.log((12.4).toPrecision(5)); //"12.400"

4. Utilisation des opérateurs logiques NOT ou OR.

//via la double négation logique console.log(~~7.9); //7 // en utilisant le OU logique avec zéro : console.log(7.9^0); //7

Entier et partie fractionnaire d'un nombre

Vous pouvez obtenir la partie entière d'un nombre en utilisant les méthodes Math.floor() et parseInt() :

Console.log(Math.floor(7.21)); // 7 console.log(parseInt(7.21)); // 7

Vous pouvez obtenir la partie fractionnaire d'un nombre à l'aide de l'opérateur de pourcentage (%). Cet opérateur renvoie le reste qui sera obtenu en divisant le premier nombre par le second. Dans ce cas, 1 doit être utilisé comme 2e chiffre.

Console.log(7.21%1); // 0.20999999999999996 // précis à 2 décimales console.log((7.21%1).toFixed(2)); // "0.21"

De plus, la partie fractionnaire peut également être obtenue à l'aide de calculs :

var nombre = 7,21 ; var fractionNumber = nombre - Math.floor(Math.abs(nombre)); console.log(fractionNumber); // 0.20999999999999996

Le nombre est-il divisible

Vous pouvez déterminer si un nombre est divisible de manière égale à l'aide de l'opérateur de pourcentage :

varnumber = 9 ; // si le reste de la division de nombre par 3 est 0, alors oui, sinon non if (nombre%3==0) ( console.log ("Le nombre " + nombre + " est divisible par 3"); ) else ( console.log("Le nombre " + le nombre + " n'est pas divisible par 3"); )

Formatage des nombres

En JavaScript, la méthode toLocaleString() vous permet de formater la sortie d'un nombre en fonction des paramètres régionaux (paramètres de langue du système d'exploitation).

Par exemple, formatons un nombre en fonction des normes régionales installées par défaut dans le système :

var numéro = 345,46 ; console.log(number.toLocaleString()); //"345,46"

Par exemple, formatons un nombre conformément aux normes régionales de la Russie (ru) :

Console.log((108.1).toLocaleString("ru-RU")); //"108.1"

Cette méthode peut également être utilisée pour formater un nombre en tant que devise :

Console.log((2540.125).toLocaleString("ru-RU",(style:"devise", devise:"RUB"))); //"2,540.13 ₽" console.log((89.3).toLocaleString("ru-RU",(style:"currency", currency:"USD"))); //"$89.30" console.log((2301.99).toLocaleString("ru-RU",(style:"currency", currency:"EUR"))); //"2 301,99 €"

Représenter un nombre en pourcentage :

Console.log((0.45).toLocaleString("ru-RU",(style:"percent"))); //"45 %"

Divisez le nombre en chiffres (propriété useGrouping) :

Console.log((125452.32).toLocaleString("ru-RU",(useGrouping:true))); //"125 452.32"

Imprimer un nombre avec un certain nombre de chiffres (2) après la virgule :

Console.log((1240.4564).toLocaleString("ru-RU",(minimumFractionDigits:2, maximumFractionDigits:2))); //"1240.46"

Comparaison des nombres

Les opérateurs suivants sont utilisés pour comparer des nombres en JavaScript : == (égal à), != (différent de), > (supérieur à),< (меньше), >= (supérieur ou égal),<= (меньше или равно).

Par exemple, comparons deux nombres :

Console.log(2>3); //faux console.log(5>=3); //vrai

Lorsque l'on compare des chiffres avec partie fractionnaire il faut tenir compte des erreurs qui peuvent survenir lors de ces calculs.

Par exemple, en JavaScript, la somme des nombres (0,2 + 0,4) n'est pas égale à 0,6 :

Console.log((0.2+0.4)==0.6); //FAUX

Des erreurs se produisent parce que tous les calculs sont informatiques ou autres appareil électronique produit dans le système à 2 chiffres. Ceux. avant d'effectuer toute action, l'ordinateur doit d'abord convertir les nombres présentés dans l'expression au système à 2 nombres. Mais aucun nombre décimal fractionnaire ne peut être représenté exactement dans le 2e système de numération.

Par exemple, le nombre 0,25 10 est converti en binaire exactement.

0,125 × 2 = 0,25 | 0 0,25 × 2 = 0,5 | 0 0,5 × 2 = 1 | 1 0,125 10 = 0,001 2

Par exemple, le nombre 0,2 10 ne peut être converti dans le système 2 qu'avec une certaine précision :

0,2 × 2 = 0,4 | 0 0,4 × 2 = 0,8 | 0 0,8 × 2 = 1,6 | 1 0,6 × 2 = 1,2 | 1 0,2 × 2 = 0,4 | 0 0,4 × 2 = 0,8 | 0 0,8 × 2 = 1,6 | 1 0,6 × 2 = 1,2 | 1 0,2 × 2 = 0,4 | 0 0,4 × 2 = 0,8 | 0 0,8 × 2 = 1,6 | 1 0,6 × 2 = 1,2 | 1 ... 0,2 10 = 0,001100110011... 2

Par conséquent, ces erreurs affecteront le calcul de la somme de deux nombres et les résultats de la comparaison. Ceux. il s'avère qu'en fait JavaScript verra cette entrée comme suit :

0.6000000000000001==0.6

Lors du calcul ou de l'affichage de nombres avec une partie fractionnaire, vous devez toujours spécifier la précision avec laquelle cela doit être fait.

Par exemple, comparez des nombres jusqu'à 2 décimales à l'aide des méthodes toFixed() et toPrecision() :

//méthode toFixed() console.log((0.2+0.4).toFixed(2)==(0.6).toFixed(2)); //true //méthode toPrecision() console.log((0.2+0.4).toPrecision(2)==(0.6).toPrecision(2)); //vrai

Opérations mathématiques de base

JavaScript a les opérateurs mathématiques suivants : + (addition), - (soustraction), * (multiplier), / (division), % (reste de la division), ++ (augmenter la valeur de 1), -- (diminuer la valeur de 1 ).

6+3 //9 6-3 //3 6*3 //18 6/3 //2 6%3 //0, soit 6:3=2 => 6-3*2 => rest(0) 5%2 //1, soit 5:2=2(.5) => 5-2*2 => rest(1) 7.3%2 //1.3, soit 7.3:2=3(.65) => 7.3-2*3 => rest(1.3) //le signe du résultat de l'opération % est égal au signe de la première valeur -9%2.5 //-1.5, soit 9:2.5=3(.6) => 9-2.5*3 => rest(1.5) -9%-2.5 //-1.5, soit 9:2.5=3(.6) => 9-2.5*3 => rest(1.5) -2%5 //-2, soit 2:5=0(.4) => 2-5*0 => reste(2) x = 3 ; journal de la console (x++); //affiche 3, puis définit y sur 4 console.log(x); //4x = 3 ; journal de la console(++x); //définit 4 et affiche x = 5 ; journal de la console (x--); //sorties 5, y définit alors 4 console.log(x); //4x = 5 ; journal de la console (--x); //sets to 4 and outputs De plus, il existe des opérateurs combinés en JavaScript : x+=y (x=x+y), x-=y (x=x-y), x*=y (x=x*y), x/= y (x=x/y), x%=y (x=x%y). x=3 ; y=6 ; x+=y ; journal de la console(x); //9x = 3 ; y=6 ; x-=y ; journal de la console(x); //-3 x = 3 ; y=6 ; x*=y ; journal de la console(x); //18 x = 3 ; y=6 ; x/=y ; journal de la console(x); //0,5 x = 3 ; y=6 ; x%=y ; journal de la console(x); //3