1
00:00:00,180 --> 00:00:06,570
In this lesson, we're going to be looking at the new six era format for functions, so it's a shorthand

2
00:00:06,570 --> 00:00:08,480
way of writing functions.

3
00:00:08,880 --> 00:00:10,920
And I did want to expose you to this.

4
00:00:11,310 --> 00:00:18,180
It's available in most of the browsers are going to be compatible with S6 and some of the older browsers

5
00:00:18,180 --> 00:00:22,540
may not be so always keep that in mind when you are using the newer format.

6
00:00:22,830 --> 00:00:29,070
So this is an example of how to rate the function expression and the format is the same thing.

7
00:00:29,100 --> 00:00:31,830
So this is the one that we've got it up here at the top.

8
00:00:31,830 --> 00:00:36,330
And then down here we've got this short arrow format for functions.

9
00:00:36,510 --> 00:00:39,120
So notice that the word function is gone.

10
00:00:39,150 --> 00:00:40,800
All we have is the rounded brackets.

11
00:00:40,960 --> 00:00:43,680
We're still able to pass in arguments and parameters.

12
00:00:43,830 --> 00:00:47,760
And then we've got this equal sine and the greater than sine.

13
00:00:47,910 --> 00:00:51,590
And then what we're returning back is the X times five.

14
00:00:51,780 --> 00:00:55,780
So this is how we can write the function and the output is going to be the same thing.

15
00:00:55,800 --> 00:01:00,800
So if you're to test this out, you're able to see that it outputs it within the same format.

16
00:01:01,080 --> 00:01:04,680
So there's also a really great resource, which is the Bible.

17
00:01:04,680 --> 00:01:07,020
James eyehole on line.

18
00:01:07,020 --> 00:01:11,730
And this gives you the ability to convert JavaScript code to older versions.

19
00:01:11,940 --> 00:01:16,500
So if you did want to check that out, it's always a really good resource to check out and to get more

20
00:01:16,500 --> 00:01:17,160
familiar with.

21
00:01:17,370 --> 00:01:22,530
So if you do want to make your JavaScript code more compatible or older compatible, you can copy it

22
00:01:22,530 --> 00:01:26,060
in here and have it rendered out into the older format.

23
00:01:26,250 --> 00:01:32,340
So if you were to take our example where we've got VAR or we're going to do the new version where we've

24
00:01:32,340 --> 00:01:39,480
got const test 11 and then the equals sign, we're passing in the argument, what we're doing is we're

25
00:01:39,480 --> 00:01:44,790
taking the value of X and we're multiply it by five to return a value right away.

26
00:01:44,790 --> 00:01:47,670
It's, it's already showing us that example.

27
00:01:47,850 --> 00:01:52,730
So this is how it would have been written within the older versions of JavaScript.

28
00:01:52,890 --> 00:01:58,390
So we've got a bunch of presets here and we can convert it to different versions of JavaScript.

29
00:01:58,590 --> 00:02:03,500
So really handy resource, especially when you want to make your content more backwards compatible.

30
00:02:03,870 --> 00:02:06,050
So I do suggest that you do try that one out.

31
00:02:06,450 --> 00:02:12,450
So in order to write the arrow functions, the formats, you need to declare the variable, of course,

32
00:02:12,450 --> 00:02:17,550
and give it a name of the function in order so that you can invoke it later on, that you can connect

33
00:02:17,550 --> 00:02:18,450
to it later on.

34
00:02:18,700 --> 00:02:23,340
You also need to define the body within the curly brackets.

35
00:02:23,490 --> 00:02:30,210
So just as any other function, the way that it works is that we have the body of the function within

36
00:02:30,210 --> 00:02:31,250
the curly brackets.

37
00:02:31,530 --> 00:02:36,540
So the challenge for this lesson is to convert one of the earlier functions that we used in the course

38
00:02:36,840 --> 00:02:40,770
to the newer format with the Arrow function format.

39
00:02:40,980 --> 00:02:42,810
So you can take any one of the functions.

40
00:02:42,810 --> 00:02:44,400
And we've had plenty of examples.

41
00:02:44,640 --> 00:02:50,550
You can go back or you can create your own as a sample, collect any function you want to try it out

42
00:02:50,670 --> 00:02:51,910
and get familiar with it.

43
00:02:51,930 --> 00:02:55,200
Go ahead, pause the video and we'll walk you through a solution.

44
00:02:55,200 --> 00:02:59,250
Coming up, it's opening up the header and the way that we've been writing them before.

45
00:02:59,520 --> 00:03:00,990
So we're passing in an argument.

46
00:03:00,990 --> 00:03:02,580
We can use X as well.

47
00:03:02,760 --> 00:03:09,170
And in this case, we're going to return X, multiply it by 10 and we'll put it into the console.

48
00:03:09,750 --> 00:03:17,460
So take that variable, that function test, pass it into and output it into the console so we get back

49
00:03:17,460 --> 00:03:18,180
nine hundred.

50
00:03:18,570 --> 00:03:19,290
So that worked.

51
00:03:19,710 --> 00:03:26,730
Now let's convert this into the Arrow format where we've got tests, you can call it test two.

52
00:03:27,300 --> 00:03:29,430
So this is peaking in the same thing.

53
00:03:29,430 --> 00:03:35,010
So the format is the same where we're taking in the arguments, giving it, assigning it a value of

54
00:03:35,010 --> 00:03:40,980
X to declare it, and then we're simply taking that value back and returning it back by ten.

55
00:03:41,040 --> 00:03:45,120
And we're going to pass that into test to do a quick refresh.

56
00:03:45,120 --> 00:03:46,650
And we do get the same value.

57
00:03:46,660 --> 00:03:47,690
So it works the same way.

58
00:03:47,910 --> 00:03:54,300
So this is a great example of how you can start working with the Arrow format and become more familiar

59
00:03:54,300 --> 00:03:54,630
with it.