When They "feel" the Same - Code - Part 1

What’s the Difference Between Scope and Context in JavaScript? When Scope and Context "feel" like the same thing (but they are not)
5 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
€93.23
List Price:  €130.53
You save:  €37.29
£79.94
List Price:  £111.92
You save:  £31.98
CA$136.79
List Price:  CA$191.52
You save:  CA$54.72
A$153.20
List Price:  A$214.48
You save:  A$61.28
S$135.94
List Price:  S$190.32
You save:  S$54.38
HK$782.80
List Price:  HK$1,095.96
You save:  HK$313.15
CHF 91.30
List Price:  CHF 127.83
You save:  CHF 36.52
NOK kr1,094.90
List Price:  NOK kr1,532.91
You save:  NOK kr438
DKK kr695.39
List Price:  DKK kr973.58
You save:  DKK kr278.18
NZ$167.81
List Price:  NZ$234.95
You save:  NZ$67.13
د.إ367.25
List Price:  د.إ514.16
You save:  د.إ146.91
৳10,958.03
List Price:  ৳15,341.69
You save:  ৳4,383.65
₹8,331.80
List Price:  ₹11,664.86
You save:  ₹3,333.05
RM477.70
List Price:  RM668.80
You save:  RM191.10
₦126,689.32
List Price:  ₦177,370.12
You save:  ₦50,680.80
₨27,798.13
List Price:  ₨38,918.49
You save:  ₨11,120.36
฿3,702.20
List Price:  ฿5,183.23
You save:  ฿1,481.03
₺3,249.97
List Price:  ₺4,550.10
You save:  ₺1,300.12
B$514.66
List Price:  B$720.55
You save:  B$205.88
R1,901.16
List Price:  R2,661.70
You save:  R760.54
Лв182.41
List Price:  Лв255.39
You save:  Лв72.97
₩137,421.64
List Price:  ₩192,395.79
You save:  ₩54,974.15
₪379.55
List Price:  ₪531.39
You save:  ₪151.83
₱5,778.57
List Price:  ₱8,090.23
You save:  ₱2,311.66
¥15,552.99
List Price:  ¥21,774.81
You save:  ¥6,221.82
MX$1,705.36
List Price:  MX$2,387.58
You save:  MX$682.21
QR364.16
List Price:  QR509.84
You save:  QR145.68
P1,384.82
List Price:  P1,938.81
You save:  P553.98
KSh13,448.65
List Price:  KSh18,828.65
You save:  KSh5,380
E£4,789.16
List Price:  E£6,705.01
You save:  E£1,915.85
ብር5,677.33
List Price:  ብር7,948.49
You save:  ብር2,271.15
Kz83,741.62
List Price:  Kz117,241.62
You save:  Kz33,500
CLP$95,258.47
List Price:  CLP$133,365.67
You save:  CLP$38,107.20
CN¥724.52
List Price:  CN¥1,014.36
You save:  CN¥289.84
RD$5,872.31
List Price:  RD$8,221.47
You save:  RD$2,349.16
DA13,431.87
List Price:  DA18,805.15
You save:  DA5,373.28
FJ$229.18
List Price:  FJ$320.86
You save:  FJ$91.68
Q776.12
List Price:  Q1,086.60
You save:  Q310.48
GY$20,901.55
List Price:  GY$29,263
You save:  GY$8,361.45
ISK kr13,994.60
List Price:  ISK kr19,593
You save:  ISK kr5,598.40
DH1,013.23
List Price:  DH1,418.56
You save:  DH405.33
L1,780.93
List Price:  L2,493.37
You save:  L712.44
ден5,743.61
List Price:  ден8,041.28
You save:  ден2,297.67
MOP$805.67
List Price:  MOP$1,127.97
You save:  MOP$322.30
N$1,914.68
List Price:  N$2,680.63
You save:  N$765.95
C$3,675.06
List Price:  C$5,145.23
You save:  C$1,470.17
रु13,310.19
List Price:  रु18,634.81
You save:  रु5,324.61
S/370.43
List Price:  S/518.62
You save:  S/148.18
K379.55
List Price:  K531.39
You save:  K151.83
SAR375.02
List Price:  SAR525.04
You save:  SAR150.02
ZK2,608.51
List Price:  ZK3,652.02
You save:  ZK1,043.50
L463.96
List Price:  L649.56
You save:  L185.60
Kč2,349.11
List Price:  Kč3,288.85
You save:  Kč939.73
Ft36,594.60
List Price:  Ft51,233.91
You save:  Ft14,639.30
SEK kr1,086.27
List Price:  SEK kr1,520.82
You save:  SEK kr434.55
ARS$87,315.45
List Price:  ARS$122,245.13
You save:  ARS$34,929.67
Bs689.99
List Price:  Bs966.01
You save:  Bs276.02
COP$389,137.18
List Price:  COP$544,807.62
You save:  COP$155,670.43
₡50,081.85
List Price:  ₡70,116.60
You save:  ₡20,034.74
L2,464.83
List Price:  L3,450.86
You save:  L986.03
₲741,742.01
List Price:  ₲1,038,468.49
You save:  ₲296,726.47
$U3,834.62
List Price:  $U5,368.62
You save:  $U1,534
zł402.27
List Price:  zł563.20
You save:  zł160.92
Already have an account? Log In

