Understanding Scope Part 2

Modern JavaScript Incorporating Functions
9 minutes
Share the link to this page
Copied
  Completed
You need to have access to the item to view this lesson.
One-time Fee
$99.99
List Price:  $139.99
You save:  $40
€96.21
List Price:  €134.70
You save:  €38.49
£79.93
List Price:  £111.90
You save:  £31.97
CA$143.79
List Price:  CA$201.32
You save:  CA$57.52
A$160.48
List Price:  A$224.69
You save:  A$64.20
S$135.83
List Price:  S$190.17
You save:  S$54.33
HK$777.07
List Price:  HK$1,087.93
You save:  HK$310.86
CHF 89.45
List Price:  CHF 125.24
You save:  CHF 35.78
NOK kr1,141.95
List Price:  NOK kr1,598.78
You save:  NOK kr456.82
DKK kr717.64
List Price:  DKK kr1,004.72
You save:  DKK kr287.08
NZ$177.52
List Price:  NZ$248.53
You save:  NZ$71.01
د.إ367.25
List Price:  د.إ514.17
You save:  د.إ146.91
৳11,994.74
List Price:  ৳16,793.12
You save:  ৳4,798.37
₹8,496.63
List Price:  ₹11,895.62
You save:  ₹3,398.99
RM450.75
List Price:  RM631.07
You save:  RM180.32
₦155,628.43
List Price:  ₦217,886.03
You save:  ₦62,257.60
₨27,934.96
List Price:  ₨39,110.06
You save:  ₨11,175.10
฿3,444.45
List Price:  ฿4,822.37
You save:  ฿1,377.92
₺3,518.54
List Price:  ₺4,926.10
You save:  ₺1,407.55
B$617.53
List Price:  B$864.57
You save:  B$247.04
R1,837.80
List Price:  R2,572.99
You save:  R735.19
Лв188.31
List Price:  Лв263.64
You save:  Лв75.33
₩144,872.25
List Price:  ₩202,826.95
You save:  ₩57,954.69
₪364.89
List Price:  ₪510.86
You save:  ₪145.97
₱5,883.01
List Price:  ₱8,236.45
You save:  ₱2,353.44
¥15,672.80
List Price:  ¥21,942.55
You save:  ¥6,269.75
MX$2,028.91
List Price:  MX$2,840.56
You save:  MX$811.64
QR366.34
List Price:  QR512.89
You save:  QR146.55
P1,382.59
List Price:  P1,935.69
You save:  P553.09
KSh12,923.70
List Price:  KSh18,093.70
You save:  KSh5,170
E£5,091.27
List Price:  E£7,127.98
You save:  E£2,036.71
ብር12,764.56
List Price:  ብር17,870.89
You save:  ብር5,106.33
Kz91,790.82
List Price:  Kz128,510.82
You save:  Kz36,720
CLP$99,155.08
List Price:  CLP$138,821.08
You save:  CLP$39,666
CN¥729.81
List Price:  CN¥1,021.77
You save:  CN¥291.95
RD$6,104.52
List Price:  RD$8,546.58
You save:  RD$2,442.05
DA13,454.60
List Price:  DA18,836.98
You save:  DA5,382.37
FJ$232.11
List Price:  FJ$324.96
You save:  FJ$92.85
Q773.21
List Price:  Q1,082.52
You save:  Q309.31
GY$21,000.46
List Price:  GY$29,401.48
You save:  GY$8,401.02
ISK kr13,903.60
List Price:  ISK kr19,465.60
You save:  ISK kr5,562
DH1,007.40
List Price:  DH1,410.40
You save:  DH403
L1,841.78
List Price:  L2,578.57
You save:  L736.78
ден5,922.50
List Price:  ден8,291.74
You save:  ден2,369.23
MOP$803.42
List Price:  MOP$1,124.82
You save:  MOP$321.40
N$1,834.70
List Price:  N$2,568.66
You save:  N$733.95
C$3,694.32
List Price:  C$5,172.20
You save:  C$1,477.87
रु13,665.58
List Price:  रु19,132.35
You save:  रु5,466.77
S/374.71
List Price:  S/524.60
You save:  S/149.89
K406.86
List Price:  K569.63
You save:  K162.76
SAR375.72
List Price:  SAR526.02
You save:  SAR150.30
ZK2,777.96
List Price:  ZK3,889.25
You save:  ZK1,111.29
L478.81
List Price:  L670.35
You save:  L191.54
Kč2,418.25
List Price:  Kč3,385.65
You save:  Kč967.40
Ft39,800.47
List Price:  Ft55,722.25
You save:  Ft15,921.78
SEK kr1,103.66
List Price:  SEK kr1,545.17
You save:  SEK kr441.50
ARS$102,190.76
List Price:  ARS$143,071.15
You save:  ARS$40,880.39
Bs693.61
List Price:  Bs971.08
You save:  Bs277.47
COP$437,799.12
List Price:  COP$612,936.28
You save:  COP$175,137.16
₡50,480.33
List Price:  ₡70,674.48
You save:  ₡20,194.15
L2,548.03
List Price:  L3,567.35
You save:  L1,019.31
₲784,126.06
List Price:  ₲1,097,807.85
You save:  ₲313,681.79
$U4,460.41
List Price:  $U6,244.75
You save:  $U1,784.34
zł409.96
List Price:  zł573.96
You save:  zł164
Already have an account? Log In

