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

console.log(sum(1, 2)); // 3 (тут всё ок) console.log(sum(1, "2")); // 12 (а тут не очень)

Как видно из примера функция sum некорректно себя ведёт, если в качестве хотя бы одного её аргумента передать не число. Дело в том, что при «сложении» числа со строкой, число преобразуется к строке и происходит его конкатенация (склеивание) со вторым операндом.

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

Оператор typeof

Этот унарный оператор принимает в качестве операнда абсолютно любое значение и возвращает его тип в строковой переменной.

В JavaScript существуют следующие типы данных:

// 1.) object console.log (typeof { } ) ; // object var p = { x: 1 , y: 3 } ; console.log (typeof p) ; // object // 2.) function function sayHello() { console.log ("Hello!" ) ; } console.log (typeof sayHello) ; // function // 3.) string console.log (typeof "JavaScript" ) ; // string // 4.) number console.log (typeof 3.1415 ) ; // number // 5.) boolean console.log (typeof true ) ; // boolean // 6.) undefined var notExistsOne; console.log (typeof notExistsOne) ; // undefined console.log (typeof notExistsTwo) ; // undefined

// 1.) object console.log(typeof {}); // object var p = {x: 1, y: 3}; console.log(typeof p); // object // 2.) function function sayHello() { console.log("Hello!"); } console.log(typeof sayHello); // function // 3.) string console.log(typeof "JavaScript"); // string // 4.) number console.log(typeof 3.1415); // number // 5.) boolean console.log(typeof true); // boolean // 6.) undefined var notExistsOne; console.log(typeof notExistsOne); // undefined console.log(typeof notExistsTwo); // undefined

Обратите внимание, что undefined это тоже тип данных, который состоит из одного значения.

Приведение типов

Под приведением типов в программировании понимают преобразование значения переменной одного типа в значение другого типа.
Часто такое преобразование происходит без контроля со стороны программиста. Это можно было видеть в примере с функцией sum . Изменение типа происходит, если результат выполнения операции с переменной исходного типа неясен. Например, нельзя точно сказать, что получиться в результате сложения строки с числом, но операция сложения двух чисел очевидна, и в этом случае логично привести число к строке.

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

Иногда сам программист может изменить тип переменной, применив к ней некоторые операции. Например, операции инкремента или декремента над строкой приведут её к числу.

var c = "not-a-number"; ++c; console.log(typeof c); // NaN

Стоит заметить, что не нужно прибегать к такому способу приведения строки к числу из-за его плохой читабельности и неочевидности. Для этой задачи в js существуют встроенные функции parseInt и parseFloat . В качестве первого аргумента они принимают строку, которую необходимо привести к числу, а в качестве второго необязательного – основание системы счисления, в которой записано число в строке, передаваемой в качестве первого аргумента. Если второй аргумент не указан, то будет считаться, что в строке записано число в десятичной системе счисления.

Функция parseInt используется для преобразования строки в целое число, а функция parseFloat для преобразования в дробное.

var a = parseInt("10" ) ; console.log ([ "a = " , a, "; typeof a:" , typeof a] .join (" " ) ) ; // a = 10 ; typeof a: number var pi = parseInt("3.1415" ) ; console.log ("pi = " + pi) ; // pi = 3 pi = parseFloat("3.1415" ) ; console.log ("pi = " + pi) ; // pi = 3.1415

var a = parseInt("10"); console.log(["a = ", a, "; typeof a:", typeof a].join(" ")); // a = 10 ; typeof a: number var pi = parseInt("3.1415"); console.log("pi = " + pi); // pi = 3 pi = parseFloat("3.1415"); console.log("pi = " + pi); // pi = 3.1415

Обратите внимание, что в строке может находиться любое литеральное числовое значение, в том числе в шестнадцатеричном, восьмеричном или экспоненциальном виде.

a = parseInt("010" ) ; console.log ("a = " + a) ; // a = 8 a = parseInt("0xAA" ) ; console.log ("a = " + a) ; // a = 170 a = parseFloat("1e-10" ) ; console.log ("a = " + a) ; // a = 1e-10 (1e-10 = 1 * 10 ^ -10 = 0.0000000001)

a = parseInt("010"); console.log("a = " + a); // a = 8 a = parseInt("0xAA"); console.log("a = " + a); // a = 170 a = parseFloat("1e-10"); console.log("a = " + a); // a = 1e-10 (1e-10 = 1 * 10 ^ -10 = 0.0000000001)

В качестве второго параметра функций parseInt и parseFloat можно указать основание системы счисления.

a = parseInt("10" , 8 ) ; console.log ("a = " + a) ; // a = 8 a = parseInt("010" , 10 ) ; console.log ("a = " + a) ; // a = 10 a = parseInt("ff" , 16 ) ; console.log ("a = " + a) ; // a = 255

a = parseInt("10", 8); console.log("a = " + a); // a = 8 a = parseInt("010", 10); console.log("a = " + a); // a = 10 a = parseInt("ff", 16); console.log("a = " + a); // a = 255

В случае если значение стоящие в строке, которую функции parseInt и parseFloat принимают в качестве первого параметра, не представляет собой числовой литерал, то результатом выполнения этих функций будет значение NaN .

a = parseInt("not a number" ) ; console.log ("a = " + a) ; // a = NaN a = parseFloat("not a number" ) ; console.log ("a = " + a) ; // a = NaN

a = parseInt("not a number"); console.log("a = " + a); // a = NaN a = parseFloat("not a number"); console.log("a = " + a); // a = NaN

Строковое преобразование

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