Transcript

In your examples folder, open up the sub folder titled scope and context seeing the same. Let's look at the first example file. Copy this example a code, the one that's named create a speed variable and show it in the console, copy that code and paste it in your JavaScript console. And we see that the output we get is 100. Okay, let's circle back. So in this example, we're creating a private variable called speed inside of this function foo, and we're outputting it in the console.

And when we execute foo, we see 100. So nothing special there. But just to establish that we want to use the var keyword to create a private variable. And we've talked about this a number of times in this class. So when you go down to example, be the one that's that says what happens if you forget the var keyword here on line 15. I forget the var keyword I on line four I've used var but on line 15.

I just I omitted it so I'm seeing speed. equals 100. And then I output speed and I execute foo. So okay, so what happens if we forget the var keyword? Well, I'm going to copy this code. And I'm going to paste this in the console, refresh the page.

And I get 100 again. So we still get 100. We know that we created the variable and we output it. But I'm thinking something different happen here. Well, something did happen here. There's something that happens to that speed variable.

What happens is the speed variable becomes what's called an implied global. And implied global is a variable in browser based JavaScript, where when you omit the var keyword, that variable becomes a property of the window object, it becomes a global variable. And remember, it's really super important piece of information is that a global variable is a property of the window object. So if I type speed in my console, I see 100 In fact, if I type window, dot speed, I get 100. In fact, if I type window, and I inspect the window object, and I scroll all the way down, and I look, I can see there's a speed property right here. So the point here is that when you omit the var keyword, you create what's called an implied global.

It becomes a global variable. And you've done that implicitly. So creating an implied global is really the same thing as declaring the variable the variable globally. So lines 14 and line 17 are exactly the same. They do the exact same thing. They both create a global variable.

The only difference is on line 14. I'm doing it explicitly. I'm saying var speed equals 100. And I'm doing it in the global scope. On line 17, I'm doing it implicitly. And I'm saying, well, speed equals 100.

And because I'm in a function, the omission of the var keyword says, Oh, it's going to be a global. But the other thing that happened is we discovered a few seconds ago is that creating an a global variable also creates a property of the window object with the same name. So lines 14 and 15, are exactly the same. They accomplish the exact same thing. var speed equals 100 and a window dot speed equals 100. Both create a global variable.

That's also a property of the window object. So this isn't a situation where scope and context almost kind of merged they, they very much feel like the same thing. And in a way, you can almost think of them as the same thing. It's depends on how you want to debate it, but it's really the two kind of meet and they certainly feel the same because we have a global variable. There's no doubt about it, but that variable becomes a problem. Have the window object.

And you can also say that this is the exact same thing line. 16 does the exact same thing as lines 14 and 15. Because by leaving out the var keyword on line 16, I'm creating an implied global, I'm just doing it in the global space. So all three of these things accomplish the exact same thing, they create a global variable. And that global variable becomes a property of the window object. It's a incredibly important piece of information to keep in mind, because when you're working with browser based JavaScript, the window object is a very important object.

Global variables are an important concept to be aware of, they're usually bad. There's plenty of them. There's definitely plenty of project properties of the window object, but creating global variables. Intentionally is usually something you want to avoid. But it's important to understand that when you omit the var keyword inside of a funnel, If you create what's called an implied global, it's a global variable, you're doing it implicitly. And that variable also becomes a property of the window object.

And the global variable is also a property of the window object.

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.