WEBVTT 00:01.410 --> 00:06.900 It's time to talk about another very important aspect in JavaScript, especially when we think about 00:06.900 --> 00:08.730 how JavaScript works behind the scenes. 00:09.360 --> 00:16.020 So in this lecture, you will learn about coping and sculpting sometimes, especially when you are new 00:16.020 --> 00:16.690 in JavaScript. 00:16.710 --> 00:20.490 It's a bit confusing and not understandable concept. 00:21.000 --> 00:22.220 So let's make it clear. 00:23.160 --> 00:24.030 What is the scope? 00:24.930 --> 00:28.380 We can consider scopes regarding variables and functions. 00:28.860 --> 00:34.530 Scope in programming language refers to the visibility or accessibility of variables and functions. 00:34.830 --> 00:39.930 In other words, it tells you where in your program you're allowed to use the variables and functions 00:40.320 --> 00:41.320 that you have defined. 00:42.870 --> 00:46.530 OK, suppose that we have some JavaScript code. 00:47.160 --> 00:52.790 Here is the variable number one, then we have function AI inside it. 00:52.800 --> 00:57.300 We have another variable number two, then below we have another function. 00:57.570 --> 00:59.990 Function B and it contains another variable. 01:00.000 --> 01:07.920 Number three, if we consider this code from the variable perspective, we can say that the location 01:07.920 --> 01:13.320 where you declare a variable will affect where it can be used within your code. 01:14.310 --> 01:20.900 So here, variable number one is created on global level, which literally refers to global window object. 01:21.720 --> 01:26.910 In other words, we call variables global when they are defined outside the function. 01:28.360 --> 01:34.960 So the global variable has a global scope, it means that from everywhere in your code, we can access 01:34.960 --> 01:35.380 on that. 01:36.680 --> 01:40.970 In our case, no one is a global variable and it has a global scope. 01:42.470 --> 01:48.080 From the fashion perspective, we can say that in JavaScript, each function creates a new scope. 01:49.070 --> 01:56.120 So here Function A creates its own local scope and the variable number two, which is defined inside 01:56.130 --> 02:03.050 function A is a local variable because it's not accessible outside of the function A. 02:04.400 --> 02:09.360 So local variables are variables that are defined within functions. 02:10.040 --> 02:15.620 They have local scope, which means that they can only be used within the functions that define the. 02:17.900 --> 02:25.490 Inside the function, we have Function B, which in the same way creates its own local scope, and in 02:25.490 --> 02:29.270 this local scope we have another local variable, number three. 02:30.370 --> 02:33.880 Which is not accessible from outside function B. 02:36.070 --> 02:43.750 All right, let's consider once more the accessibility on the variables that we have defined for function 02:43.750 --> 02:51.840 B, there are outer environments which are a local scope of function A and the global scope itself. 02:52.570 --> 03:00.730 Those outer environments are also called as apparent scope in the same way we can call local scope or 03:00.740 --> 03:08.800 function A as a child scope for global scope and the local scope of function B as that child's scope 03:08.800 --> 03:09.910 for function ET. 03:11.540 --> 03:17.750 As for function eight, its current scope is out global scope where it's lexically defined. 03:18.680 --> 03:25.160 A Function B wants to use the variables from its parent scope's, this case, variable number two and 03:25.160 --> 03:25.880 number one. 03:27.330 --> 03:28.890 It's acceptable in JavaScript. 03:29.790 --> 03:35.910 In the same way function, it can use the variable from its outer environment, which is in this case, 03:35.910 --> 03:36.510 number one. 03:38.330 --> 03:44.180 But what happens if Function A wants to use the variable from function B. I mean, the variable number 03:44.180 --> 03:52.180 three, it's not possible because as we said, local variables are not accessible from the outer scopes 03:52.580 --> 03:55.010 and in the same way from the global scope. 03:55.010 --> 03:57.650 We cannot access on the variables, number two. 03:57.920 --> 04:04.220 And number three, because they are local variables of these relationships. 04:04.220 --> 04:07.350 Among those scopes is called scope chain. 04:08.510 --> 04:16.160 So, again, accessibility on the variables is possible from the inner to outer scopes, and it's not 04:16.160 --> 04:18.830 possible from the outer to inner scopes. 04:20.430 --> 04:28.500 All right, let's discuss once again what this Coke chain is using some practical examples, open the 04:28.500 --> 04:34.860 text editor, use the same example that we have talked about and write verbal No. 04:34.860 --> 04:36.420 One equals to five. 04:38.850 --> 04:40.170 That create Function A. 04:43.590 --> 04:46.080 And inspired you to write very well, number two. 04:47.900 --> 04:48.770 Equals the 10. 04:51.550 --> 04:53.170 And below, right function B. 04:55.620 --> 04:57.960 And inside, it creates another variable. 04:58.500 --> 05:00.390 Number three equals 250. 05:04.730 --> 05:11.150 So you have variable number one, which is created on global scope, their function day in which we 05:11.150 --> 05:17.050 have local variable number two and function B, which is inside function eight. 05:18.140 --> 05:20.660 And it also contains a local variable, number three. 05:22.570 --> 05:29.710 Suppose that we want to add those numbers so right inside function B, cancel that log. 05:31.080 --> 05:32.220 Number three plus. 05:33.940 --> 05:35.830 Number two and number one. 05:38.100 --> 05:42.210 In order to get the results, we need to invoke Function B. 05:44.940 --> 05:49.370 And to execute it, we need to call function A as well. 05:52.150 --> 05:58.390 So reload the page and we have 30, which is the sum of those three numbers. 06:00.070 --> 06:04.150 This example proves that we can access on the variables from the inner scope's. 06:05.870 --> 06:12.770 From function B, we have access on a variable number to add verbal number one, but what happens if 06:12.770 --> 06:19.310 we add those numbers inside the function a bit outside function B, I'm sure that you already know the 06:19.310 --> 06:19.790 answer. 06:21.260 --> 06:27.950 So reload and we have an error, which tells us that number three is not defined. 06:29.040 --> 06:36.660 So function A could access our number one, which is in its periscope, but it couldn't have access 06:36.660 --> 06:43.430 on number three, which is inside a local scope of function B, and this code for function is child's 06:43.440 --> 06:43.740 called. 06:45.710 --> 06:50.810 If we get rid of that number three, then the code will work. 06:52.660 --> 06:59.200 OK, let's move up this line of code and get the result on global level. 07:01.850 --> 07:07.320 You see that still we have an error, which tells that number two is not defined. 07:08.180 --> 07:10.480 The reason is the same from the global scale. 07:10.490 --> 07:12.580 We cannot access on number two as well. 07:14.350 --> 07:22.090 All right, let's change the names of variable number two and number three and write number one for 07:22.090 --> 07:22.800 both of them. 07:26.250 --> 07:29.280 Then look, I left them in council. 07:34.360 --> 07:40.540 It seems that a of those variables are the same, but in different scopes, they don't change their 07:40.540 --> 07:42.880 values, they're just different variables. 07:43.660 --> 07:50.200 In order to prove that, once again, log no one in council after calling function a right. 07:50.200 --> 07:51.010 Cancel that log. 07:51.340 --> 07:51.970 No one. 07:55.790 --> 07:58.710 Reload and I see that on global level. 07:58.910 --> 08:05.810 Number one is five in both cases, but in local scopes they are different variables and have different 08:05.810 --> 08:06.230 values. 08:08.320 --> 08:13.900 All right, let's demonstrate another case and common discourse looks out. 08:18.090 --> 08:23.010 And in function B, let's leave, just cancel like no one. 08:24.350 --> 08:30.500 So what do you expect to get in function B. We have no longer verbal No. 08:30.500 --> 08:30.770 One. 08:31.370 --> 08:34.400 So you might think that we will get undefined. 08:35.780 --> 08:39.110 Let's see, reload and we have 10. 08:40.600 --> 08:46.750 Why, because of this corruption, if we come at this line, then we will get five. 08:49.850 --> 08:59.030 OK, let me explain once again, when function B couldn't find no one in its local scope, then it checked 08:59.030 --> 09:05.640 its apparent scope, which is a local scope or function A and there it found this variable. 09:06.530 --> 09:08.590 So we got the value tat in council. 09:09.800 --> 09:13.610 But if in the function a verbal number has exist. 09:14.570 --> 09:21.200 Then Function B would check the global scope where it could find variable number one, which equals 09:21.200 --> 09:21.660 to five. 09:23.090 --> 09:25.840 Therefore, we've got value five in concept. 09:28.430 --> 09:33.620 All right, so in this lecture, we have learned what a scope and scope, Jane. 09:34.620 --> 09:40.410 You need to know all this stuff well, because it's very important and it will help you in writing the 09:40.410 --> 09:41.130 current code. 09:42.120 --> 09:42.750 That's more.