美文网首页
第三小节:let和const理解

第三小节:let和const理解

作者: Janicerant | 来源:发表于2017-12-05 17:43 被阅读0次

        当你想声明的变量属于块级作用域,或者不想别人有意或无意地修改你声明的变量的时候,你这是可以用let和const来定义声明你的变量。接下来我们来看一下let和const更多的应用场景吧。
        首先我们谈一下利用let和const来代替立即执行函数(IIFE),我们都知道window变量中都有name这个属性,当我们利用var重新声明:var name = 'lucy' ; 的时候,会覆盖污染掉之前的name属性,这是因为变量name不在函数作用域中的时候属于全局变量,很容易污染全局作用域或者错误地修改了别人代码中已经使用的变量。为了避免这种情况,我们通常使用立即执行函数,使变量var私有化。如下图:

<script>
    (function () {
        var name = 'lucy';
    })();
</script>

        这个函数其实只是为了让这个变量变得私有化,没有任何意义。这不利于代码的可读性。这个时候呢,我们用let和const在块级作用域中也能达到这个效果。const变量此时只在这对{}中起作用,属于局部变量。如下图:

<script>
    {
        const name = 'lucy';
    }
</script>

        接下来我们再来看一下for循环场景中啦。

<script>
    for (var i=0;i<10;i++) {
        console.log(i);
        setTimeout(function(){
            console.log(`i:${i}`);
        }, 1000)
    }
</script>
        这个时候,在执行setTimeout这个函数的时候,会输出下图结果 image.png
这是因为var声明的变量是全局变量,下图的代码每执行完一次又会立刻执行下一次 image.png ,所以这个时候i的值已经变成l10,当 setTimeout函数执行的时候图上的for循环已经执行完了。为了有效地解决这个问题,把var变成let就行了。但是不能变成const哦,这是因为const变量不能重复声明。
下图为var变成let的结果:
image.png

相关文章

  • 第三小节:let和const理解

    当你想声明的变量属于块级作用域,或者不想别人有意或无意地修改你声明的变量的时候,你这是可以用let和const来定...

  • let和const理解

    ​let和const是es6新出的两种变量声明的方式,接下来我来分别针对这两个,聊一聊。 let​let它的出现,...

  • let和const

    新的赋值语句let和const let和const命令

  • 工作中常用的 ES6 语法

    变量声明 let 和const 不用var, 用const声明只读变量,let声明变量。let和const都是块级...

  • 关于ES6以及ES6常用的方法

    1、变量声明let和const let表示变量、const表示常量。let和const都是块级作用域。 2、模板字...

  • ES6需要记忆理解的地方

    let和const命令 1、let和const均无变量提升。2、let变量指向的地址可变,const指向的地址不可...

  • (JS)

    ES6 let、const和var的区别 let和const声明变量不存在变量提升 let和const不能重复声明...

  • ES6这些就够了

    1.变量声明const和let let表示变量、const表示常量。let和const都是块级作用域 2.模板字符...

  • 【JS】从ECMA学习let、const、var变量声明与声明提

    let、const、var是JS中的声明关键字 let和const 我们熟知的let和const的特性,常见的就有...

  • ES6编码风格

    http://es6.ruanyifeng.com/#docs/style let和const let和const...

网友评论

      本文标题:第三小节:let和const理解

      本文链接:https://www.haomeiwen.com/subject/gsoqixtx.html