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

var x = 2;  // целое число
var y = 3.14;  // число с плавающей точкой
var z = 0xff;  // шестнадцатеричное число

Очень большие числа могут быть представлены в экспоненциальной записи, например, 6.02e+23 (аналогично 6.02×1023).

var x = 1.57e4;  // тоже самое 15700
var y = 4.25e+6;  // тоже самое 4.25e6 или 4250000
var z = 4.25e-6;  // тоже самое 0.00000425

Самое большое безопасное целое число в JavaScript — 9007199254740991 (253-1), тогда как самое маленькое безопасное целое число -9007199254740991 (-(253-1)).

Числа также могут быть представлены в шестнадцатеричной записи. Шестнадцатеричные числа с префиксом 0x. Они обычно используются для представления цветов. Вот пример:

var x = 0xff;  // тоже самое 255
var y = 0xb4;  // тоже самое 180
var z = 0x00;  // тоже самое 0

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

Работа с числами и строками

Как вы знаете из предыдущих глав, оператор + используется как для сложения, так и для объединения. Таким образом, выполнение математических операций над числами и строками может дать интересные результаты. Следующий пример покажет вам, что происходит, когда вы добавляете числа к строкам:

var x = 10;
var y = 20;
var z = "30";

// Добавление числа к числу, результатом будет сумма чисел
console.log(x + y); // 30

// Если добавить строку к строке, результатом будет конкатенация строк
console.log(z + z); // '3030'

// Если добавить число к строке, результатом будет конкатенация строк
console.log(x + z); // '1030'

// Если добавить строку к числу, результатом будет конкатенация строк
console.log(z + x); // '3010'

// Если складывать строки и числа, результатом будет конкатенация строк
console.log("The result is: " + x + y); // 'The result is: 1020'

// Добавление чисел и строк, расчет выполняется слева направо
console.log(x + y + z); // 'The result is: 3030'

Если вы внимательно посмотрите на приведенный выше пример, вы обнаружите, что результатом последней операции является не просто конкатенация строк, поскольку операторы с одинаковым приоритетом вычисляются слева направо. Вот почему, поскольку переменные x и y являются числами, они складываюся первыми, тогда результат объединяется с переменной z, которая является строкой равен 30 + "30" = "3030".

Но если вы выполните другие математические операции, такие как умножение, деление или вычитание, результат будет другим. JavaScript автоматически преобразует числовые строки (то есть строки, содержащие числовые значения) в числа во всех числовых операциях, как показано в следующем примере:

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

Более того, если вы попытаетесь умножить или разделить числа со строками, которые не являются числовыми, он возвращает NaN (не число). Кроме того, если вы используете NaN в математической операции, результатом также будет 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

// Добавление NaN к числу
console.log(x + z); // NaN
						
// Добавление NaN к строке
console.log(y + z); // fooNaN

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

Бесконечность представляет число, слишком большое в JavaScript для обработки. В JavaScript есть специальные ключевые слова Infinity и -Infinity для представления положительной и отрицательной бесконечности соответственно. Например, деление на 0 возвращает Infinity, как показано ниже:

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

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

Бесконечность — это специальное значение, которое представляет математическую бесконечность , которая больше любого числа. Оператор typeof возвращает число для значения Infinity.

Как избежать проблем с плавающей точкой

Иногда операции с числами с плавающей точкой дают неожиданные результаты, как показано здесь:

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

Как видите, результат равен 0.30000000000000004, а не 0.3. Эта разница называется ошибкой представления или ошибкой округления. Это происходит потому, что JavaScript и многие другие языки используют двоичную форму для внутреннего представления десятичных чисел. К сожалению, большинство десятичных дробей не могут быть представлены точно в двоичной форме, поэтому возникают такие ситуации.

Чтобы избежать этой проблемы, вы можете использовать такое решение:

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

JavaScript округляет числа с плавающей запятой до 17 цифр, что является достаточной точностью в большинстве случаев. Кроме того, в JavaScript целые числа (числа без дробных частей или экспоненциальная запись) имеют точность до 15 цифр, как показано в следующем примере:

var x = 999999999999999;
console.log(x); // 999999999999999

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

Выполнение операций над числами

JavaScript предоставляет несколько свойств и методов для выполнения операций над числовыми значениями. Как вы уже знаете из предыдущих глав, в JavaScript примитивные типы данных могут действовать как объекты, когда вы ссылаетесь на них с помощью нотации доступа к свойству (то есть точечной нотации).

В следующих разделах мы рассмотрим методы, которые используются чаще всего.

Разбор целых чисел из строк

Метод parseInt() можно использовать для анализа целого числа из строки. Этот метод особенно удобен в ситуациях, когда вы имеете дело с такими значениями, как единицы CSS, например 50px, 12pt и т. д., И вы хотите извлечь из него числовое значение.

