JavaScript——作用域详解及应用

一、作用域概述

1、通常来说，一段程序代码中所用到的名字并不总是有效和可用的，而限定这个名字的可用性的代码范围就是这个名字的作用域。作用域的使用提高了程序逻辑的局部性增强了程序的可靠性，减少了名字冲突。
2、js的作用域（es6）之前：全局作用域 局部作用域
3、全局作用域：整个script标签，或者是一个单独的js文件
4、局部作用域：在函数内部就是局部作用域，这个代码的名字只在函数内部起效果和作用

二、变量的作用域

2.1 变量作用域的分类

在JavaScript中，根据作用域的不同，变量可以分为两种：全局变量和局部变量
1、全局变量：在全局作用域下的变量，在全局下都可以使用
注意：如果在函数内部没有声明直接赋值的变量也属于全局变量（前面不加 var）

<script>
	var num = 10;//num此时就是一个全局变量
	console.log(num)
	
	function fn(){
	console.log(num)//在局部函数中也可以调用全局变量
    }
    fn();
</script>

2、局部变量：在局部作用域下的变量，或者在函数内部的变量就是局部变量
注意：函数的形参也可以看做是局部变量

function fn(){
	var num = 10;//此时num就是局部变量只能在函数内部使用，在外面输出不了
	console.log(num)
    }
    fn();

3、从执行效率来看全局变量和局部变量

1. 全局变量在任何一个地方都可以使用，只有浏览器关闭的时候才会销毁，比较占内存资源
2. 局部变量只在函数内部使用，当我们程序执行完毕就会销毁，比较节约内存资源

三、作用域链

1. 只要是代码，就至少有一个作用域
2. 写在函数内部的是局部作用域
3. 如果函数中还有函数，那么在这个作用域中就又可以诞生一个作用域
4. 根据在内部函数可以访问外部函数变量的这种机制，用链式查找决定哪些数据能被内部函数访问，就称作作用域链（就近原则）

function fn(){//外部函数
	var num = 20;
	function fun(){ //内部函数

     }
}

案例1：结果是多少？

function fn1(){
	var num = 123;
	function fn2(){
	console.log(num);
}
fn2();
}
var num = 456;
fn1();

案例2：结果是多少？

var a=i;
function fn1(){
	var a = 1;
	var b = '10';
	fn2();
	function fn2(){
		var a=3;
		fn3();
		function fn3(){
      	var a = 4;
      	console.log(a);//a的值？
      	console.log(b);//b的值？
      }
    }
}
fn1();