1
00:00:01,440 --> 00:00:05,730
In this video we're going to dissect the ad function just a little bit and get a better idea about how

2
00:00:05,730 --> 00:00:08,130
it type imitation works with functions.

3
00:00:08,130 --> 00:00:14,130
So once again every time we add in an argument list we're always going to annotate every single argument.

4
00:00:14,130 --> 00:00:18,420
Likewise right after that argument list we're going to add an annotation for what the function will

5
00:00:18,420 --> 00:00:25,020
return and when we add in the return annotation right there typescript is going to immediately analyze

6
00:00:25,050 --> 00:00:27,250
the body of your function.

7
00:00:27,300 --> 00:00:32,580
So it's literally going to read the code inside there and decide whether or not you actually are returning

8
00:00:32,610 --> 00:00:38,130
a value that is a number in this case typescript knows that A and B are numbers.

9
00:00:38,230 --> 00:00:40,100
It sees that we add them together.

10
00:00:40,270 --> 00:00:45,820
It knows that adding two numbers together results in a number and then it sees that we return that value.

11
00:00:45,880 --> 00:00:50,800
So typescript can read this line of code right here and understand that we have done exactly what we

12
00:00:50,800 --> 00:00:56,220
said we were going to do if we returned some other type of value from the function like a string like

13
00:00:56,230 --> 00:01:01,500
so we'll very quickly get an error because now typescript has read the body of our function again and

14
00:01:01,500 --> 00:01:06,450
seen that we are returning a string as opposed to the number we said we were going to do.

15
00:01:06,450 --> 00:01:10,650
So if I hover over that it says specifically hey you're trying to return a String you're supposed to

16
00:01:10,650 --> 00:01:11,780
return a number.

17
00:01:11,940 --> 00:01:17,390
So I can reverted back over to a plus b no one really important thing to understand here.

18
00:01:17,420 --> 00:01:21,950
This is kind of getting into one of the more interesting sides of types although we've declared what

19
00:01:21,950 --> 00:01:27,260
type of value we are going to return typescript is not going to try to make sure we actually have the

20
00:01:27,260 --> 00:01:30,050
correct code inside the function.

21
00:01:30,050 --> 00:01:32,600
Now I know that sounds kind of weird but let me tell you what I mean by that.

22
00:01:33,350 --> 00:01:37,790
You and I wrote a function here called add and so I think any engineer who looks at this function would

23
00:01:37,790 --> 00:01:43,100
say OK if I call this it's going to add two numbers together and then we added in some annotation to

24
00:01:43,100 --> 00:01:47,870
say oh yeah the function is going to return a number typescript can make sure that we are returning

25
00:01:47,870 --> 00:01:54,290
the correct type of value but it does not actually tried to make sure that we have the correct logic

26
00:01:54,440 --> 00:01:57,280
inside of our application or inside this function.

27
00:01:57,290 --> 00:02:01,580
So in other words we could very easily return the difference between a and b.

28
00:02:01,610 --> 00:02:06,270
So no longer are we adding we're now subtracting but typescript doesn't care about that.

29
00:02:06,560 --> 00:02:10,010
It just says hey returning a number works for me.

30
00:02:10,010 --> 00:02:14,210
Now this might seem like a really obvious thing but it's going to have some really big impacts on some

31
00:02:14,210 --> 00:02:16,060
later topics we discuss.

32
00:02:16,160 --> 00:02:19,400
Remember that type system is just concerned with types.

33
00:02:19,400 --> 00:02:24,770
It doesn't actually vet your actual logic inside the function and make sure you're doing the right thing

34
00:02:24,800 --> 00:02:26,500
so to speak.

35
00:02:26,550 --> 00:02:26,800
All right.

36
00:02:26,820 --> 00:02:29,960
I'm going to restore that to a plus b now.

37
00:02:29,960 --> 00:02:34,500
Last thing I want to mention here is just a little bit more around annotations and type inference.

38
00:02:34,530 --> 00:02:37,750
It's a quick diagram of this function all right.

39
00:02:37,760 --> 00:02:38,980
Here we go.

40
00:02:39,020 --> 00:02:40,380
So here's our ad function.

41
00:02:40,490 --> 00:02:42,650
We have two arguments into it.

42
00:02:42,650 --> 00:02:49,380
They are both numbers and we have a single output that is a number as well so when we think about the

43
00:02:49,410 --> 00:02:53,560
arguments we have to always use type annotation.

