ES6随笔--声明变量

ES6随笔--声明变量

let命令

  • 所声明的变量只在其所处代码块内有效;

    {let a = 10};
    alert(a);  // ReferenceError: a is not defined
    
    {let a = 10;
     alert(a);} //10
  • for循环中,for关键字后面跟的设置循环变量语句和后面循环体内部语句是父作用域和子作用域的关系;
    var arr = [];
    for (let i = 0; i < 5; i++) {
      arr[i] = function () {
        let i = 10;
        console.log(i);
      };
    }
    arr[3](); // 10
    
    for (let i = 0; i < 5; i++) {
      arr[i] = function () {
        console.log(i);
      };
    }
    arr[3](); // 3
  • let声明的变量不会提升;
    for (let i = 0; i < 5; i++) {
      console.log(x + i);
      var x = 10; // NaN, 11, 12, 13, 14; 第一次循环变量未初始化
    }
    for (let i = 0; i < 5; i++) {
      console.log(x + i);
      let x = 10; // ReferenceError: x is not defined
    }
  • 在代码块内,let声明变量之前,该变量不可用,即使是在父作用域有同名变量也不行,形成“暂时性死区(TDZ)”

    ```

    var arr = [];

    for (let i = 0; i < 5; i++) {

    arr[i] = function () {

    console.log(i);

    let i = 10;

    };

    }

    arr3; //ReferenceError: i is not defined

    //换成var 就不会出错了:输出undefined.

```

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

    for (let i = 0; i < 5; i++) {
      let a = 3;
      let a = 2;      //Identifier ‘a‘ has already been declared
    } 

js中原来并没有块级作用域的概念,一方面使用var声明的变量存在提升现象,另一方面var在非函数作用域内声明的变量都是全局变量,在循环中可能造成混淆引用。

let命令一定程度上规避了这些问题,相当于在js中引入了块级作用域的概念。

const声明一个只读的常量

  • 声明常量时必须立即初始化赋值;
  • let相似,const声明只在块级作用域内有效,不存在提升现象,也不允许在同一个作用域内重复声明。
  • const声明的基本类型值可以认为是常量不会改变,但如果声明一个引用类型值,其实际冻结的是这个引用(指针)而不是引用类型值本身。比如数组或对象,const声明指针后指针不能再改变,不能再给指针赋值,但可以在其指向的对象/数组本身加以操作。
  • 如果要冻结对象,使用Object.freeze()方法。
    const a = Object.freeze({});
    //下面操作不生效,严格模式会报错
    a.prop = "foo";

在ES6中,声明变量由原来的varfunction,增加到var/function/let/const/import/class六种;

变量的解构赋值

解构赋值可以以数组、对象和基本包装类型的对象等形式。

数组形式

  • 只要赋值语句的等号前后模式匹配,能够自动解构赋给对应变量对应的值,如果没有对应值则为undefined; 在数组中,...foo代表“剩下的值”组成的数组,必须放在最后;

    var [a, b, c, ...d] = [1, 2];
      console.log(a);  // 1
      console.log(b);  // 2
      console.log(c);  // undefined
      console.log(d);  // []
  • 如果等号左边是数组结构,只要等号后面的数据结构具有iterator接口,就能够按照数组解构赋值;否则会报错:
    let[a] = 1; //TypeError: 1 is not iterable
    let[b] = null; //TypeError: null is not iterable
    let[c] = undefined; //TypeError: undefined is not iterable
    let[d] = {}; //TypeError: {} is not iterable
  • 解构赋值也允许指定默认值,只有在赋值对应的位置严格等于undefined时默认值才会生效;如果默认值是表达式则只有在用到的时候才会求值;

对象形式

  • 解构赋值还可以用于对象:对象中的属性没有一定的顺序,所以在赋值时等号左、右要有完全一致的属性名才能取到值,否则就是undefined;

    let obj = {prop1:p1, prop2:p2} = {prop1:"first", prop2:"second"};
    // 属性名还是对象的属性名,变量被赋值;
      console.log(obj[prop1]);  // ReferenceError: prop1 is not defined
      console.log(obj["prop1"]); // "first"
      console.log(obj[p1]); // undefined
      console.log(p1); // "first"
    // 属性名同时也作为变量被赋值
    let obj = {prop1, prop2} = {prop1:"first", prop2:"second"};
      console.log(obj[prop1]);  // undefined
      console.log(prop1);  // "first"
      console.log(obj["prop1"]); // "first"
  • 可以转换为基本包装类型对象的基本类型的值,也可以用于解构赋值,包括数值、布尔值、字符串;(解构赋值的等号右边如果不是对象或数组,就先转换成对象,nullundefined不能转为对象,用于对象形式解构会报错)
  • 尽量不用圆括号,因为容易导致歧义;至少在赋值语句的模式部分不能使用圆括号;

变量解构赋值的用途

  • 变量值互换;
  • 函数返回的多个值可以一次取出赋给对应变量;
  • 函数参数定义和默认值;
  • 提取JSON数据;
  • 遍历map结构(for...of循环遍历配合解构赋值);
  • 输入模块的指定方法;