var str = "Object: " + { } ; console.log (str) ; // Object: str = "Array: " + [ 1 , 2 , 3 ] ; console.log (str) ; // Array: 1,2,3 function sum(a, b) { return a + b; } str = "Function: " + sum; console.log (str) ; /* Function: function sum(a, b) { return a + b; } */

var str = "Object: " + {}; console.log(str); // Object: str = "Array: " + ; console.log(str); // Array: 1,2,3 function sum(a, b) { return a + b; } str = "Function: " + sum; console.log(str); /* Function: function sum(a, b) { return a + b; } */

Фактически при приведении объекта к строке неявным образом вызывается метод toString , который так же можно вызвать явно.

var p = { x: 2 , y: 4 } , str; str = p.toString () ; console.log (typeof str) ; // string console.log (str) ; // str = [ 1 , 2 , 3 ] .toString () ; console.log (typeof str) ; // string console.log (str) ; // 1,2,3

var p = {x: 2, y: 4}, str; str = p.toString(); console.log(typeof str); // string console.log(str); // str = .toString(); console.log(typeof str); // string console.log(str); // 1,2,3

Числовое преобразование

Преобразование в число происходит при выполнении математических операций и при выполнении операции сравнения с приведением типа (==, !=), при этом значение false и пустой массив преобразуются в значение 0 типа number .

var a = true + true + true; // 1 + 1 + 1 console.log(a); // 3

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

var arr = [ 1 , 2 , 3 ] ; console.log (arr + 4 ) ; // 1,2,34 function sum(a, b) { return a + b; } console.log (sum + 5 ) ; // function sum(a, b){return a + b;}5

var arr = ; console.log(arr + 4); // 1,2,34 function sum(a, b){return a + b;} console.log(sum + 5); // function sum(a, b){return a + b;}5

Как видно, неявное преобразование типов в js далеко не всегда очевидно, поэтому стоит его избегать, используя функции для явного приведения типов, такие как parseInt , parseFloat и toString .

На этом всё. Как всегда, успехов вам!

В 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. Один из способов - проанализировать его, а другой способ - изменить его тип на число. Все трюки в других ответах (например, унарный плюс) подразумевают неявное принуждение типа строки к числу. Вы также можете сделать то же самое с функцией Number.

Синтаксический

Var parsed = parseInt("97", 10);

ParseInt и parseFloat являются две функции, которые используются для разбора строк в числа. Синтаксический анализ остановится молча, если он попадет в символ, который он не распознает, что может быть полезно для синтаксического анализа строк, например «92px», но это также несколько опасно, поскольку оно не даст вам никакой ошибки при плохом вводе, вместо этого вы "вернем NaN, если строка не начинается с числа. Пробел в начале строки игнорируется. Вот пример того, что делает что-то другое, что вы хотите, и не давая никаких указаний, что все пошло не так:

Var widgetsSold = parseInt("97,800", 10); // widgetsSold is now 97

Это хорошая практика, чтобы всегда указывать десятичную в качестве второго аргумента. В старых браузерах, если строка начиналась с 0, она была бы интерпретирована как восьмеричная, если бы не было указано значение radix, которое привлекло много людей врасплох. Поведение для шестнадцатеричного запуска запускается, если строка начинается с 0x, если не указано значение radix. 0xff . Стандарт фактически изменился с помощью ecmascript 5, поэтому современные браузеры больше не запускают восьмеричные, когда есть ведущее 0, если не указано никаких оснований. parseInt понимает радики до основания 36, и в этом случае как верхние, так и строчные буквы обрабатываются как эквивалентные.

Изменение типа струны на номер

Всех других приемов, упомянутых выше, которые не используют ParseInt, вовлекает неявно принуждать строку в число. Я предпочитаю делать это явно,

Var cast = Number("97");

Это отличается от методов анализа (хотя он по-прежнему игнорирует пробелы). Это более строгий: если он не понимает всю строку, чем возвращает NaN , поэтому вы не можете использовать ее для строк, таких как 97px . Поскольку вам требуется примитивное число, а не объект обертки Number, убедитесь, что перед функцией Number не ставьте new .

Очевидно, что преобразование в число дает значение, которое может быть float, а не целое число, поэтому, если вы хотите целое число, вам нужно его изменить. Есть несколько способов сделать это:

Var rounded = Math.floor(Number("97.654")); // other options are Math.ceil, Math.round var fixed = Number("97.654").toFixed(0); // rounded rather than truncated var bitwised = Number("97.654")|0; // do not use for large numbers

Любого оператор побитового (здесь я сделал побитовую или, но вы можете также сделать двойное отрицание, как в предыдущем ответе или Bitshift) преобразует значение 32-битное целое число, и большинство из них преобразуется в целое число со знаком. Обратите внимание, что это не будет хотеть, чтобы вы искали большие целые числа . Если целое число не может быть представлено в 32 битах, оно будет завершено.

~~"3000000000.654" === -1294967296 // This is the same as Number("3000000000.654")|0 "3000000000.654" >>> 0 === 3000000000 // unsigned right shift gives you an extra bit "300000000000.654" >>> 0 === 3647256576 // but still fails with larger numbers

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

Math.floor("3000000000.654") === 3000000000 // This is the same as Math.floor(Number("3000000000.654"))

Имейте в виду, что все эти методы понимают экспоненциальной нотации, так 2e2 является 200 , а не NaN. Кроме того, Number понимает «Бесконечность», в то время как методы анализа не делают этого.

Пользовательские

Это маловероятно, что любой из этих методов делает именно то, что вы хотите. Например, обычно мне нужна ошибка, возникающая при сбое синтаксического анализа, и мне не нужна поддержка Infinity, экспоненты или ведущие пробелы. В зависимости от вашего использования, иногда имеет смысл написать пользовательскую функцию преобразования.

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

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

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

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

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

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

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