作用域

目的：为了提高程序的可靠性，减少命名冲突。

JS的作用域分为：

1. 全局作用域
2. 局部作用域

1、全局作用域

整个<script>标签或一个单独的JS文件

<script>
   var num=10;
</script>

 2、局部作用域

在函数内部则是局部作用域，只在函数内部起效果和作用。

function fn(){
  //局部作用域；
}

 变量的作用域

1、全局变量

在全局作用域下的变量。

var num=10;
console.log(num);
function fn(){
 console.log(num);
}
fn()；

2、局部变量

在局部作用域下的变量，只能在函数内部使用。

function fun(){
 var num=10;
}
fun();
console.log(num);

3、二者做比较

1. 全局变量只有浏览器关闭的时候才会销毁，比较占内存资源。
2. 局部变量当我们程序执行完毕就会销毁，比较节约内存。
3. JS没有块级作用域（es6的时候新增的块级作用域）。
4. 块级作用域：{ }  if{ } for{ }

作用域链

1. 只要是代码就至少有一个作用域。
2. 写在函数内部的局部作用域。
3. 如果函数中含有函数，那么在这个作用域中又可以诞生一个作用域

var num=10;
function fn(){//外部
 var num=20;
   function fun(){//内部
     console.log(num);
   } 
}

​ 

JS预解析

JS引擎执行JS分为两步：

1. 预解析：js引擎会把js里面所有的var和function提升到当前作用域的最前面。
2. 代码执行：按顺序从上往下执行。

预解析分为：

1. 变量提升：把所有的变量声明提升到当前的作用域最前面（不提升赋值操作）。
2. 函数提升：把所有的函数声明提升到当前作用域的最前面。

1、变量提升：
console.log(num);
var num=10;
   ↓↓↓↓
var num；//变量提升
console.log(num);
num=10;//赋值不提升

2、函数提升
fun();
var fun=function(){
 console.log(22);
}
     ↓↓↓↓
var fun;//函数提升
fun();
fun=function(){
 console.log(22);
}

 预解析练习：

通过几个练习题来熟悉预解析叭！

1、

var num=10;
fun();
function(){
console.log(num);
var num=20;
}

    ↓↓↓↓
var num;//变量提升（全局作用域）
function=fun(){
 var num;//变量提升（局部作用域）
 console.log(num);
 num=10;
}
fun();

2、

var num=10;
function fn(){
 console.log(num);
 var num=20;
 console.log(num);
}
fn();
    ↓↓↓↓
var num;
function fn(){
 var num;
 console.log(num);
 num=20;
 console.log(num);
}
num=10;
fun();

3、

var a=18;
fn();
function fn(){
 var b=9;
 console.log(a);
 console.log(b);
 var a='123';
}
  ↓↓↓↓
var a;
function fn(){
 var b;
 var a;
 b=9;
 console.log(a);
 console.log(b);
 a='123';
}
a=18;
fn();

​