Javascript преобразование в число. Преобразование данных в JavaScript. Встроенные методы для строк

Последнее обновление: 1.11.2015

Нередко возникает необходимость преобразовать одни данные в другие. Например:

Var number1 = "46"; var number2 = "4"; var result = number1 + number2; console.log(result); //464

Обе переменных представляют строки, а точнее строковые представления чисел. И в итоге мы получим не число 50, а строку 464. Но было бы неплохо, если бы их тоже можно было бы складывать, вычитать, в общем работать как с обычными числами.

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

Var number1 = "46"; var number2 = "4"; var result = parseInt(number1) + parseInt(number2); console.log(result); // 50

Для преобразования строк в дробные числа применяется функция parseFloat() :

Var number1 = "46.07"; var number2 = "4.98"; var result = parseFloat(number1) + parseFloat(number2); console.log(result); //51.05

При этом строка может иметь смешанное содержимое, например, "123hello", то есть в данном случае есть цифры, но есть и обычные символы. Но метод parseInt() все равно попытается выполнить преобразование:

Var num1 = "123hello"; var num2 = parseInt(num1); console.log(num2); // 123

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

С помощью специальной функции isNaN() можно проверить, представляет ли строка число. Если строка не является числом, то функция возвращает true, если это число - то false:

Var num1 = "javascript"; var num2 = "22"; var result = isNaN(num1); console.log(result); // true - num1 не является числом result = isNaN(num2); console.log(result); // false - num2 - это число

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

Var num1 = "110"; var num2 = parseInt(num1, 2); console.log(num2); // 6

Результатом будет 6, так как 110 в двоичной системе - это число 6 в десятичной.

Теперь напишем небольшую программу, в которой используем операции с переменными:

JavaScript var strSum = prompt("Введите сумму вклада", 1000); var strPercent = prompt("Введите процентную ставку", 10); var sum = parseInt(strSum); var procent = parseInt(strPercent); sum = sum + sum * procent / 100; alert("После начисления процентов сумма вклада составит: " + sum);

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

Однако функция prompt() возвращает строку. Поэтому эту строку нам надо преобразовать в число, чтобы выполнить с ней операции.

После открытия страницы в браузере мы увидим приглашение к вводу суммы вклада:

Затем подобное сообщение отобразится и для ввода процента. И в конце программа получит данные, преобразует их в числа и выполнит подсчет.

| |

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

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

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

Неявное преобразование

Язык программирования JavaScript очень хорошо справляется с обработкой неожиданных значений. JavaScript не отклоняет неожиданные значения, а пытается преобразовать. Это неявное преобразование также называется приведением типов (type coercion).

Отдельные методы автоматически преобразовывают значения, чтобы использовать их. Метод alert() принимает строку в качестве своего параметра, а другие типы автоматически преобразует в строки. Таким образом, можно передать этому методу числовое значение:

Если запустить эту строку, браузер вернет всплывающее окно со значением 8.5, которое будет уже преобразовано в строку.

Используя строки, состоящие из чисел, вместе с математическими операторами, вы обнаружите, что JavaScript может обрабатывать значения, неявно преобразовывая строки в числа:

// Вычитание
"15" - "10";
5
// Модуль
"15" % "10";
5

Но не все операторы работают предсказуемо. Особенно это касается оператора +: он выполняет сложение чисел и конкатенацию строк.

// При работе со строками + выполняет конкатенацию
"2" + "3";
"23"

Поскольку оператор + имеет много предназначений, в этом примере он воспринимает значения 2 и 3 как строковые, несмотря на то, что они выражаются числовыми строками. Потому он объединяет строки «2» и «3» и получает 23, а не складывает 2 и 3 и получает 5.

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

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

Чтобы явно преобразовать значение в строку, вызовите метод String() или n.toString().

Попробуйте преобразовать логическое значение true в строку с помощью String().

Это вернет строковый литерал «true».

Также можно попробовать передать функции число:

Она вернет строковый литерал:

Теперь попробуйте использовать String() с переменной. Присвойте числовое значение переменной odyssey и используйте оператор typeof, чтобы проверить тип.

