萌新的前端自學之旅第一步 js變量提升

emmm希望有人看吧,希望有大佬指點一下前端學習路線!希望不要有大佬說我

練習1:

console.log(a);
    var a = 12;
    function fn() {
        console.log(a);
        var a = 13;
    }
    fn();
    console.log(a);

    //      1. 變量提升 var function
    //             var a; fn();
    //      2. 從上往下執行
    //             第一個打印undefined;   a = 12;   執行function
    //                                                     形參賦值,變量提升  var a(私有)  所以第二個打印爲underfined;
    //      3. 第三個打印爲12

練習2:

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

        //      1. 變量提升 var function
        //             var foo; bar();
        //      2. 從上往下執行
        //             foo = 1;   執行function
        //                              形參賦值,變量提升  var foo(私有)  此時foo爲undefined(布爾值爲false)  !foo 即爲true
        //                                      注: ! 布爾取反(進入if判斷  function中局部變量foo值爲10).
        //      3. 打印爲10

練習3:

var n = 0;
        function a() {
            var n = 10;
            function b() {
                n++;
                console.log(n);
            }
            b();
            return b;
        }
        var c = a();
        c();
        console.log(n);

        //      1. 變量提升 var function
        //             var n; a(); var c;
        //      2. 從上往下執行
        //             執行function a()
        //                  形參賦值,變量提升  var n(私有)  b();
        //                  從上往下執行 私有n = 10;  n(私有)(因爲沒有var 所以去上級找)++;
        //                  執行b n(私有) = 11;  第一次打印值爲11  a(函數值爲它的返回值)的值爲b();
        //      3. c = b();     調用c   n++ 並打印 a = 12;
        //      3. 最後打印全局 n = 0 ;

練習4:

var a = 10,b = 11, c = 12;
        function test(a) {
            a = 1;
            var b = 2;
            c = 3;
        }
        test(10);
        console.log(a);
        console.log(b);
        console.log(c);

        //      1. 變量提升 var function
        //             var a; var b; var c; test(a);
        //      2. 從上往下執行
        //             全局 a = 12; 全局 b = 11; 全局 c = 12;   執行function
        //                                                              形參賦值,變量提升  形參 a = 10;  var b;
        //                                                              形參 a = 1     私有 b = 2;    全局 c = 3;
        //      3.  打印a爲全局a爲10;     打印b爲全局b爲11;      打印c爲全局c爲3

練習5:

if (!("a" in window)){
            var a = 1;
        }
        console.log(a);
        //      1. 變量提升 var function
        //             var a (其實同時多了一個window.a)
        //      2. 從上往下執行
        //             window.a in windowtrue   ! 取反後爲 false 無法進入if判斷
        //                 a = undefined
        //      3. 打印 a = undefined;

練習6:

var a = 4;
        function b(x,y,a) {
            console.log(a);
            arguments[2] = 10;
            console.log(a);
        }
        a = b(1,2,3);
        console.log(a);

        // arguments 和形參之間的映射(建立在函數執行後形參賦值的一瞬間,後面添加的都不會建立映射)是以arguments的索引爲基礎完成的,索引對不上賦值爲undefined
        //      1. 變量提升 var function
        //             var a; b();
        //      2. 從上往下執行
        //             a = 4;   執行function
        //                            形參賦值,變量提升     形參x = 1 y = 2 a = 3
        //                            打印傳入形參a的值爲 3;   私有a = 10;  打印a = 10;
        //      3. 打印全局a a 爲函數b返回的結果 因爲b沒有return 所以a爲undefined

練習7:

var a = 9;
    function fn() {
        a = 0;
        return function (b) {
            return b + a++;
        }
    }
    var f = fn();
    console.log(f(5));
    console.log(fn()(5));       //先執行fn()(會把已經變成1的全局變量a重新賦值爲0) 再執行返回值
    console.log(f(5));
    console.log(a);

    //      1. 變量提升 var function
    //             var a; fn() var f;
    //      2. 從上往下執行
    //             全局a = 9;   執行function
    //                                形參賦值,變量提升
    //             全局a = 0;            fn()值爲 function (b){};  不可銷燬 因爲內容被外部一直佔用
    //                                             執行function(b){}
    //                                                  function(b)爲 b+a++(++會在當前執行後執行,全局a++);
    //             全局f = fn()
    //      3. 打印第一個值爲 5;   打印第二個值爲 5;    打印第三個值爲 6;  打印a爲2;
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章