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

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

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

Метод Math.abs()

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

var newVal = -57.64;
Math.abs(newVal);

> 57.64

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

Функция parseInt

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

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

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

var elem = document.getElementById("elem1")
var centerPoint = window.getComputedStyle(elem).transformOrigin;

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

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

var centers = centerPoint.split(" "),

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

var centerX = parseInt(centers[0], 10);

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

Функция parseFloat

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

var FP = "33.33333%";
console.log(parseFloat(FP));

> 33.33333

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

Заключение

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

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

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

Курс по JavaScript: основы

Изучите JavaScript с нуля до результата!

Смотреть курс

Метки:

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

Комментарии Facebook:

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Я не робот.

Spam Protection by WP-SpamFree