美文网首页
02. let & const 命令

02. let & const 命令

作者: 吃紫薯的water | 来源:发表于2017-12-05 19:37 被阅读0次

let & const 命令

原书作者:阮一峰
原书地址:ECMAScript 6入门

  • let 用法
  • 块级作用域
  • const 用法
  • ES6 声明变量的6中方法
  • 顶层对象

1. let用法

  • 基本特性
    • 用于定义变量(类似于var)
    • 作用域为当前代码块(不同于var)
    {
      let a = 10;
      var b = 1;
    }
    a // ReferenceError: a is not defined.
    b // 1
    
    • 不存在变量提升(不同于var)
      • 注:在定义let变量之前,该变量不可用,称为暂时性死区(TDZ)
    // var 的情况
    console.log(foo); // 输出undefined
    var foo = 2;
    
    // let 的情况
    console.log(bar); // 报错ReferenceError
    let bar = 2;
    
    // TDZ 导致typeof不再是一个永远不报错的操作
    typeof x; // ReferenceError
    let x;
    
    • 不允许重复声明(不同于var)
    // 报错
    function func() {
      let a = 10;
      var a = 1;
    }
    
    // 报错
    function func() {
      let a = 10;
      let a = 1;
    }
    
  • 合适场景
    • for循环计数器(设置循环信息为父作用域,循环体为子作用域)
    for (let i = 0; i < 3; i++) {
      let i = 'abc';
      console.log(i);
    }
    // abc
    // abc
    // abc
    

2. 块级作用域

  • 引入目的
    • 防止内层变量覆盖外层变量
    • 防止计数循环变量泄露为全局变量
  • 块级作用域与函数声明
    • 允许在块级作用域声明函数
    • 函数声明类似于var,即提升到全局作用域或函数作用域头部
    • 函数作用域会提升到所在块级作用域的头部

3. const用法

  • 基本特性
    • 用于定义常量
    • 作用域为当前代码块
    • 不存在变量提升
    • 不允许重复声明
    • const特性和let很像,区别在于const声明常量而let声明变量
    • const保证的是所指向变量的内存地址不能改变
      • 对于对象和数组内部数据结构变换无法控制

4. ES6 声明变量的6中方法

  • var
  • function
  • let
  • const
  • import
  • class

5. 顶层对象

  • 对象属性
    • ES6中,顶层对象属性不再与全局对象挂钩(保留var和function不变)
    var a = 1;
    // 如果在 Node 的 REPL 环境,可以写成 global.a
    // 或者采用通用方法,写成 this.a
    window.a // 1
    
    let b = 1;
    window.b // undefined
    
  • 对象本身
    • ES5 顶层对象在不同环境中实现不同
      • 浏览器,顶层对象是window,其他环境不支持
      • 浏览器和Web Worker,self也指向顶层对象
      • Node中,顶层对象是global,其他环境不支持
    • this可以用于取顶层对象,但
      • 全局环境中,this返回顶层对象,Node模块和ES6模块,this返回当前模块
      • 函数里面的,当函数不以对象方法运行,则this返回顶层对象,但是在严格模式下会为undefined
    • 取顶层对象方法(勉强可用)
    // 方法一
    (typeof window !== 'undefined'
       ? window
       : (typeof process === 'object' &&
          typeof require === 'function' &&
          typeof global === 'object')
         ? global
         : this);
    
    // 方法二
    var getGlobal = function () {
      if (typeof self !== 'undefined') { return self; }
      if (typeof window !== 'undefined') { return window; }
      if (typeof global !== 'undefined') { return global; }
      throw new Error('unable to locate global object');
    };
    

相关文章

  • 02. let & const 命令

    let & const 命令 原书作者:阮一峰 原书地址:ECMAScript 6入门 let 用法块级作用域c...

  • ES6的let 和 const 命令

    let 和 const 命令 let 命令 块级作用域 const 命令 顶层对象的属性 gl...

  • let和const

    新的赋值语句let和const let和const命令

  • ES6基础入门

    变量 let 命令 const 命令 函数

  • 重读 ES6(一)

    一、let 和 const 命令 let 命令 let 与 var 的区别:let 声明的变量只在 let 命令所...

  • 02. let、const

    1. let和var的区别 let定义的变量具有块级作用域 在全局中使用var定义的变量可以通过window.xx...

  • ES6需要记忆理解的地方

    let和const命令 1、let和const均无变量提升。2、let变量指向的地址可变,const指向的地址不可...

  • es6常用语法(一)

    let 和 const 命令 let 命令 只在let命令所在的代码有效 let命令,用来声明变量。它的用法类似于...

  • ES6快速使用

    let const let&const介绍let:声明变量,类似于var,但let所声明的变量只在let命令所在的...

  • js 中var contst let 之间的区别

    ECMAScript 6 新增 const 和 let 命令,用来声明变量。 那么const,let和var 在声...

网友评论

      本文标题:02. let & const 命令

      本文链接:https://www.haomeiwen.com/subject/ilthixtx.html