ES6:let const

栏目: JavaScript · 发布时间: 6年前

内容简介:存在的问题: 变量提升引起的问题在JS的预编译阶段,JS引擎会将上面的函数修改如下:因此,ES6引入了块级作用域,强化对变量生命周期的控制,块级作用域:声明在指定块作用域内的变量不能被该作用域之外来访问

es5 声明变量

var variable = value;

存在的问题: 变量提升引起的问题

function get(condition) {
    if(condition) {
        var value = 'test';
        return value;
    }else {
        return null;
    }
}

在JS的预编译阶段,JS引擎会将上面的函数修改如下:

function get(condition) {
    var value;
    if(condition) {
        value = 'test';
        return value;
    }else {
        return null;
    }
}

因此,ES6引入了块级作用域,强化对变量生命周期的控制,块级作用域:声明在指定块作用域内的变量不能被该作用域之外来访问

let

用法与 var 相同,但可以把变量的作用域限制在当前代码块,变量声明不会被提升

function get(condition) {
    if(condition) {
        <!-- value 作用域开始
        let value = 'test';
        return value;
        作用域结束 -->
    }else {
        return null;
    }
}

同一作用域内不能用 let 重复定义变量

var name = 'test';
let name = 'test';
// Uncaught SyntaxError: Identifier 'name' has already been declared

const

声明常量,值不可更改(如定义的是对象,则可以修改对象的值),声明的变量必须初始化;与 let 一样,不存在变量提升并且同一作用域内不能用 const 重复定义变量

const name = 'test';  // 正确定义并初始化

const obj = {count: 1};
obj.count = 2;

const name;
// Uncaught SyntaxError: Missing initializer in const declaration
var name = 'test';
const name = 'test';
// Uncaught SyntaxError: Identifier 'name' has already been declared
const name = 'test1';
name = 'test2';
// Uncaught TypeError: Assignment to constant variable.

临时死区(TDZ)

因为 let 与 const 不存在变量提升,如果在声明变量之前使用这些变量则会触发引用错误;只有在变量声明之后,变量才会从TDZ中移出,即可正常访问。

typeof value;
let value = 'test';
// VM2053:1 Uncaught ReferenceError: value is not defined

原文链接:https://arronf2e.github.io/es6let-const.html


以上所述就是小编给大家介绍的《ES6:let const》,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对 码农网 的支持!

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

Effective JavaScript

Effective JavaScript

David Herman / Addison-Wesley Professional / 2012-12-6 / USD 39.99

"It's uncommon to have a programming language wonk who can speak in such comfortable and friendly language as David does. His walk through the syntax and semantics of JavaScript is both charming and h......一起来看看 《Effective JavaScript》 这本书的介绍吧!

CSS 压缩/解压工具
CSS 压缩/解压工具

在线压缩/解压 CSS 代码

Base64 编码/解码
Base64 编码/解码

Base64 编码/解码

MD5 加密
MD5 加密

MD5 加密工具