引数を複数受け取る

01 / 05

渡したい値が2つ以上あるとき

「パンを2個」のように、品物と個数の両方を渡したいことがある。引数が1つだけだと足りないよね。

引数は好きなだけ並べられる。, で区切って書くだけだよ。

02 / 05

定義のかっこにも呼び出しのかっこにも、, 区切りで並べる。それだけで複数の値を受け取れるよ。

function order(item, count) {  console.log(`${item}を${count}こ`);}order("パン", 2);order("たまご", 6);

実行結果

パンを2こ
たまごを6こ

03 / 05

受け取る側と渡す側は、書いた順番どおりに対応する。名前で対応するわけじゃないよ。

順番を入れ替えると、そのまま入れ替わった値が入る。エラーにはならずへんな結果が出るだけなので気づきにくいんだ。

function order(item, count) {  console.log(`${item}を${count}こ`);}order("パン", 2);order(2, "パン");

実行結果

パンを2こ
2をパンこ

04 / 05

引数は3つでも4つでも並べられる。増えても考え方は変わらないよ。

足りないぶんは undefined になる。表示がおかしいときは、渡した数と受け取る数が合っているかを数えてみよう。

function report(name, score, rank) {  console.log(`${name} ${score}てん ${rank}い`);}report("ゆい", 88, 2);report("かい", 75);

実行結果

ゆい 88てん 2い
かい 75てん undefinedい

05 / 05

引数がたくさんあると、呼び出す側は順番を覚えていられなくなる。だいたい3つくらいまでが読みやすい目安だよ。

それ以上増えそうなら、関数を分けるか、まとめてオブジェクトで渡すことを考えよう。

それじゃあ、順番を意識しながら書いてみよう。

const showRect = (tate, yoko) => {  console.log(`${tate} x ${yoko} = ${tate * yoko}`);};showRect(3, 5);

実行結果

3 x 5 = 15