Числа в JavaScript

Статья, в которой рассмотрим основные моменты при работе с числами в JavaScript. Познакомимся с объектом Number, с основными математическими действиями, с тем как преобразовать число в строку и обратно, а также разберём много других интересных вещей.

Объект Number

В языке JavaScript числа не разделяются на целые и дробные. Для хранения чисел используется 64 битный формат с плавающей точкой IEEE 754-2008. Представления чисел, а также возможность работы с ними в JavaScript осуществляется посредством объекта Number. Данный объект кроме чисел содержит и специальные значения: Infinity (положительная бесконечность), -Infinity (отрицательная бесконечность), NaN (не число).

Значение Infinty и -Infinity получаются при делении некоторого числа на 0. Т.е. в языке JavaScript не возникает ошибка при делении числа на 0, вместо этого возвращается специальное значение.

console.log(5/0); // Infinity
console.log(-5/0); // -Infinity

Проверить является ли число конечным позвляет метод isFinite():

console.log(isFinite(73)); // true
console.log(isFinite(Infinity)); // false 
console.log(isFinite(NaN)); // false 

NaN предназначено для представления значения в JavaScript, которое является не числом. Таким образом JavaScript возвращает ошибки во время числовых операций.

console.log(5*'Hi'); //NaN
console.log(5*'2,5'); //NaN
console.log(5*'25px'); //NaN

При этом очень интересным является то, что значение NaN в JavaScript не равно ни чему включая себя.

// проверим равно ли NaN NaN
console.log(NaN==NaN); // false
console.log(NaN===NaN); //false

Проверить является ли значение числом или его можно привести к числу (аналогично унарному оператору +) позволяет метод isNaN().

console.log(isNaN(NaN)); //true
console.log(isNaN(25.5)); //true
console.log(isNaN('25.5')); //true
console.log(isNaN('25px')); //false

Записывать числа можно не только в десятичной системе счисления, но и в шестнадцатиричной системе счисления (0x) и эскпоненциальной форме:

5 //целое число
5.25 //дробное число
0xB8 //число 184 в шестнадцатиричной форме
3.2e3 //число 3200 в экспоненциальной форме
1.5e-2 //число 0.015 в экспоненциальной форме

Основные математические операции

В JavaScript существуют следующие математические операторы: + (сложение), - (вычитание), * (умножение), / (деление), % (остаток от деления), ++ (увелить значение на 1), -- (уменьшить значение на 1).

6+3 //9
6-3 //3
6*3 //18
6/3 //2
6%3 //0, т.е. 6:3=2 => 6-3*2 => ост(0)
5%2 //1, т.е. 5:2=2(.5) => 5-2*2 => ост(1)
7.3%2 //1.3, т.е. 7.3:2=3(.65) => 7.3-2*3 => ост(1.3)
//знак результата операции % равен знаку первого значения
-9%2.5 //-1.5, т.е. 9:2.5=3(.6) => 9-2.5*3 => ост(1.5)
-9%-2.5 //-1.5, т.е. 9:2.5=3(.6) => 9-2.5*3 => ост(1.5)
-2%5 //-2, т.е. 2:5=0(.4) => 2-5*0 => ост(2)
x = 3;
console.log(x++); //выводит 3, у уже потом устанавливает 4
console.log(x); //4
x = 3;
console.log(++x); //устанавливает 4 и выводит
x = 5;
console.log(x--); //выводит 5, у уже потом устанавливает 4
console.log(x); //4
x = 5;
console.log(--x); //устанавливает 4 и выводит 
Кроме этого в 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;
console.log(x); //9
x = 3;
y = 6;
x-=y;
console.log(x); //-3
x = 3;
y = 6;
x*=y;
console.log(x); //18
x = 3;
y = 6;
x/=y;
console.log(x); //0.5
x = 3;
y = 6;
x%=y;
console.log(x); //3

Как в Javascript преобразовать строку в число

При выполнение арифметических действий, а также в математических функциях Javascript автоматически переводит строку или другой формат данных в число, если это конечно возможно.

console.log(20*'5'); //100
Math.pow('2',5); //32

Если необходимо явно преобразовать некоторое значения в число, то можно воспользоваться одним из следующих способов:

1. Воспользоваться знаком плюс '+', который необходимо указать перед значением.

console.log(+'7.35'); //7.35

Этот способ пенебрегает пробельными символами в начале и конце строки, а также \n (переводом строки).

console.log(+'  7.35 '); //7.35
console.log(+'7.35 \n '); //7.35

Используя данный способ необходимо обратить внимание на то, что пустая строка или строка, состоящая из пробелов и \n, переводится в число 0. Кроме этого она также преобразует тип данных null и логические значения к числу.

console.log(+null); //0
console.log(+true); //1
console.log(+false); //0
console.log(+'   '); //0

