Как проверить является ли переменная числом js

Rukovodstvo

статьи и идеи для разработчиков программного обеспечения и веб-разработчиков.

JavaScript: проверьте, является ли переменная числом

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

Время чтения: 3 мин.

Вступление

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

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

Строки, содержащие числа вроде «10», не принимаются. В JavaScript специальные значения, такие как NaN , Infinity и -Infinity , тоже являются числами, однако мы будем игнорировать эти значения.

С учетом этих требований лучше всего использовать функцию isFinite() из встроенного объекта Number

Однако разработчики обычно использовали для этой цели другие функции, в частности Number.isNaN() и функцию typeof()

Создадим несколько переменных для тестирования:

Использование функции Number.isFinite ()

Функция Number.isFinite() проверяет, является ли переменная числом, но также проверяет, является ли это конечным значением. Следовательно, он возвращает false для чисел NaN , Infinity или -Infinity .

Давайте проверим это на переменных, которые мы определили выше:

Это именно то, что мы хотели. Специальные нефинитные числа игнорируются, как и любые переменные, не являющиеся числовыми.

Если вы хотите проверить, является ли переменная числом, лучше всего использовать Number.isFinite() .

Использование функции Number.isNaN ()

Стандартный объект Number имеет метод isNaN() Он принимает один аргумент и определяет, равно ли его значение NaN . Поскольку мы хотим проверить, является ли переменная числом, мы будем использовать оператор not ! , в наших чеках.

Теперь проверим, могут ли оператор not и Number.isNaN() фильтровать только числа:

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

Использование функции typeof ()

Функция typeof() — это глобальная функция, которая принимает переменную или значение в качестве аргумента и возвращает строковое представление своего типа. Всего у JavaScript 9 типов:

• undefined
• boolean
• number
• string
• bigint
• symbol
• object
• null ( typeof() отображается как объект)
• function (особый тип объекта)

Чтобы проверить, является ли переменная числом, нам просто нужно проверить, является ли значение, возвращаемое typeof() , "number" . Давайте попробуем это на тестовых переменных:

Функция typeof() работает намного лучше, чем Number.isNaN() . Он правильно определяет, что строковая переменная, null и undefined не являются числами. Однако он возвращает true для NaN и Infinity .

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

Заключение

В этой статье мы узнали, как проверить, является ли переменная в JavaScript числом. Функция Number.isNaN() подходит только в том случае, если мы знаем, что наша переменная является числом, и нам нужно проверить, является ли она конкретно NaN или нет.

Функция typeof() подходит, если ваш код может работать с NaN , Infinity или -Infinity а также с другими числами.

Работа с числами в JavaScript

В JavaScript в отличие от некоторых других языков имеется только один числовой тип number . В нём используется формат чисел с плавающей точкой двойной точности по стандарту IEEE 754.

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

Пример записи чисел:

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

Узнать какой тип данных содержит переменная можно с помощью typeof :

Кроме чисел, формат number также содержит специальные числовые значения:

• положительную бесконечность: Infinity ;
• отрицательную бесконечность: -Infinity ;
• не число: NaN .

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

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

NaN возвращается, когда интерпретатор JavaScript не может вычислить математическую операцию. Например, когда мы попытаемся от числа 3 отнять строку ‘1rem’ .

Числовой тип number является примитивным типом. Но при этом к числам можно применять методы как к объектам. Это осуществляется посредством обёртки Number . Она содержит дополнительные значения и методы для работы с числами:

В этом примере мы применили к примитивному типу данных метод toString() как к объекту. При вызове метода числа автоматически оборачиваются в обёртку Number() , а у обёртки имеется метод toString() . Этот метода преобразует число в строку. Этот пример показывает, что числа ведут себя как объекты, хотя на самом деле ими не являются.

При этом использовать обёртку Number напрямую для создания чисел крайне не рекомендуется:

В этом примере num1 и num2 имеют разные типы.

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

Кстати, на самом деле в JavaScript 2 числовых типа данных. Второй тип был добавлен в спецификацию ECMAScript 2020 (11 редакция). Называется он bigint . Этот тип предназначен для представления очень больших целых чисел и на практике используется только для чисел, которые слишком велики для представления с помощью number .

Ограничения по максимальному размеру и точность чисел

