Original subtitles

1 1

Let's now take a look at 2

2

the three different ways of declaring variables 3

3

in JavaScript. 4

4

So, up until this point, we have always used 5

5

the let keyword to declare variables. 6

6

However, there are also const and var. 7

7

Now, let and const were introduced in ES6, 8

8

and so they are modern JavaScript. 9

9

While the var keyword is the old way of declaring variables. 10

10

So, let's learn how they are different and which one to use 11

11

in which situations. 12

12

And let's, again, start by getting rid of this code. 13

13

Actually, all I will do is move this to the end 14

14

and in the future, I will just do this before recording 15

15

the next video. 16

16

So anyway, we use the let keyword to declare variables 17

17

that can change later so basically during the execution 18

18

of our program and that's exactly what we did here. 19

19

So, we used let to declare JavaScript is fun, 20

20

and then we changed that later from true to yes. 21

21

But for example, or another example I would say is 22

22

let's set the age to 30 at one point of the program. 23

23

And then in another point of the program, 24

24

we can change it to something else. 25

25

For example, when the person turns 31 26

26

and then the age of course changes from 30 to 31. 27

27

And so, it's perfectly okay to declare a variable 28

28

with let at one point in the program, 29

29

and then later assign a new value to it. 30

30

In technical terms, we call this reassigning a value to 31

31

a variable, or also we say that we mutate 32

32

the age variable in this case. 33

33

So, it was 30 and now it's 31, 34

34

and so we mutated the variable, okay? 35

35

So, that's a term that you will hear all the time 36

36

in the JavaScript world. 37

37

So, when we need to mutate a variable, 38

38

that's the perfect use case for using let 39

39

and that also counts for the case that we want 40

40

to declare empty variables. 41

41

So for example, as we did here, where we declared 42

42

an empty year and then later reassigned that variable 43

43

to 1991, and sometimes we actually do this in practice. 44

44

For example, when we want to declare all the variables 45

45

at the top of a file, 46

46

but only assign actual values to them later in the program, 47

47

for example, based on some condition. 48

48

Now, on the other hand, we use the const keyword 49

49

to declare variables that are not supposed to change 50

50

at any point in the future. 51

51

So, the value in a const variable cannot be changed. 52

52

For example, let's say the birth year, 1991 for example. 53

53

If we then tried to reassign that let's say to 1990, 54

54

it should not work. 55

55

So, let's test that, and indeed we get a type error. 56

56

So, assignment to constant variable. 57

57

And so, that's exactly what the const keyword does. 58

58

It creates a variable that we cannot reassign 59

59

or in technical terms, an immutable variable. 60

60

So, a variable that cannot be mutated, okay? 61

61

And the birth year is a perfect example for that 62

62

because in fact, the birth year of a person can never change 63

63

while the age of course can change. 64

64

And so that's why we used let for the age 65

65

and const for the birth year, okay? 66

66

That makes sense? 67

67

Now the fact that variables created 68

68

with const are immutable also means 69

69

that we cannot declare empty const variables. 70

70

For example, this is not legal. 71

71

So, let's comment out this one here, again with command 72

72

or control slash so that it doesn't get in our way here. 73

73

And then reload, and then we get 74

74

an error missing initializer in const declaration. 75

75

And so this error message means that 76

76

when using const, we need basically an initial value. 77

77

Alright, so just like here. 78

78

Now with these two different ways of declaring variables, 79

79

you will probably ask, should I use let, 80

80

or should I use const to declare a new variable? 81

81

Well, as a best practice for writing clean code, 82

82

I always recommend to use const by default and let only 83

83

when you are really sure that the variable needs to change 84

84

at some point in the future. 85

85

For example, when you have a variable 86

86

that's really never supposed to change like this birth year, 87

87

you should always use const. 88

88

Also, if you are sure 89

89

that the age variable is never changing inside your program, 90

90

you should declare it using const as well. 91

91

The reason for this is that it's a good practice 92

92

to have as little variable mutations 93

93

or variable changes as possible 94

94

because changing variables introduces a potential 95

95

to create bugs. 96

96

So, basically errors in your code. 97

97

So again, by default, always just use const and let, 98

98

when you're sure that the value of the variable needs 99

99

to change at some point in your code. 100

100

And so from now on, I will probably use the const way 101

101

of declaring variables as much as possible. 102

102

Now, there's also a third way in JavaScript 103

103

of declaring variables, which is the var keyword, 104

104

but this one should actually be completely avoided, okay? 105

105

However, we should still know how it works 106

106

for legacy reasons because you will see this maybe 107

107

in older code basis or some older tutorials 108

108

that you'll find online. 109

109

So, let's take a look at how it works. 110

110

So, var is basically the old way of defining variables, 111

111

prior to ES6. 112

112

And at first sight, it works actually pretty much 113

113

the same as let. 114

114

So, we can write var job equals programmer, 115

115

and then just like with let, we can change the value of 116

116

the variable later, just like this. 117

117

Let's take this one out and let's just reload, 118

118

and we didn't get any errors, 119

119

which means that it's basically allowed 120

120

to mutate this job variable when we use var, right? 121

121

Now, although it looks like var and let are very similar, 122

122

below the surface, they're actually pretty different. 123

123

And actually there are also many differences 124

124

between led const and var. 125

125

So, between all three of them, 126

126

and you will learn all about these differences later 127

127

in section seven, 128

128

because this is actually really important stuff. 129

129

And I know that I keep saying that you will learn 130

130

some topics later in the course, 131

131

but the truth is that learning is really not linear. 132

132

It cannot happen in a linear way. 133

133

So, you sometimes need more advanced things right now, 134

134

even without understanding them. 135

135

But that's not a problem 136

136

because you will understand them eventually. 137

137

So, right now it would really not be useful for you to know 138

138

that the let is block scoped 139

139

and that VAR is function-scoped, right? 140

140

Because you don't even know what a block 141

141

or what a function really is. 142

142

And so, we will learn about these differences 143

143

in section seven. 144

144

For now, what matters is that you should basically 145

145

never use var, okay? 146

146

Now just to finish, some people will probably point out 147

147

that we actually don't even have to declare variables at all 148

148

because it's actually not mandatory. 149

149

We can just write something like this, 150

150

last name equals Schmedtmann in my case. 151

151

And then we can just use this variable name in this case 152

152

by logging it to the console 153

153

and JavaScript will happily execute this script, 154

154

even without us declaring a variable, right? 155

155

We didn't use let nor const nor a var in this case, 156

156

but it still worked. 157

157

However, this is actually a pretty terrible idea 158

158

because this doesn't create a variable 159

159

in the current so-called scope. 160

160

Instead, JavaScript will create a property 161

161

on the global object. 162

162

And once again, you will understand a little bit later 163

163

what all of this means, but what matters is 164

164

that you should always properly declare variables, okay? 165

165

Never just write a variable like this 166

166

without really declaring it. 167

167

Great. 168

168

You're doing great progress here, 169

169

even though our code doesn't really do anything yet, 170

170

and we're not really writing any real applications yet. 171

171

Right, but we still need to get some fundamentals down 172

172

before we can do that. 173

173

And so that's really important, and that's why I'm stressing 174

174

all the little details about everything here. 175

175

And I hope you see how important that is 176

176

for your progress, okay? 177

177

And don't worry, we will get to the cool stuff even 178

178

a bit later in this first section, okay? 179

179

But for now in the next video, 180

180

let's talk about operators in JavaScript.