web前端学习649-654（JavaScript作用域---作用域，变量的作用域，作用域链）

JavaScript作用域

• 作用域
• 变量的作用域
• 作用域链

1 作用域

1.1 作用域概述

通常来说, 一段程序代码中所用到的名字并不总是有效和可用的, 而限定这个名字的可用性的代码范围就是这个名字的作用域。作用域的使用提高了程序逻辑的局部性,增强了程序的可靠性,减少了名字冲突。

• JavaScript作用域：就是代码名字（变量）在某个范围内起作用和效果 目的：提高程序的可靠性，减少命名冲突
• js 的作用域（es6）之前：全局作用域 局部作用域
• 全局作用域：整个script 标签 或者是一个单独的js文件
• 局部作用域 在函数内部就是局部作用域 这个代码的名字只在函数内部起效果和作用

2 变量的作用域

2.1 变量作用域的分类

在JavaScript中，根据作用域的不同，变量分为两种：

1 全局变量 2 局部变量

2.2 全局变量

全局变量：在全局作用域下声明的变量（函数外部定义）

• 在代码任何位置都可以使用

• 在全局作用域下var声明的变量 是全局变量

• 特殊情况，如果在函数内部，没有声明直接赋值的变量也属于全局变量（不建议使用）

2.3 局部变量

局部变量：在局部作用域下的变量 在函数内部的变量

• 只能在函数内部使用

• 在函数内部var声明的变量是局部变量

• 函数的形参实际就是局部变量

2.3 全局变量和局部变量的区别

从执行效率来看全局变量（1）全局变量只有浏览器关闭的时候才会销毁，比较占内存资源（2）局部变量 当程序执行完毕就会销毁，比较节约内存资源

补充: js 没有块级作用域（了解）

js 中没有块级作用域 js的作用域：全局作用域 局部作用域 现阶段的js 没有 块级作用域

js是在es6 的时候新增的块级作用域

块级作用域 {} if {} for {}

3 作用域链

作用域链：内部函数访问外部函数的变量，采用的是链式查找的方式来决定取那个值，这种结构就称为作用域链 （就近原则，谁离得近执行谁，一层一层的）

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

案例1：结果是几？

function f1() {
  var num = 123;
  function f2() {
    console.log(num); // 123
  }
  f2();
}
var num = 456;
f1();

案例2：结果是几？

var a = 1;
function fn1() {
	var a = 2;
	var b = '22';
	fn2() ;
	function fn2 () {
		var a = 3;
		fn3() ;
		function fn3 () {
			var a = 4;
			console.log(a); //a的值?  4
			console.log(b); //b的值?  22
		}
	}
}
fn1 () ;

一层一层往上查找