let odyssey = 2001;
console.log(typeof odyssey);
number

На данный момент переменной odyssey присвоено числовое значение 2001. Оператор typeof подтверждает, что значение является числом.

Теперь присвойте переменной odyssey ее эквивалент внутри функции String(), а затем используйте typeof, чтобы убедиться, что значение переменной успешно преобразовано из числа в строку.

odyssey = String(odyssey); // "2001"
console.log(typeof odyssey);
string

Как видите, теперь переменная odyssey содержит строку.

Функция n.toString() работает аналогичным образом. Замените n переменной.

let blows = 400;
blows.toString();

Переменная blows будет содержать строку.

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

(1776).toString(); // returns "1776"
(false).toString(); // returns "false"
(100 + 200).toString(); // returns "300"

String() и n.toString() явно преобразовывают логические и числовые значения в строки.

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

Метод Number() может преобразовать значение в число. Часто возникает необходимость преобразовать строки, состоящие из чисел, но иногда преобразовывать нужно и логические значения.

Для примера передайте методу Number() такую строку:

Строка будет преобразована в число и больше не будет заключена в кавычки.

Также можно присвоить строку переменной и затем преобразовать ее.

let dalmatians = "101";
Number(dalmatians);
101

Строковый литерал «101» был преобразован в число 101.

Строки из пробелов или пустые строки будут преобразованы в число 0.

Number(" "); // returns 0
Number(""); // returns 0

Имейте в виду, что строки, которыйе не состоят из чисел, преобразуются в NaN, что означает Not a Number. Это относится и к числам, разделенным пробелами.

Number("twelve"); // returns NaN
Number("20,000"); // returns NaN
Number("2 3"); // returns NaN
Number("11-11-11"); // returns NaN

В логических данных значение false будет равно 0, а true будет равно 1.

Преобразование значений в логические значения

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

Любое значение, которое интерпретируется как пустое, например, число 0, пустая строка, значения undefined, NaN или null преобразуются в значение false.

Boolean(0); // returns false
Boolean(""); // returns false
Boolean(undefined); // returns false
Boolean(NaN); // returns false
Boolean(null); // returns false

Другие значения, включая строковые литералы, состоящие из пробелов, будут преобразованы в true.

Boolean(2000); // returns true
Boolean(" "); // returns true
Boolean("Maniacs"); // returns true

Обратите внимание: строковый литерал «0» преобразовывается в true, поскольку это не пустое значение:

Boolean("0"); // returns true

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

Заключение

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

В JavaScript существуют 2 встроенные функции для преобразования строк в числа: parseFloat() и parseInt() .

parseFloat() принимает аргументом строку, которую необходимо привести к численному типу, и возвращает число типа float. Число должно содержаться в начале строки. Если после числа в строке идут ещё какие-то символы, то они отсекаются. Дробная часть числа должна быть записана через точку (запятая не воспринимается как разделитель). В случае, если parseFloat() не может преобразовать строку, то она возвращает NaN.

Также функция может обработать «число n, умноженное на 10 в степени x», которое в программировании принято записывать через букву E, например: 0.5E6 или 0.5E+6. Степень может быть также отрицательная: 0.5E-6, что равно 0.5*10^-6 или 0.5/1000000.

ParseFloat(""3.78kg"") // 3.78 parseFloat(""kg33"") // NaN parseFloat(""0004.111"") // 4.111 parseFloat(""0x66"") // 0 parseFloat("".5"") // 0.5 parseFloat(""-.5"") // -0.5 parseFloat(""0.5e6"") // 500000 parseFloat(""0.03E+2"") // 3 parseFloat(""3E-4"") // 0.0003 parseFloat(""-3E-4"") // -0.0003

Функция parseInt(string[, radix]) принимает в качестве первого аргумента строку, анализирует её и возвращает целое число (тип integer). Функция пытается анализировать систему счисления, в которой записано число в исходной строке (например, десятичная, восьмеричная или шестнадцатеричная — но не только эти). Также систему счисления можно указать явно, передав её вторым параметром radix. Параметр radix может принимать любое число от 2 до 36 (в системах выше 10-й используются буквы английского алфавита, от A до Z).

