Get a month of TabletWise Pro for free! Click here to redeem

What is the difference between Scope and Context in JavaScript?

4 minutes
Share the link to this page
You need to purchase the class to view this lesson.
One-time Purchase
List Price:  $139.99
You save:  $40
List Price:  د.إ514.18
You save:  د.إ146.92
List Price:  A$201.42
You save:  A$57.55
List Price:  ৳11,885.38
You save:  ৳3,396.06
List Price:  CA$190.22
You save:  CA$54.35
CHF 94.11
List Price:  CHF 131.76
You save:  CHF 37.64
List Price:  kr922.75
You save:  kr263.66
List Price:  €123.88
You save:  €35.39
List Price:  £110.90
You save:  £31.68
List Price:  HK$1,085.28
You save:  HK$310.10
List Price:  ₹10,526.61
You save:  ₹3,007.82
List Price:  RM597.19
You save:  RM170.64
List Price:  ₦54,241
You save:  ₦15,498.53
List Price:  kr1,319.67
You save:  kr377.07
List Price:  NZ$212.70
You save:  NZ$60.77
List Price:  ₱6,925.45
You save:  ₱1,978.84
List Price:  ₨23,257.07
You save:  ₨6,645.35
List Price:  S$194.74
You save:  S$55.64
List Price:  ฿4,386.84
You save:  ฿1,253.47
List Price:  ₺960.89
You save:  ₺274.56
List Price:  R2,348.19
You save:  R670.96
Already have an account? Log In


So the next question we need to answer is, what is the difference between scope and context in JavaScript? Well, scope is the visibility of variables. And context is the object to which a method belongs. So if you put them side by side, we can think about it this way. scope is the visibility of variables. And you might ask yourself, you know, what is the scope of a variable or how is a variable scoped?

And with context, which is the object to which a method belongs, from time to time, you might ask yourself, what is this or what context is this method executed it? So when you think of scope, think of variables. And when you think of context, think methods. Let's look at an example. Now just let's start out with kind of a pseudocode approach. I've got these three things on the screen, I've got Sam 123, and function.

And these are just three things and right now they're just kind of floating out in space, and I have no way to Get a hold of them. So Sam is a string and 123 is a number and this function is a function. Now let's just pretend that this function is a function because it's really not correct JavaScript syntax. But again, it's just pseudocode. For now, let's just pretend that's a function. Okay, so we've got the string, this number in this function, but I really have no way of getting a hold of these things.

I can't get my hands on them, they're just there, I needed a way to refer to them. So we need to, we need to refer to these values in a way by giving them some kind of name. So let's call Sam name, let's call 123. Count, and let's call the function greet. So by doing that, I now have a way to refer to each one of these things. So when I leverage scope, I can create variables for each one of these things.

I can say var name equals Sam, var count equals 123. And var greed equals function. And if I was going to leverage content Next, I could create an object, let's just say the object called OBJ. And I could give that object properties because objects have properties. And I could give it a name property that Sam and I could give it a count property that's 123. And I could give it a great property, that's dysfunction.

Or I could mix it up leverage scope and context. So I could say var name equals Sam and OBJ count equals 123. And var greet equals function. So let's see how this actually works in JavaScript code. So getting back to scope. If I wanted to create variables for these things, I'd use the var keyword and I'd say var name equals Sam var count equals 123.

And four greet equals function. And inside of the greet function, I'll enter the name value. So I'm creating handles for these values by creating variables. Now, if I wanted to leverage context, I could create an OBJ variable, it's an object and then I give that object property so OBJ name is Sam and OBJ dot count. Because 123 and OBJ dot greet is a function. And I learned this name, which would alert Sam.

Now we're going to talk a little more in depth about what the this keyword means. But just right now just keep in mind that when it comes to context, the this keyword is really important, and that this keyword refers to the object which a method belongs. Now if I was going to kind of mix it up and use scope and context, I could say OBJ isn't a variable, and name is a variable, but OBJ count is a property and then OBJ dot greet is also a property. It's also a method when objects property is a method or a function. And then it's called a method. So objects have properties.

But when a property is a function, it's a method. In this case, it alerts the name variable. So kind of three ways to really two ways to look at it. You can leverage scope and create variables, you can leverage context and create Object Properties. Or you can certainly mix and match So, once again scope is the visibility of variables. And when you think of scope, think variables and context is the object to which a method belongs.

And when you think of context, think methods

Sign Up