JS-上下文練習

/**

* 由於JS沒有塊級做用域，if裏面的foo又是以var形式聲明的，因此會被提高上去，

* 被賦值爲undefined，以後undefined表明false，因此會進入if語句塊，

* foo被賦值爲10，因此下面會打印輸出10

*/

var foo =1;

function bar(){
    console.log(foo);  //  undefined
    if(!foo){
        var foo =10;
    }
    console.log(foo);   //  10
}
bar();

/**

* 調用b函數的時候，因爲b函數裏面的a函數存在函數提高，

* 會提高到最上面，因此第一次打印是function a() 接下來a被賦值爲10，

* 可是這個a只是一個函數上下文裏面的局部變量，用完以後就會被銷燬掉，

* 因此當外部打印a的時候，仍然打印出1

*/

var a =1;
function b(){
    console.log(a);   // function a
    a =10;
    return;
    function a(){}
}
b();
console.log(a);     //  1

// 執行fn函數之後，在全局上下文裏面會生成一個c，局部環境下面會生成一個b，

// 在fn函數調用完畢以後，b就會被銷燬，因爲f爲true，因此會進入if生成a變量

var f =true;
if(f===true){
    var a =10;
}
function fn(){
    var b =20;
    c=30;

}
fn();
console.log(a); //  10
console.log(c); // 30
console.log(b); //  報錯

/**

* 全局裏面首先會存在a和b，值都爲3，以後進入IIFE後，首先是執行的b = 5，

* 這個時候就會找到全局的b，將其修改成5，以後是var a = b，

* 這個a就是局部的a，因此全局的a不會受影響。

*/

 var a =b=3;
 (function(){
    var a =b=5;         //  b=5; var a =b;

 })()
 console.log(a);        //3
 console.log(b);  //  5

/**

* 在下面的foo函數會被提高，接下來第一條代碼打印出來就是function foo 接下來foo被賦值爲A，

* 因此打印輸出爲A，以後foo又被賦值爲一個函數，因此打印輸出爲function foo，調用foo，輸出B，後面是同樣的

*/

console.log(foo);   //   function foo
var foo ='A';
console.log(foo);//  A
var foo =function(){
    console.log('B');
}
console.log(foo);  //  function foo
foo();
function foo(){
    console.log('C');
}
console.log(foo);
foo();//B

/**

* 主要就是要注意b函數裏面的var a = 3存在變量提高，因此b函數裏面第一個是undefined，

* 接下來依次賦值打印輸出，可是因爲是局部變量，因此對全局的a不影響

*/

 var a =1;
 function b(){
     console.log(a); // undefined
     a =2;
     console.log(a);//  2
     var a=3;
     console.log(a);//  3
 }
 console.log(a);//1
 b();
 console.log(a);// 1