ES6随笔--声明变量

原文地址:https://www.cnblogs.com/muTing/p/9191555.html

时间: 2024-11-05 23:22:49

ES6随笔--声明变量的相关文章

ES6知识点整理之第5篇----声明变量总结与global

1.ES6声明变量的6种方法: var function let const import class 2.ES5 的顶层对象,在各种实现里面是不统一的. 浏览器里面,顶层对象是window,但 Node 和 Web Worker 没有window. 浏览器和 Web Worker 里面,self也指向顶层对象,但是 Node 没有self. Node 里面,顶层对象是global,但其他环境都不支持. 现在有一个提案,在语言标准的层面,引入global作为顶层对象.也就是说,在所有环境下,gl

ES6中6种声明变量的方法

ES5 只有两种声明变量的方法:var命令和function命令. ES6 除了添加let和const命令,还有两种声明变量的方法:import命令和class命令. 所以,ES6 一共有 6 种声明变量的方法. (1) var命令. var a ; //undefined var b = 1; var定义的变量可以修改,如果不初始化会输出undefined,不会报错 var 声明的变量在window上,用let或者const去声明变量,这个变量不会被放到window上 很多语言中都有块级作用域

ES6的强大变量声明

ES6是javascript的新特性,今天来说说声明变量 过去我们声明变量,都是一个一个声明,现在有了一种新的声明方式,它可以将一个多个变量同时声明,声明后变量同时存在一个集合中,集合的数据类型是对象(object).使用这种声明方式,可以使我们书写程序的过程中思路更加清晰,可以将同一事件下的所有变量集合起来,可以将相同意义的变量集合起来. 这样的变量声明方式叫做“模式匹配” 之所以叫做模式匹配,是因为等号两边的模式是一样的 var a = 1; var b = 2; var c = 3; 这是

ES6的let和var声明变量的区别

关于let的描述 let允许你声明一个作用域被限制在块级中的变量.语句或者表达式.与var关键字不同的是,它声明的变量只能是全局或者整个函数块的. 作用域规则 let声明的变量只在其声明的块或子块中可用,这一点,与var相似.二者之间最主要的区别在于var声明的变量的作用域是整个封闭函数,是全域的 . function varTest() { var x = 1; if (true) { var x = 2; // 同样的变量! console.log(x); // 2 } console.lo

es6 - 一共有 6 种声明变量的方法(var, function, let, const, class, import)

let声明的变量只在它所在的代码块有效. 不存在变量提升 let不允许在相同作用域内,重复声明同一个变量 暂时性死区,只要块级作用域内存在let命令,它所声明的变量就“绑定”(binding)这个区域,不再受外部的影响, 定义之前不能使用. 应该避免在块级作用域内声明函数.如果确实需要,也应该写成函数表达式,而不是函数声明语句. for循环的计数器,就很合适使用let命令. for (let i = 0; i < 10; i++) {let i = 'abc';} // 变量i是let声明的,当

初入ES6随笔

初入ES6随笔 var c = a => console.log(a) let a1 = 1; //只在块儿状作用域生效的变量声明 const a2 = 1; //常量声明,值不可改变,快儿状作用域 解构赋值语法 let [a3, b3, c3] = [1, 2, 3]; //数组解构赋值 let [a4 = 0, ...b4] = [1, 2, 3, 4] //数组解构赋值 a4 = 1 b4 = [2,3,4] 允许默认值; let {a5, b5} = {a5: "1",

ES6随笔--各数据类型的扩展(3)--函数

ES6随笔--各数据类型的扩展(3)--函数 1. 函数参数的默认值 可以在函数参数中指定默认值,函数内不能再用let或const声明: 使用参数默认值时,不能出现同名参数: 参数默认值惰性求值,每次调用函数会重新计算参数默认值表达式: let x = 99; function foo(p = x + 1) { console.log(p); } foo() // 100 x = 100; foo() // 101 可以与解构赋值默认值结合使用: function ({x, y = 5} = {

ES6随笔--各数据类型的扩展(1) --字符串和正则

ES6随笔--基本数据类型的扩展 字符串 Unicode表示法 \uxxxx表示的Unicode如果码数超过了0xFFFF的范围,只要放进大括号内就能识别: codePointAt() 用codePointAt()可以准确识别码数超出0xFFFF范围的Unicode字符: for...of循环能够正确识别32位的UTF-16字符: String.fromCodePoint() 与codePointAt()作用刚好相反:根据传入的Unicede码数返回对应的字符: 遍历 for...of循环可以循

ES6新特性-----变量和字符串

一.变量 1. LET 我们都习惯用var 来声明变量,现在还可以用let来声明变量,两者的主要区别是作用域:var声明的变量作用域为包围它的函数,而let声明的变量作用域仅在它所在的块中.(在ES5中是没有块的概念的). if(true){ let a=1; } console.log(a);//undifined 这样使代码更加干净,减少滞留的变量,再如我们经常用的数组遍历: for(let i=0;i<lists.length;i++){ //do somthing with lists[