2. Метод parseInt(value). Он преобразует значение value в целое число. В отличие от использования унарного оператора +, данный метод позволяет преобразовать строку в число, в которой некоторые символы не являются цифровыми. Данный метод работает следующим образом: он проверяет каждый символ строки, начиная с первого. Как только он встречает символ не являющийся цифровым, он останавливает свою работу и возвращает полученное число.

console.log(parseInt('18px')); //18
console.log(parseInt('33.3%')); //33

Кроме этого данный метод позволяет работать с различными системами счисления (двоичной, восьмеричной, шестнадцатиричной и др.). Указать систему счисления можно посредством 2 параметра.

console.log(parseInt('101',2)); //5
console.log(parseInt('B5',16)); //181

Шестнадцатиричное число также можно указать с помощью префикса 0x:

console.log(parseInt('0xB5')); //181

3. Метод parseFloat(value). Метод parseFloat аналогичен parseInt, но в отличии работает с дробными числами.

console.log(parseFloat('33.3%')); //33.3

Метод parseFloat в отличие от parseInt не позволяет работать с системами счисления.

Преобразование числа в строку

Перевести число в строку можно с помощью метода toString().

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

Метод toString() позволяет также задать систему счисления в которую необходимо перевести число:

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

Проверка на число

Определить является ли некоторое значение числом можно используя один из следующих способов:

1. Метод (функцию) isNaN().

isNaN(5); //false, т.к. значение является числом
isNaN('20'); //false, т.к. значение можно преобразовать в число
isNaN('20.5'); //false, т.к. значение можно преобразовать в число
isNaN('20px'); //true, т.к. 20px - это не число
isNaN('  '); //false, т.к. пробел или неcколько пробелов преобразуется к 0
isNaN(null); //false, т.к. значение null тоже преобразуется к 0
isNaN(true); //false, т.к. значение true преобразуется к 1
isNaN(false); //false, т.к. значение false преобразуется к 0

Метод isNaN(value) возвращает true - если значение value не является числом и false, если значение value является числом или его можно перевести в число. Но с методом isNaN надо быть внимательным, т.к. он имеет такие же ограничения как при использовании унарного оператора плюс (+).

2. Валидацию на число можно осуществить используя следующее выражение:

if (!isNaN(parseFloat(value)) && isFinite(parseFloat(value))) {
  //value - это число
};

В виде функции:

// функция
function isNumeric(value) {
  return !isNaN(parseFloat(value)) && isFinite(parseFloat(value));
}
// использование
console.log(isNumeric('12px')); //true

Этот способ позволяет определить является ли указанное значение числом. В отличии от первого способа, он не считает числом пустую строку, строку из пробелов, значение null, Infinity, -Infinity, true и false.

3. В ECMAScript 6 появился метод Number.isInteger(value), который позволяет определить, является ли указанное значение целым числом.

Выполним проверку на целое число с помощью метода isInteger():

Number.isInteger('20'); //false, т.к. данный метод не выполняет перевод строки в число
Number.isInteger(20); //true, т.к. данное значение является числом

4. Проверить является ли значение числом можно используя следующую функцию:

// функция которая проверяет является ли значение числом
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

Эта функция определяет имеет ли указанное значение тип Number, а также не принадлежит ли оно к одному из специальных значений Infinity, -Infinity и NaN. Эсли это так, то данная функция возвращает значение true.

5. Если используете библиотеку jQuery, то определить ли является значение числом или нет можно с помощью следующего метода (isNumeric(value)):

// использование функций для проверки текстовых значений
$.isNumeric('12'); //true
$.isNumeric(parseFloat('12px')); //true
$.isNumeric(''); //false

Чётные и нечётные числа

Проверить является ли число чётным или нечётным можно посредством следующих функций:

// Функция для проверки числа на чётность
function isEven(n) {
  return n % 2 == 0;
}
// Функция для проверки числа на нечётность
function isOdd(n) {
  return Math.abs(n % 2) == 1;
}

Но перед тем как проводить такую проверку желательно убедиться что указанное значение является числом:

value = 20;
if (Number.isInteger(value)) {
  if (isEven(value)) {
    console.log('Число ' + value.toString() + ' - чётное');
  }
} 

Простые числа в Javascript

Рассмотрим пример в котором выведем с помощью Javascript простые числа от 2 до 100.

// Функция, которая проверяет является ли число простым
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);

Округление числа в Javascript

Округлить дробное число до целого значения в JavaScript можно различными способами.

1. Используя специально предназначенные для этого методы Math.floor, Math.ceil и Math.round. Метод Math.floor округляет дробное число до ближайшего целого вниз, т.е. попросту отбрасывает дробную часть. Math.ceil скругляет дробное число до ближайшего целого вверх. Math.round округляет число вверх или вниз в зависимости от значения дробной части. Если дробная часть больше или равно 0.5, то вверх, иначе скруление осуществляется вниз.

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