Transcript

We've dealt with scope quite a bit. In this second part, we're going to look at some additional examples to help you understand scope. In the previous movie we left off here, I want to change things up a bit, so I'm going to copy in some new code. This time we have a function test to inside that function, we declare a variable num one, set it to 50. Inside that function, we declare another function test three, and inside that function, we console log number one and number two. Then inside of test two, we console log number one, number two as well.

And then at the very bottom of the function test two, we call test three. Okay, so function test two is has has been defined within the global environment. These variables have been defined within the global environment. What about test three? Well, let's see what happens. If I try to call test three from the global environment, save that.

Open the console uncaught reference error test three is not defined. Test three has been defined within the environment that exists inside a function test two, therefore it is not accessible outside of that environment. Only test two is that would also be true if I tried to log number one and number one is no longer defined in the world. Global Environment. It's only defined inside this function. So let's take a look at that.

Let me make one change First, let me get rid of test three. So we don't have that confusing us. Refresh. And uncaught reference error number one is not defined. So once again, now num one is not a part of a global environment is only part of the test to function environment. Alright, return this to how it was.

The next thing we want to do is called test to get rid of that console dot log statement. So let's walk through test two and see what's going to happen. What are the first things is going to display Is this and this going to display first or Well, these statements? Well, these two should display first because this function hasn't even been called. It's called down here. Okay, so we should get these two displayed first.

Before that is called. Alright, let's save that and go. Let's go ahead and see what happens. Refresh. I'm going to move the console over here a bit. And I'm going to make sublime a bit smaller.

So we can see what's going on. So the very first line to that we received was this console dot log statement, and it displayed num one. It did not display this value. It displayed the value inside of test two Which it first looks at its scope, which is inside of this environment. If it's not found, then it will go outside to the outside environment and locate it. But num one was discovered, prints it out, it's 50, then num 275.

It jumps outside and grabs this one, then test three is called which num one and m two does it use? Well, it first looks inside its environment. Then it goes to its outer environment, which is test two, it finds num one there displays it for num two, it can't find it inside its environment goes to its outer environments not found there. It goes to the next outer environment. So this is a chain it keeps moving up until it either finds the variable or it's gotten to the global environment and it can't go any further. It did find it in the global environment.

And so it prints out 75 as we see there. Now hopefully is exactly these examples help you understand scope. And hopefully it helps you picture the environment in which code executes because that's really the scope. When a variable is defined within a particular environment, that is the scope of that variable if it's defined in the global environment, its scope is global, if it's defined within a function in scope is within that function. If you use the let keyword to define the variable its scope is within a block of code. So very important to remember scope.

Now before we leave this topic, I want to show you one additional thing to be aware of a common mistake that happens I'm going to copy in function test one, which we used in our previous movie, I'm going to remove from test to that variable definition and I'm going to put Variable definition up here for number one, okay. Now we're going to call test one and test two. We're going to invoke both of them and see what we get. Now this is one, two, so let me quickly change this to three so that we can help keep these straight. Four, five, and six. Go ahead and save.

Jump out, refresh, bring up the console and then let me jump back to sublime so we can compare what's going on. Alright, so in test one, num one is displayed as a 10. Num two is displayed as 75. But then when test two is called number one Right, here's displayed is 25. Ah, does that give you a little more enlightenment about scope. Notice that test two cannot go back and grab this redefinition of the variable.

Because its scope is simply test one. It grabs this one, because this is the outer environment. And so num one equals 25. And that's true for test three as well, because it first looks inside of itself, then inside a test two, then inside the global environment, which is which are these values here. Alright, I'm going to make one more change. And then notice what happens.

You can remove the var keyword, that's all I'm going to do. Save it. Refresh, open the console. And let's open sublime again. A difference has happened. It looks like this line here redefined the global variable num one.

And that's exactly what it did. Because we did not use the var keyword inside of this function, it assumed we were referring to a global variable, that it looked for a variable on the out in the outer environment. And it redefined that. That is why it is so important to always use var or left when you're defining variables. Otherwise, you might redefine a variable that's defined in the global environment and it could affect your code. So this should have var in front of it in order to prevent that mistake.

That is a mistake. That is common among JavaScript developers that don't understand sculpin some of the the nuances of JavaScript. Now that you understand it, you won't make that mistake you will constantly use var when you're defining your variables a very important habit to get into. Alright, let's move to the next topic.

Sign Up

Share

Share with friends, get 20% off
Invite your friends to LearnDesk learning marketplace. For each purchase they make, you get 20% off (upto $10) on your next purchase.