ES5中只有函数作用域和全局作用域,声明变量使用var,在es6中添加声明变量 let const

let 声明块级作用域变量,

let 不存在变量提升

var命令会发生”变量提升“现象,即变量可以在声明之前使用,值为undefined。这种现象多多少少是有些奇怪的,按照一般的逻辑,变量应该在声明语句之后才可以使用。

为了纠正这种现象,let命令改变了语法行为,它所声明的变量一定要在声明后使用,否则报错。

var 声明的变量可以在声明之前使用,是undifind,存在变量提升现象,let 声明的变量必须在声明之后使用,否则会报错

let 不允许重复声明变量

let实际上为 JavaScript 新增了块级作用域。

function f1() {
let n = 5;
if (true) {
let n = 10;
}
console.log(n); //
}

上面的函数有两个代码块,都声明了变量n,运行后输出5。这表示外层代码块不受内层代码块的影响。如果使用var定义变量n,最后输出的值就是10。

ES6 的块级作用域允许声明函数的规则,只在使用大括号的情况下成立,如果没有使用大括号,就会报错。

const命令 声明的是一个常量

const PI = 3.1415;
PI // 3.1415 PI = 3;
// TypeError: Assignment to constant variable.

上面代码表明改变常量的值会报错。

  1. 一旦声明,常量的值就不能改变
  2. const声明的变量不得改变值,这意味着,const一旦声明变量,就必须立即初始化,不能留到以后赋值
  3. const的作用域与let命令相同:只在声明所在的块级作用域内有效
  4. const命令声明的常量也是不提升,同样存在暂时性死区,只能在声明的位置后面使用
  5. const声明的常量,也与let一样不可重复声明。

本质

const实际上保证的,并不是变量的值不得改动,而是变量指向的那个内存地址不得改动。对于简单类型的数据(数值、字符串、布尔值),值就保存在变量指向的那个内存地址,因此等同于常量

但对于复合类型的数据(主要是对象和数组),变量指向的内存地址,保存的只是一个指针const只能保证这个指针是固定的,至于它指向的数据结构是不是可变的,就完全不能控制了。因此,将一个对象声明为常量必须非常小心。

const foo = {};

// 为 foo 添加一个属性,可以成功
foo.prop = 123;
foo.prop // // 将 foo 指向另一个对象,就会报错
foo = {}; // TypeError: "foo" is read-only

上面代码中,常量foo储存的是一个地址,这个地址指向一个对象。不可变的只是这个地址,即不能把foo指向另一个地址,但对象本身是可变的,所以依然可以为其添加新属性。

下面是另一个例子。

const a = [];
a.push('Hello'); // 可执行
a.length = 0; // 可执行
a = ['Dave']; // 报错

上面代码中,常量a是一个数组,这个数组本身是可写的,但是如果将另一个数组赋值给a,就会报错。

如果真的想将对象冻结,应该使用Object.freeze方法。

const foo = Object.freeze({});

// 常规模式时,下面一行不起作用;
// 严格模式时,该行会报错
foo.prop = 123;

上面代码中,常量foo指向一个冻结的对象,所以添加新属性不起作用,严格模式时还会报错。

除了将对象本身冻结,对象的属性也应该冻结。下面是一个将对象彻底冻结的函数。

var constantize = (obj) => {
Object.freeze(obj);
Object.keys(obj).forEach( (key, i) => {
if ( typeof obj[key] === 'object' ) {
constantize( obj[key] );
}
});
};

ES6有六种声明变量的方法:

var   function    let    const    class   import

顶层对象的属性

ES6为了改变这一点,一方面规定,为了保持兼容性,var命令和function命令声明的全局变量,依旧是顶层对象的属性;

另一方面规定,let命令、const命令、class命令声明的全局变量,不属于顶层对象的属性。也就是说,从ES6开始,全局变量将逐步与顶层对象的属性    脱钩

var a = 1;
// 如果在Node的REPL环境,可以写成global.a
// 或者采用通用方法,写成this.a
window.a // let b = 1;
window.b // undefined

上面代码中,全局变量avar命令声明,所以它是顶层对象的属性;全局变量blet命令声明,所以它不是顶层对象的属性,返回undefined

