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

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

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

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

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

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

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

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

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

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

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

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

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

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

Функция parseInt

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

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

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

1. Отбрасываются пробельные символы с начала строки
2. Определяется знак числа
3. Выставляет флаг нужно ли отбрасывать префикс, в том случае, если основание равно 16 или не передано.
4. Если нужно отбрасывать префикс:
   1. отбрасываются первые два символа, если они равны 0x или 0X
   2. основанию устанавливается значение 16
5. Если в строке присутствуют символы не соответствующие основанию, то выбирается подстрока, перед первым таким символом.
6. Вычисляется математическое целочисленное значение, соответствующее выбранной подстроке. Символы A-Z и a-z используются для представления значений от 10 до 35 в соответствующих системах счисления.
7. полученный результат умножается на знак и возвращается.

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

Функция parseFloat

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

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

1. Отбрасываются пробельные символы с начала строки
2. Определяется удовлетворяет ли оставшаяся строка или любой из ее префиксов синтаксису StrDecimalLiteral
   1. если нет, возвращается NaN
   2. если да - берется максимальный префикс.
3. Возвращается соответствующее число.

Как можно заметить, по сравнению с 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; 
}