В JavaScript результат вызова функции ['1', '5', '11'].map(parseInt) может сильно озадачить.

console.log(['1', '5', '11'].map(parseInt))

Результат:

[1, NaN, 3]

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

map

Метод map применяет к каждому элементу массива указанную функцию. При этом в качестве аргумента map передаёт указанной функции три аргумента: элемент массива, его индекс и сам массив, по которому осуществляется проход.

parseInt

Функция parseInt() принимает строку sting в качестве аргумента и возвращает целое число в соответствии с указанным основанием системы счисления radix (целое число в диапазоне от 2 до 36). В случе неудачи parseInt возвращает NaN.

Взаимодействие

При использовании parseInt в map метод map передает индекс элемента в качестве второго аргумента parseInt, что приводит к неожиданному результату:

1. Для первого элемента массива ‘1’ (индекс 0) вызывается parseInt('1', 0). Основание 0 означает, что основание угадывается на основе формата строки, по умолчанию 10. Результат: 1.
2. Для второго элемента массива ‘5’ (индекс 1) вызывается parseInt('5', 1). Но 1 не является допустимым основанием, поэтому результатом является NaN.
3. Для третьего элемента ‘11’ (индекс 2) вызывается parseInt('11', 2). Здесь 2 означает двоичный. Допустимые двоичные цифры — 1, что дает 3 (так как 1*2^1 + 1*2^0 = 3).

Решение

Чтобы parseInt гарантированно получал только элемент массива, можно использовать стрелочную функцию:

console.log(['1', '5', '11'].map(num => parseInt(num))); // [1, 5, 11]

или конструктор Number:

console.log(['1', '5', '11'].map(Number)); // [1, 5, 11]

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

Спасибо за внимание.