Если метод parseInt() встречает символ, который не является числовым в указанной базе, он прекращает синтаксический анализ и возвращает целочисленное значение, проанализированное до этого символа. Если первый символ не может быть преобразован в число, метод вернет NaN (не число).

Начальные и конечные пробелы разрешены. Вот пример:

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

Метод parseInt() усекает числа до целочисленных значений, но его не следует использовать вместо метода Math.floor().

Точно так же вы можете использовать метод parseFloat() для анализа числа с плавающей запятой из строки. Метод parseFloat() работает так же, как и метод parseInt(), за исключением того, что он извлекает как целые числа, так и числа с десятичными знаками.

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

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

Метод toString() можно использовать для преобразования числа в его строковый эквивалент. Этот метод дополнительно принимает целочисленный параметр в диапазоне от 2 до 36, указывающий основание, используемое для представления числовых значений. Вот пример:

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'

Форматирование чисел в экспоненциальной записи

Вы можете использовать метод toExponential() для форматирования или представления числа в экспоненциальной записи. Этот метод дополнительно принимает целочисленный параметр, указывающий количество цифр после десятичной точки. Кроме того, возвращаемое значение является строкой, а не числом. Вот пример:

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

Экспоненциальная запись полезна для представления чисел, которые либо очень большие, либо очень маленькие по величине. Например, 62500000000 можно записать как 625e + 8 или 6.25e + 10.

Форматирование чисел в фиксированные десятичные дроби

Вы можете использовать метод toFixed(), когда хотите отформатировать число с фиксированным числом цифр справа от десятичной точки. Значение, возвращаемое этим методом, является строкой и имеет точно указанное количество цифр после десятичной точки. Если параметр digits не указан или опущен, он обрабатывается как 0. Вот пример:

var x = 72.635;

console.log(x.toFixed());  // '73' (note rounding, no fractional part)
console.log(x.toFixed(2));  // '72.64' (note rounding)
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' (since 1.58e-4 is equal to 0.000158)

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

Если вы хотите получить подходящую форму числа, вы можете вместо этого использовать метод toPrecision(). Этот метод возвращает строку, представляющую число с заданной точностью.

Если точность достаточно велика, чтобы включить все цифры целочисленной части числа, то число форматируется с использованием записи с фиксированной запятой. В противном случае число форматируется с использованием экспоненциальной записи. Параметр точности является необязательным. Вот пример:

var x = 6.235;

console.log(x.toPrecision());  // '6.235'
console.log(x.toPrecision(3));  // '6.24' (note rounding)
console.log(x.toPrecision(2));  // '6.2'
console.log(x.toPrecision(1));  // '6'

var y = 47.63;
console.log(y.toPrecision(2)); // '48' (note rounding, no fractional part)

var z = 1234.5;
console.log(z.toPrecision(2));  // '1.2e+3'

Поиск наибольших и наименьших возможных чисел

С объектом Number также связано несколько свойств. Свойства Number.MAX_VALUE и Number.MIN_VALUE объекта Number представляют самые большие и самые маленькие (самые близкие к нулю, не самые отрицательные) возможные положительные числа, которые может обрабатывать JavaScript. Они являются константами, и их фактические значения составляют 1.7976931348623157e+308 и 5e-324 соответственно.

Число, которое выходит за пределы диапазона возможных чисел, представлено константой Number.POSITIVE_INFINITY или Number.NEGATIVE_INFINITY. Вот пример:

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

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

Похожие посты

Руководство по сортировке массивов в JavaScript

Сортировка — обычная задача при работе с массивами. Она будет использоваться, например, если вы захотите отобразить названия городов или регионов в алфавитном порядке. JavaScript массив (array) имеет встроенный метод sort() для сортировки элементов массива в алфавитном порядке. Следующий пример демонстрирует, как это работает: Реверсирование массива Вы можете использовать метод reverse(), чтобы изменить порядок элементов массива…

Руководство по массивам в JavaScript

Массивы — это сложные переменные, которые позволяют нам хранить группы значений под одним именем переменной. Массивы JavaScript могут хранить любое допустимое значение, включая строки, числа, объекты, функции и даже другие массивы, что позволяет создавать более сложные структуры данных, такие как массив объектов или массив массивов. Предположим, вы хотите сохранить название цветов в своем коде JavaScript….

Руководство по работе с атрибутами DOM в JavaScript

Атрибуты — это специальные слова, используемые внутри начального тега HTML-элемента для управления поведением тега или предоставления дополнительной информации о теге. JavaScript предоставляет несколько методов для добавления, удаления или изменения атрибутов HTML-элемента. В этом разделе мы узнаем об этих методах подробно. Получение значения атрибута элемента Метод getAttribute() используется для получения текущего значения атрибута элемента. Если указанный…

Насколько публикация полезна?

Нажмите на звезду, чтобы оценить!

Средняя оценка 5 / 5. Количество оценок: 1

Оценок пока нет. Поставьте оценку первым.