zoukankan      html  css  js  c++  java
  • ES6 中的let 与 const关键字

    ES6 中的let 与 const关键字

    博客说明

    文章所涉及的资料来自互联网整理和个人总结,意在于个人学习和经验汇总,如有什么地方侵权,请联系本人删除,谢谢!

    简介

    let和const是es6新增加的两个关键字,主要作用是用来声明变量

    let关键字

    用法

    let 声明的变量只在 let 命令所在的代码块内有效,不能重复声明

    { 
    	let a = 0;  
            var b = 1;
    	a   //此时输出 0 
            b   //此时输出 1
    } 
    a   // 此时报错 ReferenceError: a is not defined
    b   // 此时输出 1
    

    常用环境

    在使用for循环时,适合使用let命令

    for (let i = 0; i < 10; i++){
    	...
    }
    i // 此时报错 ReferenceError: i is not defined
    

    在上述代码中,i只在for循环体之中有效,在循环体之外调用就会报错

    var a = [];
    for (var i = 0; i < 10; i++){
      a[i] = function(){
        console.log(i);
      }
    }
    a[8]();  // 10
    

    在上述代码中,变量ivar命令声明的,在全局范围内都有效,所以全局只有一个变量i

    每一次循环,变量i的值都会发生改变,而循环内被赋给数组a的函数内部的console.log(i),里面的i指向的就是全局的i。也就是说,所有数组a的成员里面的i,指向的都是同一个i,导致运行时输出的是最后一轮的i的值,也就是 10。

    var a = [];
    for (let i = 0; i < 10; i++){
      a[i] = function(){
        console.log(i);
      }
    }
    a[8]();  // 8
    

    如果使用let,声明的变量仅在块级作用域内有效,最后输出的是 8。

    不存在变量提升

    let不存在变量提升,var存在变量提升

    var命令会发生“变量提升”现象,即变量可以在声明之前使用,值为undefinedlet命令改变了语法行为,它所声明的变量一定要在声明后使用,否则报错。

    console.log(a); //ReferenceError: a is not defined 
    let a = "apple"; 
    
    console.log(b); //undefined 
    var b = "banana";
    

    上述代码中,b在脚本开始运行时就存在了,但是还没有进行赋值,所以返回undefineda在变量声明之前不存在,所以会报错。

    const关键字

    用法

    const 声明一个只读变量,声明之后不允许改变

    const PI = "3.1415926";
    PI  // 此时输出3.1415926
    
    PI = 3;
    // TypeError: Assignment to constant variable.
    
    const MY_AGE;  // 此时报错SyntaxError: Missing initializer in const declaration    
    

    const一旦声明必须初始化,否则会报错,只声明不赋值也会报错

    暂时性死区(TDZ)

    只要代码块中包含let或者const,它所声明的变量就会绑定这个区域,不会再受外部的影响

    var tmp = 123;
    
    if (true) {
      tmp = 'abc'; // ReferenceError
      const tmp;
    }
    

    暂时性死区的范围

    在代码块内,使用let或者const命令声明变量之前,该变量都是不可用的。

    if (true) {
      // TDZ开始
      tmp = 'abc'; // ReferenceError
      console.log(tmp); // ReferenceError
    
      let tmp; // TDZ结束
      console.log(tmp); // undefined
    
      tmp = 123;
      console.log(tmp); // 123
    }
    

    感谢

    万能的网络

    菜鸟教程

    阮一峰的es6语法教程

    以及勤劳的自己,个人博客GitHub

    微信公众号

  • 相关阅读:
    ImageSwitcher (图像切换器,显示图片)
    RatingBar
    SeekBar
    Assets 读取assets中的文件
    开关按钮(ToggleButton&Switch)
    MEF学习
    HttpWebRequest简单使用
    Redis学习
    SQL Join简单介绍
    EF 数据迁移
  • 原文地址:https://www.cnblogs.com/guizimo/p/14954326.html
Copyright © 2011-2022 走看看