JS作用域知识点总结

2.1 函数能封闭住定义域

一个变量如果定义在了一个function里面，那么这个变量就是一个局部变量，只在这个function里面有定义。出了这个function，就如同没有定义过一样。

1  <script type="text/javascript">

2  function fn(){

3  var a = 1; //定义在一个函数里面的变量，局部变量，只有在函数里面有定义

4  console.log("我是函数里面的语句，我认识a值为" + a);

5  }

6 

7  fn();

8  console.log("我是函数外面的语句，我不认识a" + a);

9  </script>

 

 

a被var在了function里面，所以现在这个a变量只在红框范围内有定义：

 

 

JavaScript变量作用域非常的简单，没有块级作用域，管理住作用域的只有一个东西：函数。

（在ES6中，使用let和const声明的变量有块级作用域）

 

如果一个变量，没有定义在任何的function中，那么它将在全部程序范围内都有定义：

1 var a = 1;//定义在全局范围内的一个变量，全局变量，在程序任何一个角落都有定义

2 

3 function fn(){

4  console.log("我是函数里面的语句，我认识全局变量a值为" + a);

5 }

6 

7 fn();

8 console.log("函数外面的语句也认识a值为" + a)

 

 

总结一下：

● 定义在function里面的变量，叫做局部变量，只在function里面有定义，出了function没有定义的。

● 定义在全局范围内的，没写在任何function里面的，叫做全局变量，都认识。

2.2 作用域链

当遇见一个变量时，JS引擎会从其所在的作用域依次向外层查找，查找会在找到第一个匹配的标识符的时候停止。

1  function outer(){

2  var a = 1; //a的作用域就是outer

3  inner();

4  function inner(){

5  var b = 2; //b的作用域就是inner

6  console.log(a); //能够正常输出1，a在本层没有定义，就是找上层

7  console.log(b);   //能够正常输出2

8  }

9  }

10 

11  outer();

12  console.log(a); //报错，因为a的作用域outer

 

 

多层嵌套，如果有同名的变量，那么就会发生“遮蔽效应”：

1  var a = 1; //全局变量

2  function fn(){

3  var a = 5;         //就把外层的a给遮蔽了，这函数内部看不见外层的a了。

4  console.log(a); //输出5，变量在当前作用域寻找，找到了a的定义值为5

5  }

6  fn();

7  console.log(a);  //输出1,变量在当前作用域寻找，找到了a的定义值为1

 

 

作用域链：一个变量在使用的时候得几呢？就会在当前层去寻找它的定义，找不到，找上一层function，直到找到全局变量，如果全局也没有，就报错。

1  var a = 1; //全局变量

2  var b = 2; //全局变量

3  function outer(){

4  var a = 3; //遮蔽了外层的a，a局部变量

5  function inner(){

6  var b = 4;  //遮蔽了外层的b，b局部变量

7  console.log(a);   //① 输出3,a现在在当前层找不到定义的，所以就上一层寻找

8  console.log(b);   //② 输出4

9  }

10  inner(); //调用函数

11  console.log(a); //③ 输出3

12  console.log(b); //④ 输出2 b现在在当前层找不到定义的，所以就上一层寻找

13  }

14  outer(); //执行函数，控制权交给了outer

15  console.log(a); // ⑤ 输出1

16  console.log(b); // ⑥ 输出2

2.3 不写var就自动成全局变量了

1  function fn(){

2  a = 1; //这个a第一次赋值的时候，并没有var过，

3 //所以就自动的在全局的范围帮你var了一次

4  }

5 

6  fn();

7  console.log(a);

这是JS的一个机理，如果遇见了一个标识符，从来没有var过，并且还赋值了：

1 absdf = 123;

那么就会自动帮你在全局范围内定义var absdf;

告诉我们一个道理，变量要老老实实写var。

 

2.4 函数的参数，会默认定义为这个函数的局部变量

1 function fn(a,b,c,d){

2 }

a,b,c,d就是一个fn内部的局部变量，出了fn就没有定义。

 

2.5 全局变量的作用

全局变量挺有用的，有两个功能：

功能1：通信，共同操作同一个变量

两个函数同时操作同一个变量，一个增加，一个减少，函数和函数通信。

1 var num = 0;

2 

3 function add(){

4  num++;

5 }

6 

7 function remove(){

8  num--;

9 }

 

功能2：累加，重复调用函数的时候，不会重置

1  var num = 0;

2  function baoshu(){

3  num++;

4  console.log(num);

5  }

6 

7  baoshu(); //1

8  baoshu(); //2

9  baoshu(); //3

如果num定义在baoshu里面，每次执行函数就会把num重置为0：

 

1  function baoshu(){

2  var num = 0;

3  num++;

4  console.log(num);

5  }

6 

7  baoshu(); //1

8  baoshu(); //1

9  baoshu(); //1

 

2.6 函数的定义也有作用域

1  //这个函数返回a的平方加b的平方

2  function pingfanghe(a,b){

3  return  pingfang(a) + pingfang(b);

4  //返回m的平方

5  function pingfang(m){

6 return Math.pow(m,2)

7 }

8  }

9 

10  // 现在相求4的平方，想输出16

11  pingfang(4); //报错，因为全局作用域下，没有一个函数叫做pingfang

 

公式：

1 function 大{

2  function 小{

3 

4  }

5  小();   //可以运行

6 }

7 

8 小();   //不能运行，因为小函数定义在了大函数里面，离开大函数没有作用域。