1
00:00:00,060 --> 00:00:06,030
This lesson is about functions, and this is at the very heart of JavaScript and what JavaScript is

2
00:00:06,030 --> 00:00:06,810
all about.

3
00:00:07,200 --> 00:00:11,820
We're going to be covering what functions are and how to use them and how you can create functions.

4
00:00:12,090 --> 00:00:18,500
So functions are blocks of code, their reusable code, one of the fundamental building blocks of JavaScript.

5
00:00:18,510 --> 00:00:24,210
And in order to use a function just like variables, you need to define them somewhere within the code

6
00:00:24,210 --> 00:00:25,800
in order to call upon them.

7
00:00:25,830 --> 00:00:29,470
Some examples about functions that the module a developer network.

8
00:00:29,490 --> 00:00:31,770
So there's a quick example of a function.

9
00:00:31,770 --> 00:00:37,440
So defining the function, giving it a name and then passing in an argument, running some code.

10
00:00:37,440 --> 00:00:43,140
And you also have an option to return information and you also have an option to return.

11
00:00:43,210 --> 00:00:46,380
And we are going to be looking closer at that later on.

12
00:00:46,500 --> 00:00:48,970
And they've got some examples of functions.

13
00:00:48,990 --> 00:00:56,280
So here they have an example of a function that takes in a parameter and then it updates that parameter

14
00:00:56,460 --> 00:00:59,730
adding in amache into the object.

15
00:00:59,740 --> 00:01:02,780
And of course, more on objects coming up later.

16
00:01:03,000 --> 00:01:04,990
There's also function expressions.

17
00:01:05,340 --> 00:01:10,590
So these are functions, but they're written with the same way as a variable where we're declaring the

18
00:01:10,590 --> 00:01:14,360
name of the function and then it's got the function contents afterwards.

19
00:01:14,580 --> 00:01:17,450
So those are two different ways to write functions.

20
00:01:17,460 --> 00:01:22,900
We are going to be covering a little bit more on these both of these as we go through the upcoming lessons.

21
00:01:22,920 --> 00:01:28,110
Quick example of a function so parameters and then the code that needs to be executed is within the

22
00:01:28,110 --> 00:01:29,110
curly brackets.

23
00:01:29,160 --> 00:01:32,900
We do have a challenge for you and of course, it's in regards to functions.

24
00:01:33,180 --> 00:01:38,850
So what I want you to do is create a function to output a message from a variable in the console.

25
00:01:38,850 --> 00:01:44,580
So in VOC, the function three times every time increasing the value of the global variable that counts.

26
00:01:44,580 --> 00:01:50,460
The number of times this function is run, create a function to output into the console the results

27
00:01:50,460 --> 00:01:53,980
of adding ten to a number that is passed into the function.

28
00:01:54,180 --> 00:01:59,130
So we've got two separate challenges here and you can see the output that we're expecting within the

29
00:01:59,130 --> 00:01:59,700
console.

30
00:01:59,850 --> 00:02:05,040
And this is a quick peek at the code that we're going to be writing can go ahead and pause the video,

31
00:02:05,040 --> 00:02:06,490
create the solution.

32
00:02:06,510 --> 00:02:12,300
So the first challenge is up here and we invoked the function three times, incrementing the counter.

33
00:02:12,300 --> 00:02:18,300
Second one where we're creating a function, where we're adding a value of ten to the number.

34
00:02:18,450 --> 00:02:21,030
So we're passing in a number parameter into there.

35
00:02:21,150 --> 00:02:26,910
And then we're using that as a number and setting a value in the console that we can take a look at.

36
00:02:27,060 --> 00:02:32,520
So pause the video, open up your editor, write it out and I'll show you the solution coming up.

37
00:02:32,550 --> 00:02:38,460
So if you had an opportunity to try out functions, so first we need an output that we're going to declare

38
00:02:38,460 --> 00:02:43,200
a variable and this one can just be a string value holding hello world.

39
00:02:43,380 --> 00:02:48,030
And we're also going to set up a counter and that counter is going to start at zero.

40
00:02:48,040 --> 00:02:53,790
So these are the global variables that we're going to work with and then within the function we're going

41
00:02:53,790 --> 00:02:54,450
to pass.

42
00:02:54,960 --> 00:02:59,910
So we're going to call a function called welcome and pass in the parameter of output into it.

43
00:03:00,210 --> 00:03:04,170
And then down here is where we're going to set up our welcome function.

44
00:03:04,420 --> 00:03:06,450
So it's going to be expecting a parameter.

45
00:03:06,600 --> 00:03:08,520
And this doesn't have to be the same.

46
00:03:08,520 --> 00:03:09,750
It doesn't have to be the message.