2. С помощью метода toFixed(точность). Данный метод округляет дробную часть числа до заданной точности. Результат округления возвращает в виде строки.

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

Если знаков после запятой для формирования указанной точности числа не хватает, то оно дополняется нулями.

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

3. Посредством метода toPrecision(точность). Данный метод представляет число с указанной точностью. При этом он может округлить не только дробную, но и целую часть числа. Полученное число данный метод может представить в зависимости от результата с фиксированной запятой или в экспоненциальной форме.

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. Используя логические операторы НЕ или ИЛИ.

//посредством двойного логического отрицания
console.log(~~7.9); //7
// посредством использования логического ИЛИ с нулём:
console.log(7.9^0); //7

Целая и дробная часть числа

Получить целую часть числа можно используя метод Math.floor() и parseInt():

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

Получить дробную часть числа можно воспользовавшимся оператором процент (%). Данный оператор возвращает остаток, который будет получен от деления первого числа на второе. В данном случае в качестве 2 числа необходимо использовать 1.

console.log(7.21%1); // 0.20999999999999996
// с точностью до 2 знаков после запятой
console.log((7.21%1).toFixed(2)); // "0.21"

Кроме этого дробную часть можно получить также с помощью вычислений:

var number = 7.21;
var fractionNumber = number - Math.floor(Math.abs(number));
console.log(fractionNumber); // 0.20999999999999996

Делится ли число нацело

Определить делится ли число нацело можно используя оператор процента:

var number = 9;
// если остаток от деления числа number на 3 равен 0, то да, иначе нет
if (number%3==0) {
  console.log ("Число " + number + " делится на 3");
} else {
  console.log ("Число " + number + " не делится на 3");
}

Форматирование чисел

В JavaScript отформатировать вывод числа в соответствии с региональными стандартами (языковыми настройками операционной системы) позволяет метод toLocaleString().

Например, выполним форматирование числа в соответствии с региональными стандартами, которые установлены в системе по умолчанию:

var number = 345.46;
console.log(number.toLocaleString()); //"345,46"

Например, выполним форматирование числа в соответствии с региональными стандартами России (ru):

console.log((108.1).toLocaleString("ru-RU")); //"108,1"

Данный метод можно также использовать для форматирования числа в виде валюты:

console.log((2540.125).toLocaleString("ru-RU",{style:'currency', currency:'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 €"

Представление числа в виде процентов:

console.log((0.45).toLocaleString("ru-RU",{style:'percent'})); //"45 %"

Разбить число на разряды (свойство useGrouping):

console.log((125452.32).toLocaleString("ru-RU",{useGrouping:true})); //"125 452,32"

Вывести с число с определённым количеством цифр (2) после запятой:

console.log((1240.4564).toLocaleString("ru-RU",{minimumFractionDigits:2, maximumFractionDigits:2})); //"1 240,46"

Сравнение чисел

Для сравнения чисел в JavaScript используются следующие операторы: == (равно), != (не равно), > (больше), < (меньше), >= (больше или равно), <= (меньше или равно).

Например, сравним два числа:

console.log(2>3); //false
console.log(5>=3); //true

При сравнении чисел с дробной частью необходимо учитывать погрешности, которые могут возникать во время этих вычислений.

Например, в JavaScript сумма чисел (0.2 + 0.4) не равна 0.6:

console.log((0.2+0.4)==0.6); //false

Погрешности происходят потому что все вычисления компьютер или другое электронное устройство производит в 2 системе счисления. Т.е. перед тем как выполнить какие-то действия компьютер сначала должен преобразовать представленные в выражении числа в 2 систему счисления. Но, не любое дробное десятичное число можно представить в 2 системе счисления точно.

Например, число 0.2510 в двоичную систему преобразуется точно.

0.125 × 2 = 0.25 | 0
0.25 × 2 = 0.5 | 0
0.5 × 2 = 1 | 1

0.12510 = 0.0012

Например, число 0.210 можно преобразовать в 2 систему только с определённой точностью:

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.210 = 0.001100110011...2

В результате эти погрешности скажутся при вычисления суммы двух чисел и результатах сравнения. Т.е. получится что на самом деле JavaScript будет видет эту запись следующим образом:

0.6000000000000001==0.6

При вычислениях или отображении чисел с дробной частью необходимо всегда указывать точность, с которой это необходимо делать.

Например, сравнить числа до 2 знаков после запятой используя методы toFixed() и toPrecision():

//метод toFixed()
console.log((0.2+0.4).toFixed(2)==(0.6).toFixed(2)); //true
//метод toPrecision()
console.log((0.2+0.4).toPrecision(2)==(0.6).toPrecision(2)); //true


   JavaScript и jQuery 0    1380 0

Комментарии (0)

    Вы должны авторизоваться, чтобы оставлять комментарии.