萌新的前端自学之旅第一步 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;

猜你喜欢

转载自blog.csdn.net/kirito0615/article/details/82585283