В JavaScript при сложении чисел с дробной частью можно получить не то число, которое ожидали.

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

Например, число 0.25₁₀ в двоичную систему преобразуется точно:

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

В результате эти погрешности скажутся при вычислении выражений и это нужно учитывать при написании кода в JavaScript.

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

Например, перепишем код, приведённый выше с определённой точностью используя метод toFixed :

В этом примере, мы сначала с использованием метода toFixed(2) получили строковое представление числа, которое является результатом сложения чисел 0.2 и 0.4 , округленных до 2 знаков после точки. После этого с помощью метода parseFloat преобразовали текст в число и полученное значение присвоили переменной num .

Потеря точности может быть связана также с целыми числами, которые выходят за пределы безопасного диапазона:

Получить минимальное и максимальное безопасное целое число можно с помощью констант:

Теперь, если проверим число, приведённое выше, то увидим что оно больше безопасного:

Кроме этого, проверить находится ли целое число в пределах безопасного диапазона можно посредством метода isSafeInteger :

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

В JavaScript имеются следующие математические операторы:

• сложение: + ;
• вычитание: — ;
• умножение: * ;
• деление: / ;
• остаток от деления: % ;
• возведение в степень: ** ;
• увеличение значения переменной на 1: ++ ;
• уменьшение значения переменной на 1: — .

Операторы ++ и — можно располагать как перед переменной, так и после неё:

Когда мы располагаем оператор ++ после переменной num , то сначала возвращается значение переменной, и только потом увеличивается её значение на 1 .

В другом случае, когда оператор ++ идёт до переменной num, то сначала увеличивается значение этой переменной на 1 , и только потом возвращается её значение.

Оператор — действует аналогично:

Кроме этого имеются комбинированные операторы: += , -= , *= , /= , %= и **= :

Для сравнения чисел в JavaScript используются следующие операторы :

• равенство с учетом типа: === , с попыткой преобразования: == ;
• не равенство с учетом типа: !== , с попыткой преобразования: != ;
• больше: > , больше или равно: >= ;
• меньше: < , меньше или равно: <= .

При сравнении чисел необходимо учитывать точность:

Способ сравнить число до двух знаков после плавающей точки:

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

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

Явно привести строку в число можно разными способами:

1.1. Использовать унарный оператор + , который необходимо расположить перед значением.

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

При использовании оператора + обратите внимание, что » , ‘ ‘ и ‘\n’ преобразуется в число 0 . Значение null и логические значения приводятся к следующим числам:

1.2. С помощью глобальной функции parseInt() или метода Number.parseInt() . Они предназначены для преобразования значения, переданного им на вход, в целое число . В отличие от использования унарного оператора + , эти методы позволяют преобразовать строку в число, в которой не все символы являются цифровыми . Эти методы преобразовывают строку, начиная с первого символа. И как только встречают символ, не являющийся цифровым, они останавливают дальнейший разбор строки и возвращают полученное число:

Эти функции могут работать с разными системами счисления (двоичной, восьмеричной, десятичной, шестнадцатеричной). Основание системы счисления передаётся в вызов parseInt() или Number.parseInt() в качестве второго аргумента.

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

1.3. Для преобразования строки в число с плавающей точкой в JavaScript имеются методы parseFloat() и Number.parseFloat() . Друг от друга они ничем не отличаются, просто последний был добавлен в язык немного позднее:

Метод parseFloat в отличие от parseInt всегда рассматривает строку как число в десятичной системе счисления. Указать ему другую систему счисления нельзя.

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

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

Дополнительно можно передать систему счисления с учётом которой необходимо явно привести число к строке:

Проверки: isFinite, isNaN, isInteger

Этот метод позволяет проверить, является ли значение конечным числом. В качестве результата isFinite возвращает true , если значение является конечным числом. В противном случае false :

Кроме Number.isFinite в JavaScript имеется также глобальная функция isFinite . Она в отличие от Number.isFinite выполняет проверку с учетом принудительное приведение переданного ей аргумента к числу:

Этот метод объекта Number предназначена для определения того, является ли значение NaN . Если это так, то isNaN возвращает true . В противном случае – false :

Кроме Number.isNaN имеется также глобальный метод isNaN , он выполняет проверку с учетом приведения указанного типа данных к числу:

3. Как проверить, является ли значение числом?

В JavaScript имеется метод, который позволяет определить, является ли значение целым числом. Называется он isInteger :

В этом примере для ’20’ мы получили false , т.к. данное значение является строкой.

Если вам нужно проверить является ли значение числом, при это не важно целям или с плавающей точкой, то можно написать, например, вот такую функцию:

Эта функция в зависимости от результата возвращает true или false .

После этого её можно использовать для проверки следующим образом:

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

При проверке строки ’20px’ мы получили true , потому что метод parseFloat(’20px’) возвращает нам число 20 .

Округление

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

1. С помощью специальных, предназначенных для этой задачи, методов:

• Math.floor – до ближайшего целого в меньшую сторону;
• Math.ceil – до ближайшего целого в большую сторону;
• Math.round – в большую сторону, если дробная часть >= 0.5; иначе в меньшую сторону;
• Math.trunc – путём отбрасывания дробной части;

2. Посредством toFixed() .

Этот метод округляет дробную часть числа до заданной точности, но результат возвращает в виде строки:

3. Через toPrecision() .

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

4. С использованием логического оператора

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

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

В соответствии с настройками установленными в системе:

Явно указав регион:

Для отображения денежных величин:

В процентном формате:

С разделением групп разрядов (свойство useGrouping ):

С указанием числа десятичных знаков:

Примеры

1. Пример, в котором напишем две функции для проверки числа соответственно на четность и не четность . А затем используем их в коде:

2. Пример на JavaScript в котором получим простые числа от 2 до 100:

3. Пример, в котором вычислим целую и дробную часть числа :

В этом примере, получение целой части числа выполняется посредством Math.floor() , а дробной части с помощью получения остатка от деления на 1 или вычитания числа от его целой части.

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

Числа

В данной главе мы рассмотрим только первый тип чисел: числа типа number . Давайте глубже изучим, как с ними работать в JavaScript.

Способы записи числа

Представьте, что нам надо записать число 1 миллиард. Самый очевидный путь:

Но в реальной жизни мы обычно опускаем запись множества нулей, так как можно легко ошибиться. Укороченная запись может выглядеть как "1млрд" или "7.3млрд" для 7 миллиардов 300 миллионов. Такой принцип работает для всех больших чисел.

В JavaScript можно использовать букву "e" , чтобы укоротить запись числа. Она добавляется к числу и заменяет указанное количество нулей:

Другими словами, "e" производит операцию умножения числа на 1 с указанным количеством нулей.

Сейчас давайте запишем что-нибудь очень маленькое. К примеру, 1 микросекунду (одна миллионная секунды):

Записать микросекунду в укороченном виде нам поможет "e" .

Если мы подсчитаем количество нулей 0.000001 , их будет 6. Естественно, верная запись 1e-6 .

Другими словами, отрицательное число после "e" подразумевает деление на 1 с указанным количеством нулей:

Шестнадцатеричные, двоичные и восьмеричные числа

Шестнадцатеричные числа широко используются в JavaScript для представления цветов, кодировки символов и многого другого. Естественно, есть короткий стиль записи: 0x , после которого указывается число.

Не так часто используются двоичные и восьмеричные числа, но они также поддерживаются 0b для двоичных и 0o для восьмеричных:

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

toString(base)

Метод num.toString(base) возвращает строковое представление числа num в системе счисления base .

base может варьироваться от 2 до 36 (по умолчанию 10 ).

base=16 — для шестнадцатеричного представления цвета, кодировки символов и т.д., цифры могут быть 0..9 или A..F .

base=2 — обычно используется для отладки побитовых операций, цифры 0 или 1 .

base=36 — максимальное основание, цифры могут быть 0..9 или A..Z . То есть, используется весь латинский алфавит для представления числа. Забавно, но можно использовать 36 -разрядную систему счисления для получения короткого представления большого числового идентификатора. К примеру, для создания короткой ссылки. Для этого просто преобразуем его в 36 -разрядную систему счисления:

Внимание! Две точки в 123456..toString(36) это не опечатка. Если нам надо вызвать метод непосредственно на числе, как toString в примере выше, то нам надо поставить две точки .. после числа.

