1
00:00:02,170 --> 00:00:07,640
So it's time to write some Javascript code in this app.js file and for that, I'll first of all clear the alert

2
00:00:07,660 --> 00:00:08,600
code.

3
00:00:08,650 --> 00:00:15,940
Now our goal is to write a very basic calculator here where we can enter a number here and add this

4
00:00:15,940 --> 00:00:18,250
to the last number we entered up there,

5
00:00:18,400 --> 00:00:23,680
so basically a calculator where we can always work with two numbers add add a new number to the old

6
00:00:23,680 --> 00:00:24,150
result

7
00:00:24,160 --> 00:00:25,240
and so on.

8
00:00:25,240 --> 00:00:26,560
So that's the goal here,

9
00:00:26,560 --> 00:00:28,030
such a basic calculator.

10
00:00:28,030 --> 00:00:33,660
Now for that, we'll need a couple of important pieces that will actually be found in most Javascript

11
00:00:33,670 --> 00:00:38,020
programs, for example variables and constants,

12
00:00:38,020 --> 00:00:43,150
that's a core feature, not just of Javascript but of most programming languages.

13
00:00:43,160 --> 00:00:47,200
Now what are variables and constants? In Javascript,

14
00:00:47,200 --> 00:00:53,720
you define a variable like this and I'll dive into the exact meaning here in a second.

15
00:00:53,740 --> 00:00:58,000
Now what a variable is is it's a data container or data storage

16
00:00:58,000 --> 00:01:03,540
you could say. In most programs you're going to write, you're going to work with some data,

17
00:01:03,670 --> 00:01:08,990
be that a user name entered by the user which you then use to log the user in

18
00:01:09,190 --> 00:01:11,920
or as an example of our calculator,

19
00:01:11,920 --> 00:01:18,940
be that our last, our most recent result we have and the number the user just entered which we want to

20
00:01:18,940 --> 00:01:19,830
add.

21
00:01:19,900 --> 00:01:26,240
So that would be data that we want to store because our program needs that data to work correctly,

22
00:01:26,260 --> 00:01:32,030
for example in the calculator we need the old result and the number the user just entered,

23
00:01:32,050 --> 00:01:36,490
so we need these two pieces of data to derive the new result.

24
00:01:36,490 --> 00:01:41,740
So we need these two variables to get our new third variable, the current result.

25
00:01:41,740 --> 00:01:48,400
So a variable is a data container which holds some data and in Javascript, we create a variable by using

26
00:01:48,400 --> 00:01:55,780
the let keyword which you see here on the left, then a name of your choice with some naming rules in

27
00:01:55,780 --> 00:01:57,770
mind which I'll dive into later,

28
00:01:58,030 --> 00:02:02,380
then an equal sign and then the value you want to store in the variable.

29
00:02:02,380 --> 00:02:08,080
Now with a variable created, you can also always reassign it and store a new value in there,

30
00:02:08,080 --> 00:02:14,110
so here I'm using the existing variable user name and I assign a new value to it.

31
00:02:14,140 --> 00:02:21,550
Now I only need the let keyword, which Javascript understands, if you introduce a variable for the first

32
00:02:21,550 --> 00:02:22,480
time.

33
00:02:22,570 --> 00:02:27,090
If you then assign a new value to it, you don't repeat that keyword,

34
00:02:27,100 --> 00:02:32,590
so you only need the let keyword to let Javascript know hey here's a brand new variable my program will

35
00:02:32,590 --> 00:02:33,140
need,

36
00:02:33,250 --> 00:02:38,590
if you then use that variable thereafter, you do that without let. So a variable is a data container

37
00:02:38,680 --> 00:02:45,870
where the value can change, doesn't have to but often it will. Now you also have a special form of

38
00:02:45,900 --> 00:02:48,880
that variable you could say, you have constants,

39
00:02:49,200 --> 00:02:54,760
for example let's say you have a total amount of users in your application which is kind of fixed.

40
00:02:54,960 --> 00:03:01,170
Now that's still a data container but instead of with the let keyword, you create it with the const

41
00:03:01,200 --> 00:03:07,650
keyword, another keyword which is built into Javascript, which Javascript recognizes and understands.

42
00:03:08,530 --> 00:03:15,780
Now the special thing about constants created with the const keyword is that there, you can't change the

43
00:03:15,780 --> 00:03:19,330
value, if you try to do that, you'll get an error.

44
00:03:19,710 --> 00:03:20,750
So there,

45
00:03:20,760 --> 00:03:24,030
the values must not change.

46
00:03:24,050 --> 00:03:31,680
Now you might wonder why you would have some value stored in a variable if that's not really variable,

47
00:03:31,680 --> 00:03:33,570
if it can't really change

48
00:03:33,690 --> 00:03:40,530
and the answer is sometimes in your code, you have values which never change which you still want to

49
00:03:40,530 --> 00:03:45,140
store in such a data container so that you can initialize them in a central place,

50
00:03:45,150 --> 00:03:51,210
let's say at the beginning of your file and then use them throughout your program, maybe use the same constant

51
00:03:51,240 --> 00:03:53,220
multiple times in different places

52
00:03:53,220 --> 00:03:59,010
so you will always reference the same single constant and if you then ever, in code when writing your

53
00:03:59,010 --> 00:04:04,770
code, you change that value, you change it in one place instead of ten different places but that will become

54
00:04:04,770 --> 00:04:08,760
clearer once we start writing some code which we'll do in a second.

55
00:04:08,760 --> 00:04:14,880
For now, just be aware of these two different ways of creating variables, with let and with const, where

56
00:04:14,970 --> 00:04:21,600
variables with let can be changed, with const they can't be, the general syntax is keyword name

57
00:04:21,750 --> 00:04:27,810
and then if you want to store a value right away, equal sign at the value and also one little hint right

58
00:04:27,810 --> 00:04:28,470
away,

59
00:04:28,470 --> 00:04:34,830
you typically want to use constants as often as possible, which might sound strange at first because

60
00:04:34,860 --> 00:04:37,650
they're restricted in what you can do with them, right?

61
00:04:37,650 --> 00:04:43,110
You can't change them but that's exactly why you want to use them as often as possible,

62
00:04:43,140 --> 00:04:48,750
it makes your intentions very clear. If you have a value which actually never changes throughout the

63
00:04:48,750 --> 00:04:55,470
lifecycle of your program or of the part of your code where you use it, well then you want to make that

64
00:04:55,470 --> 00:05:02,940
clear so that if any other developer ever reads your code quickly understands that this piece of data

65
00:05:02,940 --> 00:05:04,270
is never going to change,

66
00:05:04,290 --> 00:05:11,330
it simply makes your code easier to understand for others. Now that was a lot of new and very theoretic

67
00:05:11,420 --> 00:05:12,320
knowledge,

68
00:05:12,320 --> 00:05:15,530
it will make more sense once we use it, so let's use it.