时间戳

首页 > 技术文章 > es6之let和const

es6之let和const

yaya-003 2020-04-24 15:10 原文

1.使用基本相同

    var a = 1
    console.log(a)
    var b = "hello"
    console.log(b)

    let c = 10
    console.log(c)

    const d = "hello"
    console.log(d)

2.let可以重复赋值，const不可以重复赋值（let定义变量，const定义常量）

const 一旦给一个变量赋值以后，这个变量的值以后不能再改变了

   let c = 10
    c = c + 1
    console.log(c)

    const d = "hello"
    d = d + "world"
    console.log(d)

3.为什么会出现let和const呢？var的痛点在哪里

（1）var可以重复声明变量带来的缺点，看一个小场景

　　假如我们在项目的开始定义了一个变量叫做productPrice=5.99,在5000行代码之后，我们使这个变量自增了，应该得到6.99

　　可是我们忘记了在1000行代码的时候，我们又重复定义了一下productPrice=9.99，实际我们取到的值是10.99

    var productPrice = 5.99
    // line 1000
    var productPrice = 9.99
    // line 5000
    productPrice++
    console.log(productPrice) //10.99

有人会说我们可以使用js的严格模式来解决这一问题，每次都要使用严格模式是不是有办法来解决这一痛点呢？

（2）var是函数作用域，let和const是块作用域

以下两个案例中：

　　第一个案例中的变量price,定义在函数外面，是个全局变量，所以能正常访问。

　　第二个案例的变量定义在了函数内部，就成了局部变量，只在局部作用域内有效，外部无法访问这个局部变量，所以报错。（里面看得到外面，外面看不到里面）

    var price = 1
    function setPrice(){
      price++
    }
    setPrice()
    console.log(price)  //2
 
    function setPrice(){
      var price = 1
      price++
    }
    setPrice()
    console.log(price)  //Uncaught ReferenceError: price is not defined

小练习：函数作用域

    var price = 1;
    function setPrice(){
      var price = 10
      console.log(price)  //打印的是局部变量
      console.log(window.price)  //打印的是全局变量
    }
    setPrice()
    console.log(price)   //打印的是全局变量

块级作用域（if(){}  for(){} while(){}都是块级作用域，只要是有花括号{}都是块级作用域，函数作用域也包含在块级作用域里面）

    for(var i = 0; i < 5; i++){}
    console.log(i)  //5


    for(let i = 0; i < 5; i++){}
    console.log(i)  //Uncaught ReferenceError: i is not defined

for循环不是函数，是一个块。

第一个案例中：var生命的变量是全局变量，在块外面还能用

第二个案例：let声明的是局部变量，在块外面用不了

那么问题来了？在开发中如何选择let和const呢？

答案是：绝大部分用const,当你想让这个变量有所改变时再用let

推荐阅读