01 / 05
Bundle up work into functions
INPUT · Slides
Catching more than one value
02 / 05
Line them up with ,
Line them up ,-separated in the brackets of the definition and in the brackets of the call. That is all it takes to catch several values.
function order(item, count) { console.log(`${item} x${count}`);}order("bread", 2);order("egg", 6);Result
bread x2 egg x6
03 / 05
Order is everything
The catching side and the handing side match up in the order you wrote them. They do not match up by name.
Swap the order and the swapped values go in exactly as given. It is not an error; you simply get an odd result, which makes it hard to notice.
function order(item, count) { console.log(`${item} x${count}`);}order("bread", 2);order(2, "bread");Result
bread x2 2 xbread
04 / 05
Three or more is no different
You can line up three or four parameters. More of them does not change the thinking.
Anything you leave short comes out undefined. When the display looks wrong, count up whether the number handed over matches the number caught.
function report(name, score, rank) { console.log(`${name} ${score} points rank ${rank}`);}report("Yui", 88, 2);report("Kai", 75);Result
Yui 88 points rank 2 Kai 75 points rank undefined
05 / 05
Too many means it is time to split
With a lot of parameters, the calling side can no longer keep the order in mind. About three is a reasonable guide for staying readable.
If it looks like growing beyond that, think about splitting the function, or handing things over gathered up in an object.
Right then, write some with the order in mind.
const showRect = (height, width) => { console.log(`${height} x ${width} = ${height * width}`);};showRect(3, 5);Result
3 x 5 = 15