Закон абсолюта: работа с Math.abs, parseInt и parseFloat в JavaScript

От автора: работать с числами в JavaScript может быть затруднительно. Полученные значения не всегда попадают в ожидаемые рамки. Бывает, что вы можете получить отрицательное число в то время, как ожидали положительное. Иногда это может быть даже не число. Конвертацией строк в числовой формат и обработкой вот таких условий часто занимаются метод Math.abs и функции parseInt и parseFloat.

Метод Math.abs()

Метод Math.abs() возвращает абсолютное значение числа, т.е. положительное число. Отрицательные числа превращаются в положительные. Полезно, когда результат может быть отрицательным, а вам нужно положительное число. В консоли:

Math.abs(0) всегда вернет 0, -Math.abs(num) (именно со знаком минус в начале) всегда вернет отрицательное число от переданного.

Функция parseInt

Как я говорил выше, JS распознает значения типа «15» в качестве строки, не числа. Довольно часто при парсинге CSS кода при помощи JS можно получить число, записанное в виде строки. Также строку можно получить из плохо подготовленного массива. Результат не всегда может быть такой. Иногда можно получить строку «17px». Реальная сложность в том, как правильно конвертировать такую запись в значение, которое можно использовать в вычислениях.

Конвертацией текста с числами в просто числа занимается функция очистки parseInt. Текст, передаваемый в parseInt всегда должен идти с основанием системы счисления. В большинстве случаев система счисления будет 10 (т.е. система счисления обычных чисел, с которыми вы работаете каждый день). Однако не во всех браузерах эта система указана по умолчанию, ее нужно указывать вручную.

В предыдущем примере, в котором я вращал элемент по прикосновению к экрану и положению курсора мыши, я нашел центр элемента при помощи следующего кода:

В переменную centerPoint может попасть результат типа: 75px 75px

Такой результат можно разбить по знаку пробела при помощи метода split():

…но у нас остается px в каждой строке. Для очистки мы воспользуемся функцией parseInt():

…где 10 – основание системы счисления. В итоге мы получаем просто число 75. Полученное число можно использовать для вычислений в JS.

Функция parseFloat

Функция parseFloat – эквивалент parseInt, только с плавающей точкой: функция конвертирует текст в число с плавающей точкой. Она может пригодиться при парсинге CSS, особенно при работе с процентами с плавающей точкой:

Заметьте, что parseFloat не требует записи и не использует основание системы счисления.

Заключение

Функции parseInt() и parseFloat() крайне полезны. Довольно мощные функции с определенным уровнем интеллекта. Тем не менее, необходимо проверять диапазон распарсеных значений, чтобы их можно было использовать в дальнейшей работе.

Источник: //thenewcode.com/

Редакция: Команда webformyself.

Комментарии Вконтакте: