zoukankan      html  css  js  c++  java
  • ES6的let和var声明变量的区别

    关于let的描述

    let允许你声明一个作用域被限制在块级中的变量、语句或者表达式。与var关键字不同的是,它声明的变量只能是全局或者整个函数块的。

    作用域规则

    let声明的变量只在其声明的块或子块中可用,这一点,与var相似。二者之间最主要的区别在于var声明的变量的作用域是整个封闭函数,是全域的 。

    function varTest() {
      var x = 1;
      if (true) {
        var x = 2;  // 同样的变量!
        console.log(x);  // 2
      }
      console.log(x);  // 2
    }
    
    function letTest() {
      let x = 1;
      if (true) {
        let x = 2;  // 不同的变量
        console.log(x);  // 2
      }
      console.log(x);  // 1
    }

    var存在变量提升现象,而let不存在

    • 浏览器在运行代码之前会进行预解析,首先解析函数声明,定义变量,解析完之后再对函数、变量进行运行、赋值等。 
    • 不论var声明的变量处于当前作用域的第几行,都会提升到作用域的头部。 
    • var 声明的变量会被提升到作用域的顶部并初始化为undefined,而let声明的变量在作用域的顶部未被初始化。
    // var 的情况
    console.log(foo); // 输出undefined
    var foo = 2;
    //相当于
    var foo;  //声明且初始化为undefined
    console.log(foo);
    foo=2;
    // let 的情况
    console.log(bar); // 报错ReferenceError
    let bar = 2;
    //相当于在第一行先声明bar但没有初始化,直到赋值时才初始化

    只要块级作用域内存在let命令,它所声明的变量就“绑定”这个区域,不再受外部的影响。总之,在代码块内,使用let命令声明变量之前,该变量都是不可用的,尽管代码块外也存在相同全局变量。

    var tmp = 123;
    
    if (true) {
      tmp = 'abc'; // ReferenceError
      let tmp;
    }
    alert(tmp);  //输出值为123,全局tmp与局部tmp不影响

    let不允许在相同作用域内,重复声明同一个变量。

    // 报错
    function () {
      let a = 10;
      var a = 1;
    }
    // 报错
    function () {
      let a = 10;
      let a = 1;
    }

    var在相同作用域内,可以重复声明同一变量

    // 表示重新赋值
    function () {
      var a = 10;
      var a = 1;
    }

    了解更多关于let的特性、模仿私有接口、暂存死区等

    参考整理来源:

    https://blog.csdn.net/zuiziyoudexiao/article/details/76890102

  • 相关阅读:
    二、gulp报错The following tasks did not complete
    一、python演示创建文件
    二、小程序的框架周期
    一、更改路由配置
    spring boot 实现文件下载
    sonarqube扫描安卓代码
    jenkis +sonarqube 对后端代码静态扫描,钉钉群通知执行结果(记录)
    SonarQube 平台搭建代码审查平台步骤
    python list的一个面试题
    oracle单机部署
  • 原文地址:https://www.cnblogs.com/meng-ma-blogs/p/9295667.html
Copyright © 2011-2022 走看看