WEBVTT

1
00:00:00.460 --> 00:00:06.411
The first method you should consider when
creating a variable is the const keyword.

2
00:00:06.411 --> 00:00:09.380
This is often the best choice for
declaring variables.

3
00:00:09.380 --> 00:00:13.440
Const is short for constant, meaning
that the value of the variable shouldn't

4
00:00:13.440 --> 00:00:16.070
change, it should remain constant.

5
00:00:16.070 --> 00:00:21.672
For example, const pi is equal to 3.14159.

6
00:00:21.672 --> 00:00:26.230
Const lets you protect variables from
being overwritten by any stray assignments

7
00:00:26.230 --> 00:00:27.650
in your code.

8
00:00:27.650 --> 00:00:32.710
In other words, once you create a
constant, you can't give it another value.

9
00:00:32.710 --> 00:00:34.940
Let me show you what I mean.

10
00:00:34.940 --> 00:00:39.070
If you want to follow along, you can
open up the workspace on this page.

11
00:00:39.070 --> 00:00:41.194
Open up pi.html.

12
00:00:43.048 --> 00:00:51.470
And as you can see, we've assigned
the value of 3.1459 to the constant pi.

13
00:00:51.470 --> 00:00:56.560
Click on preview and navigate to pi.html.

14
00:00:56.560 --> 00:01:01.180
Open up the developer tools and
head over to the job script console.

15
00:01:01.180 --> 00:01:05.610
When we type pi, The value is locked.

16
00:01:05.610 --> 00:01:07.830
Try to assign another value to pi.

17
00:01:12.224 --> 00:01:13.888
We see we get an error.

18
00:01:13.888 --> 00:01:17.330
TypeError: Assignment
to Constant Variable.

19
00:01:17.330 --> 00:01:19.603
You will use constants frequently,
in fact,

20
00:01:19.603 --> 00:01:22.800
it should be your first choice
when declaring variables.

21
00:01:22.800 --> 00:01:26.980
You will use them to store numbers that
shouldn't change when your program runs.

22
00:01:26.980 --> 00:01:31.508
For example, tax rates, dimensions
of user interface components and

23
00:01:31.508 --> 00:01:33.990
product prices are good examples.

24
00:01:33.990 --> 00:01:38.230
And you'll use constants when you're
selecting elements on a page.

25
00:01:38.230 --> 00:01:41.510
Or when you're assigning
a function to a variable.

26
00:01:41.510 --> 00:01:44.130
Any value can be assigned to a constant.

27
00:01:44.130 --> 00:01:49.250
However, for a variable whose value will
change during the life of a program,

28
00:01:49.250 --> 00:01:51.260
const are a bad choice.

29
00:01:51.260 --> 00:01:55.510
For example, you wouldn't want to
const to store score of a game.

30
00:01:55.510 --> 00:01:58.470
Since the score changes as
the player plays the game.

31
00:01:59.530 --> 00:02:02.710
In that case, you'll use the let keyword.

32
00:02:02.710 --> 00:02:05.340
I'll show you how that
works in another video.

33
00:02:05.340 --> 00:02:08.860
As I mentioned,
constants help you fix problems

34
00:02:08.860 --> 00:02:12.260
that can easily crop up in
your JavaScript programs.

35
00:02:12.260 --> 00:02:15.960
Let's take a look at a common
problem that you'll run into.

36
00:02:15.960 --> 00:02:22.530
If you want to follow along, open up the
name.html file in this video's workspace.

37
00:02:22.530 --> 00:02:25.820
Here's a simple script
with a variable name.

38
00:02:25.820 --> 00:02:28.920
I'll preview this file and
check in the console.

39
00:02:33.666 --> 00:02:36.560
Notice that the console says Andrew.

40
00:02:36.560 --> 00:02:40.490
That's the value of the name
variable defined on line one.

41
00:02:40.490 --> 00:02:43.090
The console then prints out Joel Kraft

42
00:02:44.350 --> 00:02:47.710
which is logged by
the createFullName function.

43
00:02:49.830 --> 00:02:53.550
Now that the program has run,
what's the value of the name variable?

44
00:02:54.880 --> 00:02:58.300
I will just check that out in
the console by writing name.

45
00:02:58.300 --> 00:03:00.140
It's now Joel Kraft.

46
00:03:00.140 --> 00:03:01.030
Andrew is gone.

47
00:03:02.120 --> 00:03:06.300
The variable has been
overwritten by the function.

48
00:03:06.300 --> 00:03:08.180
This is a simple scope issue.

49
00:03:09.220 --> 00:03:13.290
The function is overwriting the name
variable in the global scope.

50
00:03:14.480 --> 00:03:18.840
It's a problem that can pop up and
can be difficult to catch.

51
00:03:18.840 --> 00:03:21.690
However, const will help
you spot the mistake.

52
00:03:24.164 --> 00:03:29.630
Now when I preview this,
The console spits out an error.

53
00:03:33.246 --> 00:03:36.120
You can't change the value of a constant.

54
00:03:36.120 --> 00:03:40.950
Because I use const, I can see that
the simple mistake I made, and

55
00:03:40.950 --> 00:03:43.240
I can go back into my script and fix it

56
00:03:48.306 --> 00:03:51.597
Simply adding const before
the name within the function,

57
00:03:51.597 --> 00:03:55.570
keeps that variable locked to
the scope of the function.

58
00:03:55.570 --> 00:03:58.630
It's no longer trying to
reassign the name variable.

59
00:03:59.780 --> 00:04:01.760
I'll preview this script one more time.

60
00:04:03.700 --> 00:04:09.060
And no errors, and I can logout name,
and it's still untrue, hurray!

61
00:04:09.060 --> 00:04:09.580
I'm not gone.