Если мы поставим одну точку: 123456.toString(36) , тогда это будет ошибкой, поскольку синтаксис JavaScript предполагает, что после первой точки начинается десятичная часть. А если поставить две точки, то JavaScript понимает, что десятичная часть отсутствует, и начинается метод.

Также можно записать как (123456).toString(36) .

Округление

Одна из часто используемых операций при работе с числами – это округление.

В JavaScript есть несколько встроенных функций для работы с округлением:

Math.floor Округление в меньшую сторону: 3.1 становится 3 , а -1.1 — -2 . Math.ceil Округление в большую сторону: 3.1 становится 4 , а -1.1 — -1 . Math.round Округление до ближайшего целого: 3.1 становится 3 , 3.6 — 4 , а -1.1 — -1 . Math.trunc (не поддерживается в Internet Explorer) Производит удаление дробной части без округления: 3.1 становится 3 , а -1.1 — -1 .

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

Эти функции охватывают все возможные способы обработки десятичной части. Что если нам надо округлить число до n-ого количества цифр в дробной части?

Например, у нас есть 1.2345 и мы хотим округлить число до 2-х знаков после запятой, оставить только 1.23 .

Есть два пути решения:

Умножить и разделить.

Например, чтобы округлить число до второго знака после запятой, мы можем умножить число на 100 , вызвать функцию округления и разделить обратно.

Метод toFixed(n) округляет число до n знаков после запятой и возвращает строковое представление результата.

Округляет значение до ближайшего числа, как в большую, так и в меньшую сторону, аналогично методу Math.round :

Обратите внимание, что результатом toFixed является строка. Если десятичная часть короче, чем необходима, будут добавлены нули в конец строки:

Мы можем преобразовать полученное значение в число, используя унарный оператор + или Number() , пример с унарным оператором: +num.toFixed(5) .

Неточные вычисления

Внутри JavaScript число представлено в виде 64-битного формата IEEE-754. Для хранения числа используется 64 бита: 52 из них используется для хранения цифр, 11 для хранения положения десятичной точки и один бит отведён на хранение знака.

Если число слишком большое, оно переполнит 64-битное хранилище, JavaScript вернёт бесконечность:

Наиболее часто встречающаяся ошибка при работе с числами в JavaScript – это потеря точности.

Посмотрите на это (неверное!) сравнение:

Да-да, сумма 0.1 и 0.2 не равна 0.3 .

Странно! Что тогда, если не 0.3 ?

Ой! Здесь гораздо больше последствий, чем просто некорректное сравнение. Представьте, вы делаете интернет-магазин и посетители формируют заказ из 2-х позиций за $0.10 и $0.20 . Итоговый заказ будет $0.30000000000000004 . Это будет сюрпризом для всех.

Но почему это происходит?

Число хранится в памяти в бинарной форме, как последовательность бит – единиц и нулей. Но дроби, такие как 0.1 , 0.2 , которые выглядят довольно просто в десятичной системе счисления, на самом деле являются бесконечной дробью в двоичной форме.

Другими словами, что такое 0.1 ? Это единица делённая на десять — 1/10 , одна десятая. В десятичной системе счисления такие числа легко представимы, по сравнению с одной третьей: 1/3 , которая становится бесконечной дробью 0.33333(3) .

Деление на 10 гарантированно хорошо работает в десятичной системе, но деление на 3 – нет. По той же причине и в двоичной системе счисления, деление на 2 обязательно сработает, а 1/10 становится бесконечной дробью.

В JavaScript нет возможности для хранения точных значений 0.1 или 0.2, используя двоичную систему, точно также, как нет возможности хранить одну третью в десятичной системе счисления.

Числовой формат IEEE-754 решает эту проблему путём округления до ближайшего возможного числа. Правила округления обычно не позволяют нам увидеть эту «крошечную потерю точности», но она существует.

Number.isInteger()

Метод Number.isInteger() определяет, является ли переданное значение целым числом.

Интерактивный пример

Синтаксис

Параметры

Значение, проверяемое на целочисленность.

Возвращаемое значение

Boolean сообщающий о том, является ли переданное значение целочисленным числом.

Описание

Если целевое значение является целым числом, возвращает true . Если значение NaN или Infinity , то возвращает false . Метод также возвращает true , если это вещественное число с точкой, которое может быть представлено в целочисленном виде.