ES6 基础知识-----简记 let const的更多相关文章

  1. vue初体验-ES6 基础知识补充 let 和const

    本人水平有限,如内容有误,欢迎指正,谢谢. let  : 主要特点: 1.作用域只局限于当前代码块.2.使用let 声明的变量作用域不会被提升.3.在相同的作用域下不能声明相同的变量.4.for循环体 ...

  2. ES6基础知识(Reflect)

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. ES6 基础知识

    let:用来定义变量特点:只能在代码块里面使用,let拥有块级作用域;并且let不允许重复声明; 比如: var a = 12; var a = 5; alert(a); //5; let a = 1 ...

  4. 【ES6基础】let、const命令和变量的结构赋值

    ES5声明变量(2):var .function ES6声明变量(6):var.function.let.const.import和class 1.let命令和const命令 (1)let和const ...

  5. ES6基础之let、const

    es6的块级作用域通俗的讲就是一对花括号中的区域(声明对象的花括号不是块级作用域),块级作用域可以嵌套. let: 1.le声明的变量只在当前(块级)作用域内有效. 2.let声明的变量不能被重复声明 ...

  6. ES6基础知识(Map用法)

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. C#基础知识七之const和readonly关键字

    前言 不知道大家对const和readonly关键字两者的区别了解多少,如果你也不是很清楚的话,那就一起来探讨吧!探讨之前我们先来了解静态常量和动态常量. 静态常量 所谓静态常量就是在编译期间会对变量 ...

  8. es6基础知识

    1.超引用:(...) 用于取出参数对象中的所有可遍历属性,拷贝到当前对象之中 function fun(...args){ console.log(args); //[1,2,3,4,5,6] ar ...

  9. C++基础知识-inline、const、mutable、this、static

    一.在类定义中实现成员函数inline 类内的成员函实现其实也叫作类内的成员函数定义. 这种直接在类的定义中实现的函数,会被当做inline内联函数来处理. 二.成员函数末尾的const const: ...

随机推荐

  1. eclipse pom.xml 报错org.apache.maven.plugin.war.WarMojo的解决办法

    如题,maven项目eclipse提示pom.ml有错,提示信息就是org.apache.maven.plugin.war.WarMojo. 然后执行 maven install 出现如下错误提示 [ ...

  2. 尽量写出大家都能看懂的ReactJS入门教程

    个人感觉ReactJS相比于传统的JS框架还是挺有意思的,主要是它将JS代码和HTML代码完美的结合在了一起,有点jsp把java代码和html混在一起写的意思?但是它通过组件的形式实现了代码可复用, ...

  3. mysql 时间类型datetime与timestamp区别比较

    mysql 时间类型datetime与timestamp区别比较 相同点: 显示宽度和格式相同,显示宽度固定在19字符,格式为YYYY-MM-DD HH:MM:SS. 不同点: (1)时间范围不同: ...

  4. 由八数码问题引入。对BFS有更深考虑

    12号到今天共研究八数码问题poj1077,首先用的是普通BFS,遇到很多问题,开始用一个二级指针作为结构成员,知道了二级指针与二维数值名的不同!http://write.blog.csdn.net/ ...

  5. XCode warning:“View Controller” is unreachable because it has no entry points

    Unsupported Configuration: “View Controller” is unreachable because it has no entry points, and no i ...

  6. [bzoj4199][Noi2015]品酒大会_后缀自动机_后缀树_树形dp

    品酒大会 bzoj-4199 Noi-2015 题目大意:给定一个字符串,如果其两个子串的前$r$个字符相等,那么称这两个子串的开头两个位置$r$相似.如果两个位置勾兑在一起那么美味度为两个位置的乘积 ...

  7. Excel小tips - 设置指定可选填充内容

    数据——数据验证——设置——允许(A)——序列——来源 图1  数据验证界面 图2  选取序列数据字典 图3 效果展示 可以在同一个工作薄的同一个或者另一个工作表中设置指定内容(充当数据字典),然后点 ...

  8. tomcat的安装和使用

    1.下载最新的tomcat:https://tomcat.apache.org/download-90.cgi 最新版本9.0.2属于beta版本,就没有必要尝鲜踩坑了 使用8.5.24的稳定版本的二 ...

  9. the attribute buffer size is too small 解决方法

    在进行查询的时候引发The attribute buffer size is too small错误解决 http://bbs.esrichina-bj.cn/esri/viewthread.php? ...

  10. 【c++】拷贝控制具体分析

    我们可以定义拷贝操作,使类的行为看起来像一个值或者像一个指针,这取决于如何拷贝指针成员. 当我们拷贝一个像值的对象时,副本和原对象是完全独立的,改变副本不会对原对象有任何影响,反之亦然.标准库容器和s ...