zoukankan      html  css  js  c++  java
  • JS 几段代码 底层执行解析

    !(()=>{
      z = 9;
    })()

    console.log(z);//9

    立即执行函数 => 没有let或var声明 

            =>   z=9;   不声明直接赋值   =>  变量提升,相当于全局声明 var z=9;

            => 输出z   =>   9

    !(()=>{
       var y = 9;
    })()
    console.log(y);//ReferenceError: y is not defined

    立即执行函数 => var  y=9;  声明局部变量y,赋值9,然后啥也没做,直接全部销毁了

            => 输出y   =>   什么都找不到,直接报错:y没有定义

    console.log(x);//ReferenceError: x is not defined
    !(()=>{
        x =9;
    })()

    输出x   =>   什么都找不到,直接报错:x没有定义

    立即函数在输出语句下面,就没机会执行,如果立即函数在上面,就能得到x,和最上面一样。

    let d=10;
    function foo(){
        console.log(d);
    }
    !(()=>{
        let d =9;
        foo();
    })()
    
    //10

     定义变量d(全局)

      创建函数foo

    立即执行函数=> 定义变量d(局部)

          => 调用foo函数    函数执行的位置在上面,只看到全局的d 所以得到d=10

          => 输出10

    let d=10;
    !(()=>{
        let d =9;
        function foo(){
            console.log(d);
        }
        foo();
    })()
    //得到9
    -----------------------
    !(()=>{
        let d =9;
        foo();
    })()
    function foo(){
        console.log(d);
    }//d is not defined
    ----------------------
    let d=10;
    function foo(d){
        console.log(d);
    }
    !(()=>{
        let d =9;
        foo(d);
    })()
    //得到9
    console.log(a);//报错 不能在初始化之前使用a  Cannot access 'a' before initialization
    console.log(b);//报错 b没有声明  b is not defined
    let a=b=c=8;
    function fool(){
        let a=b=c=10;
    }
    console.log(a,b,c);//8 8 8
    fool();
    console.log(a,b,c);//8 10 10
    let a=b=c=8;
    => let a(全局); 等待右边计算(b=c=8)
    => var b(全局); 等待计算(c=8)
    => var c(全局); c赋值8,即 c=8,得到表达式c=8的值,8
    => b赋值8,即 b=8,得到表达式b=c=8的值,8
    => a赋值8,即 a=8;
    所以
    console.log(a,b,c);//8 8 8
    调用fool();
    函数里let a=b=c=10;

    => let a(局部); 等待右边计算(b=c=8)
    => 已经有了全局b; 等待计算(c=8)
    => 已经有了全局c,c重新赋值10,即c=10,得到表达式c=10的值,10
    => b赋值10,即 b=10,得到表达式b=c=10的值,10
    => a(局部)赋值10,即 a=10;
    所以最后一次
    console.log(a,b,c);//8 10 10 局部的变量a和全局的变量a不是一回事
    console.log(fool);//[Function: fool]
    var f = fool;
    var fool = 13;
    function fool() {
        console.log(fool);
        var fool = 4;
    }
    f(f=8);//undefined
    console.log(fool);//13
    console.log(f);//8
    fool(f = 6);//TypeError: fool is not a function

     预编译=>  fool 等于一个函数

    console.log(fool) => 输出一个函数

    var f = fool;  把fool函数赋值给 变量 f  ,f 指向函数

    var fool = 13;  重新声明fool,并赋值为13,不再指向函数

    f(f=8);  调用函数=> 计算 f=8 表达式

           => f被赋值为8,不再指向函数,但是函数已经被调用,所以开始执行函数

           => 传递8进去函数,没任何意义,

           => console.log(fool); 得不到外面的fool,因为函数体内有局部的fool声明,但是又在使用后才声明,所以得不到值,只拿到一个undefined

    console.log(fool);//13
    console.log(f);//8

    fool(f = 6);//TypeError: fool is not a function 此时fool就是一个数值 13
  • 相关阅读:
    MvvmLight:Command
    TreeView控件
    visual studio背景色
    公共语言运行时
    颜色列表
    自定义控件【旋转按钮,带圆角的边框】
    Loding Animation
    ComboBox前台xaml绑定数据
    Blend一些属性图解
    找到视觉树的方法
  • 原文地址:https://www.cnblogs.com/jiayouba/p/11944562.html
Copyright © 2011-2022 走看看