Числа типа 1.5e6 функция не обрабатывает так, как parseFloat() .

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

ParseInt(""25"") // 25 parseInt(""-25"") // -25 parseInt(""45.12"") // 45 parseInt(""045"",10) // 45 parseInt(""70"",8) // 56 (70 в восьмеричной системе это 56 в десятичной) parseInt(""070"") // 56 (ВАЖНО!!! нуль вначале заставит функцию проанализировать строку как восьмеричное число) parseInt(""88"",8) // NaN (в восьмеричной системе нет цифры 8) parseInt(""a1"") // NaN (ВАЖНО!!! Функция по умолчанию не воспринимает число как 16-ричное, если не дописать в начале строки 0x) parseInt(""a1"",16) // 161 (здесь явно указана система счисления) parseInt(""0xa1"") // 161 (правильный формат 16-ричного числа, можно не указывать второй параметр) parseInt(""099"") // 0 (ВАЖНО!!! Число воспринимается как восьмеричное, но содержащее недопустимые символы) parseInt(""0.5e6"") // 0 (ВАЖНО!!! не работает как parseFloat) parseInt(""ZZ"",36) // 1295 parseInt(""-FF"") // NaN parseInt(""-FF"",16) // -255

Если Вы обрабатываете данные из текстового поля, которые вводит пользователь, всегда используйте parseInt() вместе со вторым параметром radix, это обезопасит Ваш код от неожиданных результатов.

В JavaScript существуют 2 встроенные функции для преобразования строк в числа: parseFloat() и parseInt() .

parseFloat() принимает аргументом строку, которую необходимо привести к численному типу, и возвращает число типа float. Число должно содержаться в начале строки. Если после числа в строке идут ещё какие-то символы, то они отсекаются. Дробная часть числа должна быть записана через точку (запятая не воспринимается как разделитель). В случае, если parseFloat() не может преобразовать строку, то она возвращает NaN.

Также функция может обработать «число n, умноженное на 10 в степени x», которое в программировании принято записывать через букву E, например: 0.5E6 или 0.5E+6. Степень может быть также отрицательная: 0.5E-6, что равно 0.5*10^-6 или 0.5/1000000.

ParseFloat(""3.78kg"") // 3.78 parseFloat(""kg33"") // NaN parseFloat(""0004.111"") // 4.111 parseFloat(""0x66"") // 0 parseFloat("".5"") // 0.5 parseFloat(""-.5"") // -0.5 parseFloat(""0.5e6"") // 500000 parseFloat(""0.03E+2"") // 3 parseFloat(""3E-4"") // 0.0003 parseFloat(""-3E-4"") // -0.0003

Функция parseInt(string[, radix]) принимает в качестве первого аргумента строку, анализирует её и возвращает целое число (тип integer). Функция пытается анализировать систему счисления, в которой записано число в исходной строке (например, десятичная, восьмеричная или шестнадцатеричная — но не только эти). Также систему счисления можно указать явно, передав её вторым параметром radix. Параметр radix может принимать любое число от 2 до 36 (в системах выше 10-й используются буквы английского алфавита, от A до Z).

Числа типа 1.5e6 функция не обрабатывает так, как parseFloat() .

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

ParseInt(""25"") // 25 parseInt(""-25"") // -25 parseInt(""45.12"") // 45 parseInt(""045"",10) // 45 parseInt(""70"",8) // 56 (70 в восьмеричной системе это 56 в десятичной) parseInt(""070"") // 56 (ВАЖНО!!! нуль вначале заставит функцию проанализировать строку как восьмеричное число) parseInt(""88"",8) // NaN (в восьмеричной системе нет цифры 8) parseInt(""a1"") // NaN (ВАЖНО!!! Функция по умолчанию не воспринимает число как 16-ричное, если не дописать в начале строки 0x) parseInt(""a1"",16) // 161 (здесь явно указана система счисления) parseInt(""0xa1"") // 161 (правильный формат 16-ричного числа, можно не указывать второй параметр) parseInt(""099"") // 0 (ВАЖНО!!! Число воспринимается как восьмеричное, но содержащее недопустимые символы) parseInt(""0.5e6"") // 0 (ВАЖНО!!! не работает как parseFloat) parseInt(""ZZ"",36) // 1295 parseInt(""-FF"") // NaN parseInt(""-FF"",16) // -255

