В 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 значения достаточно свободно (явно и неявно) могут быть преобразованы из одного типа в другой. Например, если какой-нибудь оператор ожидает получить значение определённого типа, а ему передаётся значение другого типа, то интерпретатор автоматически попытается выполнить преобразования к нужному типу:
Console.log(10 + " машин"); // "10 машин". Число неявно преобразуется в строку console.log("7" * "4"); // 28. Обе строки неявно преобразуются в числа
Неявное преобразование - это когда интерпретатор автоматически выполняет преобразование типов, т. е. без участия программиста. Явное преобразование - это когда преобразование выполняет сам программист. Явное преобразование иначе называют приведением типов :
Console.log("7" * "4"); // 28. Неявное преобразование console.log(Number("7") * Number("4")); // 28. Явное преобразование
В таблице ниже описывается, как в JavaScript выполняется преобразование значений из одного типа в другой. Пустые ячейки соответствуют ситуациям, когда преобразование не требуется:
| undefined null | "undefined" "null" | NaN 0 | false false | ошибка typeError ошибка typeError |
| true false | "true" "false" | 1 0 | new Boolean(true) new Boolean(false) |
|
| "" (пустая строка) "1.2" "one" "-10" "+10" "011" "0xff" |
0 1.2 NaN -10 10 11 255 |
false true true true true true true |
new String("") new String("1.2") new String("one") new String("-10") new String("+10") new String("011") new String("0xff") |
|
| 0 -0 NaN Infinity -Infinity 3 | "0" "0" "NaN" "Infinity" "-Infinity" "3" | false false false true true true | new Number(0) new Number(-0) new Number(NaN) new Number(Infinity) new Number(-Infinity) new Number(3) |
|
| {} (любой объект) (пустой массив) | см. Преобразование объектов "" | см. Преобразование объектов 0 9 NaN NaN | true true |
Для явного преобразования в простые типы используются следующие функции: Boolean() , Number() , String() . При неявном преобразования интерпретатор использует те же функции, что используются для явного преобразования.
Для явного преобразования можно использовать операторы вместо функций. Например, если один из операндов оператора + является строкой, то другой операнд также преобразуется в строку. Унарный оператор + преобразует свой операнд в число. Унарный оператор! преобразует операнд в логическое значение и инвертирует его. Всё это стало причиной появления следующих своеобразных способов преобразования типов, которые можно встретить на практике:
X + "" // То же, что и String(x) +x // То же, что и Number(x). Можно также встретить x - 0 !!х // То же, что и Boolean(x)
Преобразование в числаФункция Number() преобразует значения по следующим правилам:
- Логические значения true и false преобразуются в 1 и 0 соответственно.
- Числа возвращаются без изменения.
- Значение null преобразуется в 0 .
- Значение undefined преобразуется в NaN .
Для строк действуют особые правила:
- Если строка содержит только цифры с начальным знаком + или - либо без знака, она всегда преобразуется в целое десятичное число. Начальные нули игнорируются, например "0011" преобразуется в 11.
- Если строка представляет собой число с плавающей точкой с начальным знаком + или - либо без знака, она преобразуется в соответствующее число с плавающей точкой (начальные нули также игнорируются).
- Если строка представляет собой число в шестнадцатеричном формате, она преобразуется в соответствующее целое десятичное число.
- Если строка пустая, она преобразуется в 0 .
- Если строка содержит что-то отличное от предыдущих вариантов, она преобразуется в NaN .
- Для объектов вызывается метод valueOf() , а возвращаемое им значение автоматически преобразуется по предыдущим правилам. Если это преобразование даёт в результате NaN , вызывается метод toString() и применяются правила преобразования строк в числа.
Унарные операторы + и - работают по тем же правилам, что и функция Number() .
Преобразование в булевы значенияФункция Boolean() преобразует значение в его логический эквивалент:
- Следующие значения в результате преобразования дают значение false: undefined , null , 0 , -0 , NaN , "" .
- Значение false возвращается без изменения.
- Все остальные значения в результате преобразования дают значение true .
Функция String() преобразует значения по следующим правилам:
- Для всех значений кроме null и undefined автоматически вызывается метод toString() и возвращается строковое представление значения.
- Для значения null возвращается строка "null" .
- Для значения undefined возвращается строка "undefined" .
Для преобразования простых значений в объекты используются конструкторы Boolean() , Number() , String() :
Var oNum = new Number(3); var oStr = new String("1.2"); var oBool = new Boolean(true); alert(typeof oNum); // "object" alert(typeof oStr); // "object" alert(typeof oBool); // "object"
Преобразование объектов в простые значенияВсе объекты наследуют два метода преобразования: toString() и valueOf() .
Метод toString() возвращает строковое представление объекта. По умолчанию он ничего интересного не возвращает:
Alert({x: 1}.toString()); // ""
Некоторые типы имеют более специализированные версии метода toString() . Например, метод toString() у массива преобразует все его элементы в строки и затем объединяет их в одну строку, вставляя запятые между ними:
Alert(.toString()); // "1,2,3"
Задача метода valueOf() определена не так чётко: предполагается, что он должен преобразовать объект в представляющее его простое значение, если такое значение существует. Объекты по своей сути являются составными значениями, и большинство объектов не могут быть представлены в виде единственного простого значения, поэтому по умолчанию метод valueOf() возвращает не простое значение, а ссылку на него:
Alert(typeof {x:2}.valueOf()); // "object"
При преобразовании объекта в строку интерпретатор JavaScript выполняет следующие действия:
- Если объект имеет метод toString() , интерпретатор вызывает его. Если он возвращает простое значение, интерпретатор преобразует значение в строку (если оно не является строкой) и возвращает результат преобразования.
- Если объект не имеет метода toString() или этот метод не возвращает простое значение, то интерпретатор проверяет наличие метода valueOf() . Если этот метод определён, интерпретатор вызывает его. Если он возвращает простое значение, интерпретатор преобразует это значение в строку (если оно не является строкой) и возвращает результат преобразования.
При преобразовании объекта в число интерпретатор выполняет те же действия, но первым пытается применить метод valueOf() :
- Если объект имеет метод valueOf() , возвращающий простое значение, интерпретатор преобразует (при необходимости) это значение в число и возвращает результат.
- Если объект не имеет метода valueOf() или этот метод не возвращает простое значение, то интерпретатор проверяет наличие метода toString() . Если объект имеет метод toString() , возвращающий простое значение, интерпретатор выполняет преобразование и возвращает полученное значение.
- В противном случае интерпретатор делает вывод, что ни toString() ни valueOf() не позволяют получить простое значение и возбуждает ошибку TypeError .
Методы toString() и valueOf() доступны для чтения и записи, поэтому их можно переопределить и явно указать, что будет возвращаться при преобразовании:
Var obj = {}; obj.toString = function() { return "объект"; }; alert("Это " + obj); // "Это объект"
Последнее обновление: 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
строка в число. Это делается с помощью функции Number , сейчас я покажу ее использование на примере.
Также предлагаю посмотреть видео-версию этой статьи:
Как вы знаете, в javascript есть числовой и строковый тип данных. Давайте попробуем создать две переменных, в которые сохраним числа, а потом выведем результат на экран.
Var a = 5; var b = 12; document.write(a + b);
Каким будет результат? 17, что и вывел нам браузер. Итак, это числовые данные, поэтому браузер успешно их сложил. А теперь давайте создадим другие две переменные, в которые положим такие же значения, но в кавычках. Я напомню, все строки в javascript пишутся именно в кавычках.
Var c = "5";
var d = "12";
document.write("
" + c + d);
Теперь браузер считает наши данные строками и если мы их сложим, то просто будут сложены две строки и мы получим 512, что не есть правильным результатом если бы складывались числа, но является правильным, если поставить вместе две строки.
Тут все просто, создадим очередные две переменные, в которые запишем то же значение, что задано переменным c и d , но пропустив их через метод Number:
Var e = Number(c); var f = Number(d); document.write(e + f);
Если вы теперь попробуете вывести результат от этого сложения на экран, то выведется 17. Все потому, что наш метод успешно отработал и преобразовал строку в число. Хочу отметить, что если вы напишите так:
Document.write("
" + e + f);
То на экран выведется 512, потому что при сложении строк и чисел ВСЕГДА результат преобразовывается в строку. Если вы хотите добавить перенос строки и при этом сохранить правильный результат, можно записать все в две строку или в одно следующим образом:
Document.write("
" + (e + f));
Если взять числа в скобки, то они не будут преобразованы в строки и успешно сохранят свои свойства. Вот такая вот короткая статья у меня сегодня. Надеюсь, 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, это обезопасит Ваш код от неожиданных результатов.