最新公告
  • 欢迎您光临起源地模板网,本站秉承服务宗旨 履行“站长”责任,销售只是起点 服务永无止境!立即加入钻石VIP
  • JavaScript变量提升简单介易懂

    正文概述 掘金(HHHxxx_hx)   2020-12-13   356

    变量提升

    一、什么是变量提升

    一)var 与 function 的变量提升

    例一

    // ***********************例一***********************
    console.log(a);
    var a = 10;
    console.log(a);
    // 打印结果如下:
    undefined
    10
    // 解析:
    // 1、在这一个代码块执行前,会首先做一次变量提升
    // 2、当在第二行发现 var a = 10 时,会对 a 做变量提升,对 a 进行声明(注意:仅仅是声明,没有定义或赋值,即只进行了var a 的操作)
    // 3、继续向下,结束后发现已经没有需要变量提升的了
    // 4、执行代码
    // 5、执行到第一行时,a已经声明,所以不会报错,但是此时a并没有赋值,所以 a 此时是undefined
    // 6、执行到第二行时,a已经声明,不需要重新声明,赋值 a = 10 即可,此时 a = 10
    // 7、执行到第三行时,a 已经赋值为 10,所以打印 10
    // 8、代码执行结束
    

    例二

    console.log(a);
    function a () {}
    console.log(a);
    // 打印结果如下:
    function a () {}
    function a () {}
    // 解析:
    // 与 var 不同的是,function 会将声明和赋值同时进行,所以第一次并不会打印 undefined。区别可以看下一个例子
    

    例三

    console.log(a);
    var a = function a () {}
    console.log(a);
    // 打印结果如下:
    undefined
    function a () {}
    // 与例二不同的是,例二是函数声明,而例三是函数表达式。
    // JavaScript中的函数表达式没有提升,不像函数声明,你在定义函数表达式之前不能使用函数表达式,如下
    a() // 报错:Uncaught TypeError: a is not a function
    var a = function a () { console.log('function') }
    -------------------
    a() // 打印'function'
    function a () { console.log('function') }
    

    二)let、const是否存在变量提升

    那么,let、const 是否有同样的问题呢?其他的声明方式呢?

    首先,先看几个简单的例子:

    例一

    console.log(a) // 报错:Uncaught ReferenceError: Cannot access 'a' before initialization
    let a = 10;
    console.log(a)
    // 报错不能在初始化之前访问a,所以 let 是不存在变量提升的
    
    console.log(a) // 报错:Uncaught ReferenceError: Cannot access 'a' before initialization
    const a = 10;
    console.log(a)
    // 报错不能在初始化之前访问a,所以 const 也是不存在变量提升的
    

    let 语句声明一个块级作用域的本地变量,并且可选的将其初始化为一个值。

    与通过 var 声明的有初始化值 undefined 的变量不同,通过 let 声明的变量直到它们的定义被执行时才初始化。在变量初始化前访问该变量会导致 ReferenceError。该变量处在一个自块顶部到初始化处理的“暂存死区”中。

    二、严格模式

    a = 0; // 给GO设置一个属性a -> window.a=0
    console.log(a)
    // 会打印出 0
    
    "use strict"
    a = 0;
    console.log(a)
    // 而严格模式下,会报错:Uncaught ReferenceError: x is not defined
    

    JavaScript变量提升简单介易懂

    // VO(G):全局变量对象「全局上下文中声明的变量」
    // GO「window」:全局对象 「浏览器默认开辟的一个堆内存,存储供JS调用的各种API的」
    // console.log(a);
    // 首先看VO(G)中是否有,如果没有,则再看GO中有没有,如果也没有,则报错:a is not defined 
    
    console.log(a) // Uncaught ReferenceError: a is not defined
    a = 10
    
    // 这里没有变量提升
    // 先看VO(G)中是否有,没有再看GO中是否有,也没有 Uncaught ReferenceError: a is not defined
    

    起源地下载网 » JavaScript变量提升简单介易懂

    常见问题FAQ

    免费下载或者VIP会员专享资源能否直接商用?
    本站所有资源版权均属于原作者所有,这里所提供资源均只能用于参考学习用,请勿直接商用。若由于商用引起版权纠纷,一切责任均由使用者承担。更多说明请参考 VIP介绍。
    提示下载完但解压或打开不了?
    最常见的情况是下载不完整: 可对比下载完压缩包的与网盘上的容量,若小于网盘提示的容量则是这个原因。这是浏览器下载的bug,建议用百度网盘软件或迅雷下载。若排除这种情况,可在对应资源底部留言,或 联络我们.。
    找不到素材资源介绍文章里的示例图片?
    对于PPT,KEY,Mockups,APP,网页模版等类型的素材,文章内用于介绍的图片通常并不包含在对应可供下载素材包内。这些相关商业图片需另外购买,且本站不负责(也没有办法)找到出处。 同样地一些字体文件也是这种情况,但部分素材会在素材包内有一份字体下载链接清单。
    模板不会安装或需要功能定制以及二次开发?
    请QQ联系我们

    发表评论

    还没有评论,快来抢沙发吧!

    如需帝国cms功能定制以及二次开发请联系我们

    联系作者

    请选择支付方式

    ×
    迅虎支付宝
    迅虎微信
    支付宝当面付
    余额支付
    ×
    微信扫码支付 0 元