浅析const、let与var

  以前无论声明变量还是常量,总是使用var一勺端,知道接触了es6之后,发现原来变量、常量的声明其实是很讲究的。

  这里简单来谈谈var、const与let。

  1、var。var声明的变量没有块级作用域,而且存在变量名提升的情况。这里举例说明。

<script>
    var num = 123;
    function foo(){
        console.log(num);  // undefined
        var num = 46;
        console.log(num) // 46
    }
    foo()
</script>                

  为什么第一个输出值会是undefined,而不是123呢?因为这里存在着变量名的提升,其实上述语句相当于:

<script>
    var num = 123;
    function foo(){
        var num;
    console.log(num);  // undefined
    num = 46;
    console.log(num) // 46
    }
    foo()
</script>    

  上面主要体现了var存在着变量名的提升,那么它没有块级作用域又是怎么体现的呢?最常见的是在条件语句里面,如if语句、for语句。这里以if语句为例。

<script>
    var num = 123;
    if(true){
        console.log(num) // 123
       var num = 456;
        console.log(num)  // 456
    }
    console.log(num)  // 456
</script>    

  这里为什么第一个输出值不是undefined,第三个输出值不是123呢?原因是这样的,因为var不存在块级作用域,且变量名会提升,所以上述代码其实相当于:

<script>
    var num;
    num = 123
    if(true){
      console.log(num) // 123
      num = 456;
      console.log(num)  // 456
    }
    console.log(num)  // 456
</script>

  所以在我看来,var其实是有利有弊的,利就是不用去管什么常量与变量的,直接使用var就行,弊就是不存在块级作用域且变量名会提升,这会在无形之中给我们带来许多意想不到的问题

 

  2、const(es6中用来定义常量的一个关键字(当然了,其他语言里也存在着const,这里仅指在js中)。常用来声明常量,且常量不可修改,必须初始化,存在着块级作用域。

  (1)、不存在名称提升问题。以代码说事儿。

<script>
    function foo(){
    console.log(num); 
    const num = 456;
    console.log(num)
    }
    foo()
</script>

  运行上述代码会发现会报错 Uncaught ReferenceError: num is not defined 。这里说明,使用const来定义的常量名并没有提升。

  

  (2)、声明时必须初始化。假如用const声明的常量并没有初始化呢?会有问题吗?直接上代码

<script>
    const num;
    console.log(num)
</script>

  这里运行后发现会报错。 Uncaught SyntaxError: Missing initializer in const declaration 意思是:语法错误,在const声明中没有初始化。

  同样的代码,只是const声明初始化,结果会不会有变化呢?答案是不言而喻的了。

  

  (3)、存在着块级作用域。什么叫块级作用域呢?上代码: 

<script>
    const num = 456
    if(true){
        const num = 789;
        console.log(num); // 789
    }
    console.log(num) // 456
</script>

  可见在if语句内声明的常量在if语句外并不能访问到,这里与var不同。这里是以if语句为例的,当然在for语句亦或是函数内都是这样的,存在着块级作用域

  

  3、let(es6中用来定义变量的一个关键字)。let定义的变量存在着块级作用域,在函数内定义的变量,对函数外部无影响。

  (1)、在函数内部定义的变量,对函数外部无影响,即存在着块级作用域。  

<script>
    let num = 789;
    function foo(){
        let num = 46;
    console.log(num) // 46
    }
    foo()
    console.log(num) // 789
</script>    

 

  (2)、不存在着变量名的提升。

<script>
    function foo(){
    console.log(num); // Uncaught ReferenceError: num is not defined
    let num = 46;
    console.log(num)
    }
    foo()
</script>

  运行后发现会报错,可见使用let声明的变量,并不像var那样存在着变量名的提升问题。

转载于:https://www.cnblogs.com/jf-67/p/8053494.html

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值