44
00:02:53,730 --> 00:03:00,030
In other words we have to write out colon no colon number right there every single time we define a

45
00:03:00,030 --> 00:03:01,040
function.

46
00:03:01,080 --> 00:03:03,270
There are some corner cases where we do not.

47
00:03:03,270 --> 00:03:06,800
But right now we'll just kind of ignore those we'll discuss them later on.

48
00:03:06,810 --> 00:03:11,970
So whenever you and I write a function in this course we are always going to add in these annotations

49
00:03:12,150 --> 00:03:20,790
every time we write out a function so we do not get any type inference on arguments arguments we're

50
00:03:20,790 --> 00:03:23,180
always going to add in those annotations.

51
00:03:23,430 --> 00:03:30,420
However on the other side over here for the output from the function we do get the benefit of type inference

52
00:03:30,630 --> 00:03:32,580
but we're not going to use it.

53
00:03:32,620 --> 00:03:34,930
And so let me clarify what's going on there.

54
00:03:35,070 --> 00:03:40,100
Back over inside my function I went to find the return value annotation right here and delete it.

55
00:03:41,240 --> 00:03:47,000
If I now hover over add I'll see an annotation on the variable itself that says that ad is referring

56
00:03:47,000 --> 00:03:53,040
to a function that takes two numbers and returns a number so that's type inference in play.

57
00:03:53,080 --> 00:03:59,290
We did not add in a type return annotation but types could read the body of our function and it knows

58
00:03:59,290 --> 00:04:01,540
that we are going to return a number.

59
00:04:01,540 --> 00:04:06,750
So just like we saw with the inference before with variable declarations we have type inference around

60
00:04:06,940 --> 00:04:14,060
only the return value from a function so we don't have to add in that return annotation if we don't

61
00:04:14,060 --> 00:04:15,110
want to.

62
00:04:15,110 --> 00:04:20,530
However like I said you and I always always always will and here's why.

63
00:04:21,140 --> 00:04:28,090
Let's imagine we've got another function here called subtract and this is also gonna take two arguments

64
00:04:28,150 --> 00:04:30,580
a and b they're both going to be numbers.

65
00:04:30,580 --> 00:04:32,610
And I'm going to leave off the annotation.

66
00:04:32,860 --> 00:04:37,870
So then inside of here we'll just subtract the two numbers like so and yeah okay.

67
00:04:37,930 --> 00:04:42,600
I think that's it we're good to go so do you notice anything missing here.

68
00:04:42,600 --> 00:04:48,600
Well I didn't put on a return statement so if I hover over subtract right now you'll see that we get

69
00:04:48,600 --> 00:04:54,630
an annotation on here that says that we have two arguments as inputs a and b and then we have a return

70
00:04:54,630 --> 00:05:01,920
value a void which means that we are not returning anything at all so typescript has use type inference

71
00:05:01,920 --> 00:05:07,050
here to say hey since you're not returning anything from the function I guess you don't mean to turn

72
00:05:07,050 --> 00:05:12,540
anything return anything from the function we made a mistake we did not return a value in typescript

73
00:05:12,540 --> 00:05:18,790
has not done anything to tell us that we made a mistake inside of this function so if we instead add

74
00:05:18,790 --> 00:05:24,480
in an annotation for the return type right here of number like so we'll very quickly see a error message

75
00:05:24,870 --> 00:05:29,550
that would be our signal that hey we probably made a mistake inside the function and we should add on

76
00:05:29,550 --> 00:05:35,120
a return like so so that's why you and I are always going to use return annotations is because we could

77
00:05:35,120 --> 00:05:41,600
very easily make a mistake inside of a function and forget to return a value or even return an incorrect

78
00:05:41,600 --> 00:05:42,860
type.

79
00:05:42,860 --> 00:05:47,330
If we do so typescript is not going to give us an error it's just going to think oh that's what the

80
00:05:47,330 --> 00:05:48,890
developer meant to do.

81
00:05:48,950 --> 00:05:53,170
The only way that we're going to get an error is if we add on that annotation right there.

82
00:05:53,180 --> 00:05:58,670
So like I said although we get inference on the output from my function we are not going to use it.

83
00:05:58,670 --> 00:06:02,530
We're always going to add that annotation in all right.

84
00:06:02,540 --> 00:06:05,740
So that's functions in a nutshell one or two quick more topics.

85
00:06:05,740 --> 00:06:07,690
So quick pause and I'll see you in just a minute.