In Lesson1’s review of LET we covered the concept of block-level scope. We learned that JS includes global scope, function scope, and block-level scope. This time, we’ll look at scopes in more detail. Amway has a great book, JavaScript you Don’t Know (Volume 1), which is devoted to scopes and closures throughout the first part of the book. So let’s move on to scope knowledge:

1. The concept of scope

About the concept of scope, New_Name sees w3School saying: scope refers to the set of variables that you have access to. JavaScript you Don’t Know (Volume 1) defines the role of scopes as: scopes are responsible for collecting and maintaining a series of queries made up of all declared variables, and enforcing a strict set of rules that determine access to those variables by currently executing code. The scope of a variable is the context in which it is scoped. A scope specifies where a variable can be accessed and whether it can be accessed in that context.

In short, the function of a scope is to control program access to variables.

2. Classification of scopes

Scopes can be divided into global scopes and local scopes. Local scope can be divided into function scope and block-level scope.

In JS, each function creates a new scope, which we call function scope. Variables defined inside a function cannot be accessed from outside the function.

function testFun() {
	var test = 10;
	console.log(test);
}
function testFun2() {
	var test = 11;
	console.log(test);
}
testFun();/ / 10
testFun2();/ / 11
console.log(test);// test is not defined
Copy the code

From the above code we can see that :(1) we can use variables of the same name in different functions without affecting each other. (2) The variables defined inside the function cannot be accessed from outside the function. Let’s look at another piece of code:

var test = 9;
function testFun() {
	console.log(test);//undefined
	var test = 10;
	console.log(test);/ / 10
}
testFun();
console.log(test);/ / 9
Copy the code

In this code, test declared inside testFun is in function scope, while test declared outside the function is in global scope. ** In function scope, when you access test with the same name as the global scope, you access the function scoped variable. ** Let’s look at another piece of code:

var test = 9;
function testFun() {
	console.log(test);/ / 9
  	test = 10;
	console.log(test);/ / 10
}
testFun();
console.log(test);/ / 10
Copy the code

This code declares test in the global scope and assigns an initial value of 9. Then we see that values in the global scope can be accessed and modified within the function scope.

As mentioned earlier, while JS used to have no block scope, ES6 introduces the let keyword, which can be used to generate block-level scopes.

var foo = true;
if (foo) {
	let bar = 'New_Name';
	console.log(bar);//New_Name
}
console.log(bar);//bar is not defined
Copy the code

In the code above, the variable bar is declared in the block scope, and the value of bar is not accessible outside the block. What is the scope chain

3. Concept of scope chain

In general, the value of a variable is taken to the scope in which it was created. But if no value is found in the current scope, the chain is called the scope chain, and the chain is searched until the global scope is found. Take a look at the code:

var globalTest = 10
function funcDomin(flag) {
	var funcTset = 9;
	if (flag === true) {
		let blockTest = 8;
		console.log(blockTest);/ / 8
		console.log(funcTset);/ / 9
		console.log(globalTest);/ / 10
	}
}
funcDomin(true);
Copy the code

Access blockTest from the block-level scope. Since blockTest exists in the current scope of the domain, the lookup is not up. FuncTest is then accessed, and since funcTest is not in the current block-level scope, it looks up its parent scope, that is, funcTest’s function scope, and does not look up again. The globalTest case is similar, except that you look up one level, all the way to the global scope.

Well, that’s all for this time, and next time we’ll explore closing packages together.

Please do not hesitate to correct any mistakes. Welcome to review old knowledge and climb new steps with me