Контакты

Неявное преобразование типов данных в javascript. Преобразование типов данных в JavaScript. Методы 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)
{} (любой объект)

(пустой массив)
(1 числовой элемент)
arr (любой другой массив)
function(){} (любая функция)

см. Преобразование объектов

""
"9"
см. Преобразование объектов
см. Преобразование объектов

см. Преобразование объектов
0
9
NaN
NaN
true

true
true
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); // "Это объект"

Нет разницы в том, какого типа переменная используется в выражении. Если выражение математическое, все его переменные автоматически будут интерпретированы как числовые. Если обрабатываются строки, то все «участники» выражения рассматриваются как строки. Однако задача преобразования на JavaScript "строку в число" существует в значительно более широком контексте.

Методы JavaScript преобразования строк в числа

Арсенал методов для преобразования строк в числа не велик, но достаточен во всех простых случаях. Здесь JavaScript (для начинающих особенно) - это путь от от простому к сложному на практичных примерах.

Вам будет интересно:

В примере описаны четыре разных строки. В первом блоке вывода тип каждой переменных функция typeof определяется как string. Затем каждая строка очень просто преобразуется в число. Во втором блоке вывода видны изменения в переменных после преобразования, их тип стал числом. Пример преобразования JavaScript parseFloat особенно показателен: было "12e+3", стало "12000".

Изменения при преобразования строки в число могут быть существенны! Но имеют значение только первые символы: они должны быть цифровыми. Если нет ни одного цифрового символа, результат будет NaN.

Обратное преобразование строки, «ставшей» числом, не всегда такая же строка. Этот момент можно использовать для проверки корректности ввода численной информации.

The parseInt() function parses a string argument and returns an integer of the specified radix (the base in mathematical numeral systems).

The source for this interactive example is stored in a GitHub repository. If you"d like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.

Syntax

parseInt(string , radix)

Parameters

string The value to parse. If this argument is not a string, then it is converted to one using the ToString abstract operation. Leading whitespace in this argument is ignored. radix Optional An integer between 2 and 36 that represents the radix (the base in mathematical numeral systems) of the string . Be careful-this does not default to 10 ! The explains in more detail what happens when radix is not provided.

Return value

An integer parsed from the given string .

If the radix is smaller than 11 , and the first non-whitespace character cannot be converted to a number, NaN is returned.

Description

The parseInt function converts its first argument to a string, parses that string, then returns an integer or NaN .

If not NaN , the return value will be the integer that is the first argument taken as a number in the specified radix . (For example, a radix of 10 converts from a decimal number, 8 converts from octal, 16 from hexadecimal, and so on.)

For radices above 10 , letters of the English alphabet indicate numerals greater than 9 . For example, for hexadecimal numbers (base 16), A through F are used.

If parseInt encounters a character that is not a numeral in the specified radix , it ignores it and all succeeding characters and returns the integer value parsed up to that point. parseInt truncates numbers to integer values. Leading and trailing spaces are allowed.

Because some numbers use the e character in their string representation (e.g. 6.022e23 for 6.022 × 10 23), using parseInt to truncate numbers will produce unexpected results when used on very large or very small numbers. parseInt should not be used as a substitute for Math.floor() .

parseInt understands exactly two signs: + for positive, and - for negative (since ECMAScript 1). It is done as an initial step in the parsing after whitespace is removed. If no signs are found, the algorithm moves to the following step; otherwise, it removes the sign and runs the number-parsing on the rest of the string.

If radix is undefined , 0 , or unspecified, JavaScript assumes the following:

  1. If the input string begins with "0x" or "0X" (a zero, followed by lowercase or uppercase X), radix is assumed to be 16 and the rest of the string is parsed as a hexidecimal number.
  2. If the input string begins with "0" (a zero), radix is assumed to be 8 (octal) or 10 (decimal). Exactly which radix is chosen is implementation-dependent. ECMAScript 5 clarifies that 10 (decimal) should be used, but not all browsers support this yet. For this reason, always specify a radix when using parseInt .
  3. If the input string begins with any other value, the radix is 10 (decimal).

If the first character cannot be converted to a number, parseInt returns NaN unless the radix is bigger than 10 .

For arithmetic purposes, the NaN value is not a number in any radix. You can call the isNaN function to determine if the result of parseInt is NaN . If NaN is passed on to arithmetic operations, the operation result will also be NaN .

To convert a number to its string literal in a particular radix, use thatNumber .toString(radix) .

Examples

Using parseInt

The following examples all return 15:

ParseInt("0xF", 16) parseInt("F", 16) parseInt("17", 8) parseInt(021, 8) parseInt("015", 10) // but `parseInt(015, 10)` will return 13 parseInt(15.99, 10) parseInt("15,123", 10) parseInt("FXX123", 16) parseInt("1111", 2) parseInt("15 * 3", 10) parseInt("15e2", 10) parseInt("15px", 10) parseInt("12", 13)

The following examples all return NaN:

ParseInt("Hello", 8) // Not a number at all parseInt("546", 2) // Digits other than 0 or 1 are invalid for binary radix

The following examples all return -15:

ParseInt("-F", 16) parseInt("-0F", 16) parseInt("-0XF", 16) parseInt(-15.1, 10) parseInt("-17", 8) parseInt("-15", 10) parseInt("-1111", 2) parseInt("-15e1", 10) parseInt("-12", 13)

The following examples all return 4:

ParseInt(4.7, 10) parseInt(4.7 * 1e22, 10) // Very large number becomes 4 parseInt(0.00000000000434, 10) // Very small number becomes 4

The following example returns 224:

ParseInt("0e0", 16) parseInt("123_456") // 123

Octal interpretations with no radix

Although discouraged by ECMAScript 3 and forbidden by ECMAScript 5, many implementations interpret a numeric string beginning with a leading 0 as octal. The following may have an octal result, or it may have a decimal result. Always specify a radix to avoid this unreliable behavior.

ParseInt("0e0") // 0 parseInt("08") // 0, because "8" is not an octal digit.

ECMAScript 5 removes octal interpretation

The ECMAScript 5 specification of the function parseInt no longer allows implementations to treat Strings beginning with a 0 character as octal values. ECMAScript 5 states:

The parseInt function produces an integer value dictated by interpretation of the contents of the string argument according to the specified radix. Leading white space in string is ignored. If radix is undefined or 0 , it is assumed to be 10 except when the number begins with the character pairs 0x or 0X , in which case a radix of 16 is assumed.

This differs from ECMAScript 3, which discouraged but allowed octal interpretation.

Many implementations have not adopted this behavior as of 2013, and because older browsers must be supported, always specify a radix .

A stricter parse function

It is sometimes useful to have a stricter way to parse integers.

Regular expressions can help:

Function filterInt(value) { if (/^[-+]?(\d+|Infinity)$/.test(value)) { return Number(value) } else { return NaN } } console.log(filterInt("421")) // 421 console.log(filterInt("-421")) // -421 console.log(filterInt("+421")) // 421 console.log(filterInt("Infinity")) // Infinity console.log(filterInt("421e+0")) // NaN console.log(filterInt("421hop")) // NaN console.log(filterInt("hop1.61803398875")) // NaN console.log(filterInt("1.61803398875")) // NaN

Specifications

Specification Status Comment
ECMAScript 1st Edition (ECMA-262) Standard Initial definition.
ECMAScript 5.1 (ECMA-262)
Standard
ECMAScript 2015 (6th Edition, ECMA-262)
The definition of "parseInt" in that specification.
Standard
ECMAScript Latest Draft (ECMA-262)
The definition of "parseInt" in that specification.
Draft

Browser compatibility

The compatibility table on this page is generated from structured data. If you"d like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.

Update compatibility data on GitHub

Desktop Mobile Server
Chrome Edge Firefox Internet Explorer Opera Safari Android webview Chrome for Android Firefox for Android Opera for Android Safari on iOS Samsung Internet Node.js
parseInt Chrome Full support 1 Edge Full support 12 Firefox Full support 1 IE Full support 3 Opera Full support Yes Safari Full support Yes WebView Android Full support 1 Chrome Android Full support 18 Firefox Android Full support 4 Safari iOS Full support Yes Samsung Internet Android Full support 1.0 nodejs Full support Yes
Parses leading-zero strings are decimal, not octal Chrome Full support 23 Edge Full support 12 Firefox Full support 21 IE Full support 9 Opera Full support Yes Safari Full support 6 WebView Android Full support 4.4 Chrome Android Full support 25 Firefox Android Full support 21 Opera Android Full support Yes Safari iOS Full support 6 Samsung Internet Android Full support Yes nodejs Full support Yes

Здравствуйте, дорогие читатели. Сегодня я напишу, как преобразовывается в 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, что не есть правильным результатом если бы складывались числа, но является правильным, если поставить вместе две строки.

Как преобразовать в javascript строку в число?

Тут все просто, создадим очередные две переменные, в которые запишем то же значение, что задано переменным 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, это обезопасит Ваш код от неожиданных результатов.



Понравилась статья? Поделитесь ей