Если Вы обрабатываете данные из текстового поля, которые вводит пользователь, всегда используйте parseInt() вместе со вторым параметром radix, это обезопасит Ваш код от неожиданных результатов.

Всем доброго времени суток. На связи Алексей Гулынин. В прошлой статье вы узнали про типы данных в Javascript . В данной статье я бы хотел поговорить про преобразование типов в Javascript . Преобразование типов в Javascript, да и вообще в любом языке программирования, выполняются очень часто. Сначала хотел поговорить про преобразование типов при сравнении переменных, либо других условий, результатом которых является true или false . При сравнении переменных разного типа выполняются фоновые преобразования. Здесь главным моментом является то, что при таких фоновых преобразованиях, значение, которое хранится в переменной, не меняется. переменная преобразовывается в тот тип данных (создаётся временное значение переменной), который необходим для выполнения операции. приведу пример:

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

Var a = 5; var b = "15"; if (a < b) alert("a < b"); else alert("a > b");

В данном случае переменная b будет преобразована в число (выполнилось фоновое преобразование типа String в тип Number, и получится временное значение переменной b типа Number = 15, которое удалится после выполнения операции сравнения), и выйдет результат, что a .

Ниже приведена таблица, которая показывает, как один тип данных преобразовывается в другой:

Тип значения Контекст, в котором используется значение
Строковый Числовой Логический Объектный
Неопределенное значение ‘undefined’ NaN false Error
null ‘null’ 0 false Error
Пустая строка Пустая строка 0 false Объект String
Непустая строка Непустая строка Числовое значение строки или NaN true Объект String
0 ’0′ 0 false Объект Number
NaN ‘NaN’ NaN false Объект Number
Infinity ‘Infinity’ Infinity true Объект Number
-Infinity ‘-Infinity’ -Infinity true Объект Number
Любое другое число Строковое представление числа Само число true Объект Number
true ‘true’ 1 true Объект Boolean
false ‘false’ 0 false Объект Boolean
Объект, функция toString() valueOf(), toString() или NaN true Объект, функция
Преобразования типов данных

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

Var a = 20; var b = !a; //вернет false var c = !!a; //вернет true

Строку можно получить из любого объекта. Пример:

Var a = 20; var b = a.toString(); //вернет "20" var c = a + ""; //вернет "20" typeof b; //вернет string typeof c; //вернет string

Получение числа из строки. Пример:

Var a = "20"; var b = a * 1; //вернет 20 var c = + a; //вернет 20 typeof b; //вернет number typeof c; //вернет number

Давайте теперь на основе полученных знаний разберем поведение логического "И" (&&) и логического "ИЛИ" (||) :

Логическое "И" (&&):

Для корректного выполнения этого оператора необходимо, чтобы значения всех операндов могли быть преобразованы в true. Если значения всех операндов могут быть преобразованы в true, то будет возвращено первоначальное значение последнего сравниваемого операнда. Если значение хотя бы одного операнда будет преобразовано в false, то вернется первоначальное значение этого операнда. Пример:

Var a = 15; var b = "abc"; var c = 0; var resultat; resultat = a && b && c; //вернет 0 resultat = c && b && a; //вернет 0 resultat = 7 && a; //вернет 15 resultat = 7 && b; //вернет "abc"

Логическое "ИЛИ" (||):

Немного поясню про операторы и операнды. Разберем выражение resultat = a && b && c . Здесь операторами являются "=" и "&&" , т.е. это действия. Операнды: resultat, a, b ,c . Это то, над чем совершаются действия.