JavaScript - Mitsuyuki Shiibaさん( @bufferings )のツイート、gim_kondoさん( @gim_kondo )のQiitaのPostより - 配列、map関数と引数、parseInt関数の引数について

JavaScript 第6版
楽天ブックス Yahoo!
原著: JavaScript:
The Definitive Guide:
Activate Your Web Pages

JavaScript: The Good Parts ―
「良いパーツ」によるベストプラクティス
楽天ブックス! Yahoo!
原著: JavaScript: The Good Parts

開発環境

• macOS Catalina - Apple (OS)
• Emacs (Text Editor)
• Windows 10 Pro (OS)
• Visual Studio Code (Text Editor)
• JavaScript (プログラミング言語)
• Node.js v12.16.3(処理系)

へーhttps://t.co/jMR7gpXdoe

— Mitsuyuki Shiiba (@bufferings) May 30, 2020

JavaScriptのmap/parseInt問題の解説 - Qiitaの

以上を踏まえて、先のコードがどう動くか考えてみます。

について、考えてみるだけではなく、実際に実行して挙動を見ることができるようにしてみた。

コード

let strnums = ['10', '10', '10'],
    result = strnums.map((...args) => args);

// mapに渡す関数に渡される引数のみについて
console.log(result);

// ということで、parseIntをmap関数に渡した結果
result = strnums.map(parseInt)
console.log(result);

// 何が起きているか詳しく
result = strnums.map((...args) =>
    `parseInt(${args[0]}, ${args[1]}, [${args[2]}]) => ${parseInt(...args)} `);
console.log(result);

// 最後にJavaScript Good Partsに記述がある良い方法
// parseInt関数には常に明示的に第2引数を指定する
result = strnums.map((s) => parseInt(s, 10));
console.log(result);

入出力結果(Zsh、PowerShell、Terminal)

% node sample.js
[
  [ '10', 0, [ '10', '10', '10' ] ],
  [ '10', 1, [ '10', '10', '10' ] ],
  [ '10', 2, [ '10', '10', '10' ] ]
]
[ 10, NaN, 2 ]
[
  'parseInt(10, 0, [10,10,10]) => 10 ',
  'parseInt(10, 1, [10,10,10]) => NaN ',
  'parseInt(10, 2, [10,10,10]) => 2 '
]
[ 10, 10, 10 ]
%