1
00:00:00,495 --> 00:00:04,910
You learned that you can pass information
called an argument to a function.

2
00:00:04,910 --> 00:00:09,650
The function stores that value in a
parameter and uses it within the function.

3
00:00:09,650 --> 00:00:12,350
Functions can accept
more than one argument.

4
00:00:12,350 --> 00:00:16,410
When calling a function, you're able to
pass multiple arguments to the function.

5
00:00:16,410 --> 00:00:19,120
Each argument gets stored
in a separate parameter and

6
00:00:19,120 --> 00:00:21,640
used as a separate variable
within the function.

7
00:00:21,640 --> 00:00:23,390
Let's revisit the example of you and

8
00:00:23,390 --> 00:00:27,250
your assistant in the useful
goToCoffeeShop function.

9
00:00:27,250 --> 00:00:29,440
Perhaps you not only
want to order a drink but

10
00:00:29,440 --> 00:00:33,850
also get something to eat when your
assistant runs off to the coffee shop.

11
00:00:33,850 --> 00:00:37,940
Currently, the goToCoffeeShop
function is limited to just one item.

12
00:00:37,940 --> 00:00:41,780
You can another parameter in the function
definition by typing a comma,

13
00:00:41,780 --> 00:00:43,480
followed by the parameter name.

14
00:00:43,480 --> 00:00:45,170
Let's call it pastry.

15
00:00:45,170 --> 00:00:49,970
Then update the programming inside the
function to use the new pastry perimeter.

16
00:00:49,970 --> 00:00:52,670
Now this function expects two arguments.

17
00:00:52,670 --> 00:00:53,830
When you call the function,

18
00:00:53,830 --> 00:00:57,710
pass the second argument by typing
a comma followed by a value.

19
00:00:57,710 --> 00:00:59,130
croissant, for instance.

20
00:00:59,130 --> 00:01:02,674
This function is now flexible enough for
you to order a different drink and

21
00:01:02,674 --> 00:01:04,232
pastry each time it's called.

22
00:01:05,930 --> 00:01:09,532
All right, now let's create a function
that uses multiple parameters and

23
00:01:09,532 --> 00:01:10,840
arguments.

24
00:01:10,840 --> 00:01:14,740
This time,
open the file named multiple-args.js.

25
00:01:14,740 --> 00:01:18,577
And as usual,
update the script tag in index.html so

26
00:01:18,577 --> 00:01:21,486
that it points to multiple-args.js.

27
00:01:25,360 --> 00:01:30,080
The function we'll create is going to
calculate the area of a rectangle.

28
00:01:30,080 --> 00:01:33,451
Define a function named getArea,
and the math for

29
00:01:33,451 --> 00:01:37,360
calculating the area is
pretty straightforward.

30
00:01:37,360 --> 00:01:40,710
Multiply the length of
a rectangle by its width.

31
00:01:40,710 --> 00:01:44,269
Let's have this function
accept a length value and

32
00:01:44,269 --> 00:01:47,834
a width value via the parameters width and
length.

33
00:01:49,475 --> 00:01:54,371
Inside the function,
declare a variable named area.

34
00:01:54,371 --> 00:01:59,660
Its value is the result or
product of width times length.

35
00:02:01,670 --> 00:02:05,230
And let's have the function returned the
value of area using a return statement.

36
00:02:07,870 --> 00:02:12,607
Now to use this function,
you call it and pass it a width and

37
00:02:12,607 --> 00:02:16,007
length value, let's say 10 and 20.

38
00:02:16,007 --> 00:02:18,250
Let's view the value in the console.

39
00:02:18,250 --> 00:02:20,450
Once the browser loads JavaScript,

40
00:02:20,450 --> 00:02:24,810
you can call any functions in your
JavaScript file directly from the console.

41
00:02:24,810 --> 00:02:29,940
For example, I'll test the getArea
function by cutting the function call

42
00:02:29,940 --> 00:02:34,060
out of the file, saving the file,
and pasting it in the console.

43
00:02:35,290 --> 00:02:39,690
The function returns an area of 200,
but 200 what?

44
00:02:39,690 --> 00:02:44,190
I want to return a value that includes a
unit of measurement, like square feet and

45
00:02:44,190 --> 00:02:45,080
square meters.

46
00:02:45,080 --> 00:02:48,540
For example, a value like 200-square feet.

47
00:02:48,540 --> 00:02:52,910
To do that, I'll add a third parameter
to the function called unit.

48
00:02:54,040 --> 00:02:58,020
Remember, a function can
only return a single value.

49
00:02:58,020 --> 00:03:01,560
So I'll need to adjust the return
statement to return a string holding

50
00:03:01,560 --> 00:03:03,780
the area and unit.

51
00:03:03,780 --> 00:03:09,379
I'll replace area with a template
literal that uses the ${} syntax,

52
00:03:09,379 --> 00:03:15,633
or string interpolation, to insert the
values of area and unit into the string.

53
00:03:20,660 --> 00:03:25,533
I'll save this file, refresh the page and
back in the console,

54
00:03:25,533 --> 00:03:31,240
I'll press the up arrow key wants to
bring back the getArea function call.

55
00:03:31,240 --> 00:03:35,277
This time I'll pass
the unit value as a string.

56
00:03:38,744 --> 00:03:41,830
Now the console output's 200 sq ft.

57
00:03:41,830 --> 00:03:44,192
I'll try a different set of values.

58
00:03:44,192 --> 00:03:48,122
Let's say 5, And

59
00:03:48,122 --> 00:03:53,313
17.5, sq m.

60
00:03:56,586 --> 00:04:00,065
That returns 87.5 sq m, good.

61
00:04:00,065 --> 00:04:03,830
You're able to pass any number
of arguments to a function.

62
00:04:03,830 --> 00:04:07,302
Too many arguments, however, can make
your functions difficult to manage.

63
00:04:07,302 --> 00:04:11,394
For instance, passing 12 arguments to
a function and adding 12 parameters to

64
00:04:11,394 --> 00:04:15,130
a function definition makes it
challenging to track each value.

65
00:04:15,130 --> 00:04:18,270
In a future course, you'll learn
more efficient ways to pass lots of

66
00:04:18,270 --> 00:04:21,510
pieces of information to a function
with something called an array,

67
00:04:21,510 --> 00:04:24,640
as well as an object literal
that holds multiple values.

68
00:04:24,640 --> 00:04:28,660
For now, keep in mind that passing more
than four or five arguments to a function

69
00:04:28,660 --> 00:04:31,150
can make your function tedious to use and
harder to read.