1:預處理階段

當輸入如下程式碼時候

var a = 1;
function crli(){
    alert(a);
}
crli()//1

結果為 1

當改變下面程式碼時候

var a = 1;
function crli(){
    alert(a);
    var a = 5;
}
crli()//undefined

結果為 undefined

這是為什麼呢？

js解析與執行過程一共有2個階段，一個預處理階段，一個是執行階段（可以看成全域性預處理階段和執行階段，以及函式預處理階段和執行階段）

當js解析程式碼時候，會先建立一個lexical environme這麼一個物件，然後掃描js程式碼兩個部分：
一個是用宣告方式建立的函式，
另一個是用var 定義的變數，
然後把函式和變數的名字加到lexical environme中，比方說

1 . 全域性狀態

lexical environme(**全域性的環境物件===window**)
{
    a:undefined
    crli:對函式的一個引用
}

var a =5;
b = 1;
function crli(){

}

如果非函式宣告、非var方式宣告的變數，則預處理階段不會將函式和變數的名字加到lexical environme中
例子1：

a();//aa
b();//b is not a function

function a() {
    console.log("aa");
}
var b = function b(){
    console.log("bb"
 
);
}

lexical environme
{
    a:對函式的一個引用
    b:undefined
}

例子2：

console.log(a);//undefined
console.log(b);//b is not defined
var a = 1;
b = 2;

lexical environme
{
    a:undefined
}

當遇到函式宣告有衝突時候後者會覆蓋前者，
變數宣告有衝突時候，會忽略

alert(f);//function f(){console.log("s");}
function f(){
    console.log("s");
}
var f = 5
 
;
window
{
    f:指向函式
}

alert(f);//function f(){console.log("q");}
function f(){
    console.log("s");
}
var f = 5;
function f(){
    console.log("q");
}
window
{
    f:指向函式
}

2 . 函式狀態

function f(a,b){
    alert(a);
    alert(b);
    var b = 100;
    function a(){
    }
}
f(1,2)//function a(){}
      //2

當遇到函式宣告有衝突時候後者會覆蓋前者，
變數宣告有衝突時候，會忽略

lexical environme           lexical environme
{                           {
    a:1                          a:指向函式
    b:2             ==>          b:2
    arguments:                   arguments:
}                           }

此時解釋

var a = 1;
function crli(){
    alert(a);
    var a = 5;
}
crli()//undefined
window 
{
    a : 1
    crli:指向函式
}
lexical environme 
{
    a:undefined
}

函式預處理
執行時，alert(a) 所以是undefind