JS變量提高問題（及一些做用域面試題）

變量聲明提高的做用在一個函數體內聲明的變量，JS解析器都會將其移動到函數體的頂部

var name = 'World!';
(function () {
    if (typeof name === 'undefined') {
        var name = 'Jack';
        console.log('Goodbye ' + name);
    } else {
        console.log('Hello ' + name);
    }
})();    //Goodbye Jack

等價爲==>

var name = 'World!';
(function () {
    var name;    
    if (typeof name === 'undefined') {
        name = 'Jack';
        console.log('Goodbye ' + name);
    } else {
        console.log('Hello ' + name);
    }
})();

執行的時候有個變量查找的過程，若是在當前函數體內沒找到，就會到定義的函數體的外層函數中去尋找，一直向上到全局對象中尋找，仍是找不到就會報TypeError錯誤

var name = 'World!';
(function () {
    console.log(name)     // World!
})();

以上代碼就表現爲這種行爲~~

二、函數同名狀況提高

func01();                   //打印last
    function func01() {
        console.log("first");
    }

    func01();                   //打印last
    function func01() {
        console.log("last");
    }

    //模擬提高後的狀況
    function func01() {
        console.log("first");
    }

    function func01() {
        console.log("last");
    }

    func01();
    func01();

三、變量名和函數同名的狀況（結論：若是出現變量和函數同名的狀況,則在進行提高的時候,只會提高函數到當前做用域頂端而忽略變量的提高操做）

console.log(a);                     //打印function
    function a() {
        console.log("我是一個函數");
    }
    var a = 20;
    console.log(a);                     //打印20


    //變量和函數提高後的結果 錯誤
//    function a() {
//        console.log("我是一個函數");
//    }
//    var a ;
//    console.log(a);
//    a = 20;
//    console.log(a);

    //變量和函數提高後的結果 正確
    function a() {
        console.log("我是一個函數");
    }
    console.log(a);
    var a = 20;
    console.log(a);

 

******************************************************************************** 

變量提高和做用域筆試題    一、

// f1();
  // console.log(b);
  // console.log(c);
  // console.log(a);

  // function f1(){
  //   var a = b = c = 9;
  //   console.log(a);      // 9 9 9 9 9 (not define)
  //   console.log(b);      // 緣由只有a是局部變量
  //   console.log(c);      // b,c都是全局變量
  // }

二、

/*f2();
  console.log(a);
  console.log(b);
  console.log(c);

  function f2(){
    var a = 9,b = 9,c = 9;
    console.log(a);         // 9 9 9 (not define)
    console.log(b);         // 緣由a,b,c都是局部變量
    console.log(c);
    console.log(c);
  }*/

三、

 /* var num = 1;
  function f3(){
    console.log(num); // 1  全局變量影響
    num = 2;
  }
  f3();*/

四、

/*var num = 1;
  f4();
  function f4(num){
    console.log(num);// undefine 有形參的狀況而且
    num = 2;         //沒有傳實參默認傳空值
  }*/

五、

/*var num = 1;
  f5(num);
  function f5(num){
    console.log(num);// 1  參數影響
    num = 2;
  }*/

六、in 關鍵字 判斷某個對象中是否有某個屬性

function f1(){
   var a;
   if("a" in window){
       var a = 10;
   }
   alert(a);        // 10
}
f1();

if("a" in window){
   var a = 10;
}
alert(a); // 10

//預解析
var a;
if("a" in window){
   a = 10;
}
alert(a);

var a;
if(!"a" in window){
   a = 10;
}
alert(a); // undefined

七、

var foo = 1;
function bar() {
   if(!foo) {
       var foo = 10;
   }
   alert(foo); 
}
bar();   // 10
//
//        //提高後的代碼
//        var foo;
//        function bar(){
//            var foo;
//            if(!foo) {
//                foo = 10;
//            }
//            alert(foo); //??10
//        }
//        foo = 1;
//        bar();

八、

function Foo() {
   getName = function(){ alert(1); };
   return this;
}

Foo.getName = function() { alert(2); };
Foo.prototype.getName = function(){ alert(3); };
var getName = function() { alert(4); };
function getName(){ alert(5); }

Foo.getName(); //       2
getName(); //           4
Foo().getName(); //     1  -->  使this指向window，Foo()函數的getName也就是window的屬性
getName(); //           1
new Foo.getName(); //   2  -->  new (Foo.getName());
new Foo().getName(); // 3  -->  (new Foo()).getName();
new new Foo().getName(); // 3  -->  new 3 = 3