Разница ParseInt, ParseFloat и Number

#javascript #javascript_faq

Всем привет! Скажите, в чём разница между функциями ParseFloat, ParseInt и Number?
В результате этих функций строка преобразуется в число.



alert('3' + 2);
//--------------------------//
alert(parseFloat('3') + 2);
alert(parseInt('3') + 2);
alert(Number('3') + 2);



    

Ответы

Ответ 1

В двух словах:

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

Number - целую строку, так же отбросив предварительно пробельные символы.

Различие можно увидеть на примере



//--------------------------//
console.log(parseFloat('3a'));
console.log(parseInt('3a'));
console.log(Number('3a'));






Развернутый ответ

Для более полного понимания различий можно обратиться к спецификации

Начать можно с конструктора Number

Если данная функция вызывается без new, то


Если не передали параметров результат будет +0
Если параметр (value) передан, то будет возвращен результат вызова ToNumber(value)


Где ToNumber(value) - это абстрактная функция, вызываемая, когда необходимо получить
числовое значение.

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

В случае, если value был приведен к строке, эта строка должна удовлетворять грамматике
для StringNumericLiteral. Отличие данной грамматики от обычного NumericLiteral, который
определяет правила для литералов чисел, в том, что:


StringNumericLiteral может включать в себя лидирующие и/или оконечные пробелы и/или
разделители строк.
StringNumericLiteral в десятичном виде может иметь любое количество лидирующих нулей.
StringNumericLiteral в десятичном виде может включать + или - для указания знака числа.
StringNumericLiteral с пустой строкой, либо содержащий только пробельный символы
будет конвертирован в +0.
Infinity и -Infinity будут распознаны как StringNumericLiteral, но не как NumericLiteral.




Функция parseInt

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

Стоит отметить, что первый аргумент всегда приводится к строке.

Алгоритм работы данной функции весьма прост:


Отбрасываются пробельные символы с начала строки
Определяется знак числа
Выставляет флаг нужно ли отбрасывать префикс, в том случае, если основание равно
16 или не передано.
Если нужно отбрасывать префикс: 


отбрасываются первые два символа, если они равны 0x или 0X
основанию устанавливается значение 16

Если в строке присутствуют символы не соответствующие основанию, то выбирается подстрока,
перед первым таким символом.
Вычисляется математическое целочисленное значение, соответствующее выбранной подстроке.
Символы A-Z и a-z используются для представления значений от 10 до 35 в соответствующих
системах счисления.
полученный результат умножается на знак и возвращается.


Как можно заметить, в отличие от описанной выше функции Number, для разбора используется
не вся строка, распознается только префикс для шестнадцатеричных чисел, но при этом
добавляется возможность указать основание системы счисления от 2 до 36



Функция parseFloat

Как и в parseInt, в данной функции всегда идет приведение аргумента к строке.

Алгоритм схож с работой функции parseInt


Отбрасываются пробельные символы с начала строки
Определяется удовлетворяет ли оставшаяся строка или любой из ее префиксов синтаксису
StrDecimalLiteral


если нет, возвращается NaN
если да - берется максимальный префикс.

Возвращается соответствующее число.


Как можно заметить, по сравнению с Number, для разбора используется часть строки,
не допустимы никакие префиксы вроде 0x, 0b, 0o. В отличие от parseInt допустима e-нотация



Больше примеров



function showOutput(str, base) {
  console.log('строка:"' + str + '"', 'Number:', Number(str), 'parseInt:', parseInt(str,
base), 'base:', base || 10, 'parseFloat:', parseFloat(str));
}

showOutput('  ');
showOutput('10');
showOutput('3a');
showOutput('0x10');
showOutput('0x10s');
showOutput('0o10');
showOutput('1e2');
showOutput('1e2', 16);
.as-console-wrapper {
  max-height: 100% !important;
  top: 0;
}