es6标准入门
第2章 let和const命令
2.1 let命令
2.1.1 基本用法
let
用来声明变量,但所声明的变量只在let命令所在的代码块内有效。与var不同,var声明的变量在全局范围内都有效。
let
命令多用于for
循环
for(let i=0;i<10;i++){
a[i]=function(){
console.log(i);
};
}
a[6]{};//6
从上面这个例子,可以知道i只在本轮循环有效,每一次循环的i都是一个新的变量。这得益于JavaScript引擎内部,会记住上一轮循环的值,初始化本轮的变量i时,就在上一轮循环的基础上进行计算。
for(let i=0;i<3;i++){
let i='abc';
console.log(i);
}
//abc
//abc
//abc
上面这个例子,体现for
循环的一个特点,函数内部的变量i和循环变量i不在同一个作用域,而是有各自单独的作用域。
2.1.2 不存在变量提升
变量提升:变量可以在声明之前使用,值为undefined。
var
命令会发生“变量提升”现象
而let
命令所声明的变量一定要在声明后使用,否则会报错,抛出错误。
2.1.3 暂时性死区
只要块级作用域内存在let命令,它所声明的变量就“绑定”在这个区域,不再受外部的影响。也就是说,<mark>在外部声明的变量与let内部声明的不同</mark>!!
ES6明确规定,如果区块中存在let和const命令,则这个区块对这些命令声明的变量一开始就形成封闭作用域,只要在声明之前使用这些变量,就会报错。这就称为“暂时性死区”。只有等到声明变量后,才可以获取和使用该变量。
2.1.4 不允许重复声明
let
不允许在相同作用域内重复声明同一个变量,因此也不能再函数内部重新声明参数。
块级作用域
2.2.1 为什么需要块级作用域
- 内层变量可能会覆盖外层变量
- 用来计数的循环变量泄露为全局变量
2.2.2 ES6的块级作用域
使用let
命令,保证外层代码块不受内层代码块的影响。
function f1(){
let n=5;
if(true){
let n=10;}
}
console.log(n);//5
}
- ES6允许块级作用域的任意嵌套,外层作用域无法读取内层作用域的变量。
- 内层作用域可以定义外层作用域的同名变量。
2.2.3 块级作用域与函数声明(避免在块级作用域内声明函数)
在块级作用域内,函数声明语句在块级作用域外不可引用。
es6规定如下
- 允许在块级作用域内声明函数(在使用大括号内成立)
- 函数声明类似于var,即会提升到全局作用域或函数作用域的头部
- 同时,函数声明还会提升到所在的块级作用域的头部。
2.2.4 do表达式(提案!未施行!)
本质上,块级作用域是一个语句,将多个操作封装在一起,没有返回值。(上面所说,在块级作用域外无法访问域内的值)
使用do
表达式,可以得到块级作用域内的值。
let x = do {
let t=f();
t*t+1;}
//变量x会得到整个块级作用域的返回值
2.3 const命令
2.3.1 基本用法
const
声明一个只读的常量。一旦声明,常量的值就不能改变。需要立即初始化。const
的作用域与let
相同,且所声明的常量不会提升,存在暂时性死区。
2.3.2 本质
const
实质上保证的并不是变量的值不得改动,而是变量指向的那个内存地址不得改动。
- 简单类型:值保存在变量指向的内存地址中,因此等同于常量
- 复合类型:变量指向的内存地址保存的只是一个指针->
const
保证这个指针是固定的。
<mark>小心将一个对象声明会常量</mark>
object.freeze({})
冻结一个对象。->冻结后,该对象添加新属性时也不起作用,严格模式下会报错。
2.3.3 ES6声明变量的6种方法
var
function
let
const
import
class
2.4顶层对象的属性
顶层对象在浏览器环境中指的是window对象,在node环境中指的是global对象。
ES6规定,var
和function
声明全局变量依旧是顶层对象的属性;let
、const
、class
声明的全局变量不属于顶层对象的属性。
2.5 global对象
this变量的局限性
- 在全局变量中,this会返回顶层对象。但是在Node模块和ES6模块中,this返回的是当前模块。
- 寒湿重的this,如果函数不是作为对象的方法运行,而是单纯作为函数运行,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');
}
参考文献
《ES6标准入门》(第三版)——阮一峰(著)