47
00:03:09,960 --> 00:03:11,610
You can call this whatever you want.

48
00:03:11,730 --> 00:03:16,690
And then this is how we reference that parameter within the block, a code within the function.

49
00:03:17,010 --> 00:03:23,490
So because counter is global, we can always increment counter and we can also create variables that

50
00:03:23,490 --> 00:03:26,270
are within the function itself.

51
00:03:26,490 --> 00:03:30,990
So we're taking the value of counter and times run.

52
00:03:31,170 --> 00:03:36,240
And this will be our message that we're output into the console so we can see that we're passing in

53
00:03:36,510 --> 00:03:37,080
parameter.

54
00:03:37,090 --> 00:03:38,860
So that's the output of the parameter.

55
00:03:38,880 --> 00:03:40,560
So it's going to say Hello World.

56
00:03:40,860 --> 00:03:45,990
And then we're also outputting our temp, which is our message into the console.

57
00:03:45,990 --> 00:03:47,850
So we're going to have two entries into the console.

58
00:03:48,120 --> 00:03:50,130
So we see the first one is Hello World.

59
00:03:50,280 --> 00:03:55,640
And then we see what one times run where we can call to the function we're passing in a parameter.

60
00:03:55,800 --> 00:03:57,710
So this time the parameter is hello.

61
00:03:57,930 --> 00:03:59,790
So we see that hello gets output.

62
00:04:00,150 --> 00:04:05,370
As for the console there, that's taking whatever parameter we've passed in, it's putting into the

63
00:04:05,370 --> 00:04:11,310
console and then it's incrementing the value of counter because this is global and then we're outputting

64
00:04:11,310 --> 00:04:13,350
that message within that temp area.

65
00:04:13,500 --> 00:04:17,720
You can always change the value of the parameter that's coming in.

66
00:04:17,970 --> 00:04:20,640
So then every time that can be something different.

67
00:04:21,000 --> 00:04:25,890
And then, of course, when we refresh it, we go back to one, because this is written in the code.

68
00:04:26,250 --> 00:04:31,080
The other chap, the other part of the challenge, this was a two part challenge is where we need to

69
00:04:31,080 --> 00:04:32,010
set up a number.

70
00:04:32,280 --> 00:04:38,310
So let's just set up a random number here and then creating a function that we're going to call add

71
00:04:38,310 --> 00:04:42,270
ten and then passing in that value of my number.

72
00:04:42,510 --> 00:04:44,420
And now we need to create the function.

73
00:04:45,090 --> 00:04:52,260
So this function is going to take a number value and it's going to simply add 10 to it and output it

74
00:04:52,260 --> 00:04:53,040
to the console.

75
00:04:53,310 --> 00:04:56,700
So you can also set up temporary variable as well for that.

76
00:04:57,240 --> 00:04:59,910
Make sure that whatever value is coming in is.

77
00:04:59,990 --> 00:05:06,800
A number which we know it is so it is 50 and then we're going to console log the value of temp plus

78
00:05:06,800 --> 00:05:07,180
10.

79
00:05:07,310 --> 00:05:10,850
So every time, whatever number we want to pass in.

80
00:05:10,970 --> 00:05:12,710
So this can be any number at all.

81
00:05:12,920 --> 00:05:18,080
And every time we pass and a number, what the function is going to do is it's going to take that number

82
00:05:18,230 --> 00:05:21,380
value that's being passed in, add 10 to it.

83
00:05:21,470 --> 00:05:26,660
It doesn't matter what number we pass in or how many times we run it.

84
00:05:26,840 --> 00:05:30,280
And that's the whole purpose of a function using the parameters.

85
00:05:30,280 --> 00:05:31,760
So you don't have to have parameters.

86
00:05:31,920 --> 00:05:35,100
You can just run the functions as on their own as well.

87
00:05:35,300 --> 00:05:40,520
And before we conclude, I realize that we do need to output welcome three times.

88
00:05:40,640 --> 00:05:44,860
So we're going to be invoking the welcome function three times so we get our output.

89
00:05:44,900 --> 00:05:46,700
Hello world one times run.

90
00:05:46,820 --> 00:05:48,440
Hello World two times run.

91
00:05:48,560 --> 00:05:53,860
Hello World three times run and then we're passing in our number and returning back 60.

92
00:05:54,080 --> 00:05:56,420
So we're matching all of the criteria that we set out.

93
00:05:56,690 --> 00:06:02,480
So coming up next, even more on functions, how you can pass in multiple parameters using the default

94
00:06:02,480 --> 00:06:04,070
argument with functions.

95
00:06:04,450 --> 00:06:05,420
So that's still to come.