ECMAScript6简介
Javascript的第六代标准
let和const命令
1.let命令
基本用法:
{
let a=10;
var b=1;
}
a //a is not defined
b //1
let 声明的变量只在它所在的代码块有效
不存在变量提升
console.log(foo); //输出undefined
var foo=2;
console.log(bar) //报错 referenceError
let bar=2;
暂时性死区
只要块级作用域内存在let命令,它所声明的变量就绑定这个区域,不再受外部的影响
var tmp=123;
if(true){
tmp=“abc”;//ReferenceError
let tmp;
}
ES6 规定暂时性死区和let、const语句不出现变量提升,主要是为了减少运行时错误,防止在变量声明前就使用这个变量,从而导致意料之外的行为。这样的错误在 ES5 是很常见的,现在有了这种规定,避免此类错误就很容易了。
总之,暂时性死区的本质就是,只要一进入当前作用域,所要使用的变量就已经存在了,但是不可获取,只有等到声明变量的那一行代码出现,才可以获取和使用该变量。
不允许重复声明
//报错
function func(){
let c=10;
var a=1;
}
//报错
function func(){
let a=10;
let a=1;
}
2.块级作用域
3.const命令
基本用法
const声明一个只读的常量。一旦声明,常量的值就不能改变
const PI=3.1415;
PI//3.1415
PI=3;//TypeError:Assignment to constant vatriable.
const声明的变量不得改变值,这意味着,const一旦声明变量,就必须立即初始化,不能留到以后赋值。
const的作用域与let命令相同:只在声明所在的块级作用域内有效。
if(true){
const MAX=5;
}
MAX;
//Uncaught ReferenceError:MAX is not defined;
本质
const实际上保证的,并不是变量的值不得改动,而是变量指向的那个内存地址所保存的数据不得改动。对于简单类型的数据(数值、字符串、布尔值),值就保存在变量指向的那个内存地址,因此等同于常量。但对于复合类型的数据(主要是对象和数组),变量指向的内存地址,保存的只是一个指向实际数据的指针,const只能保证这个指针是固定的(即总是指向另一个固定的地址),至于它指向的数据结构是不是可变的,就完全不能控制了。因此,将一个对象声明为常量必须非常小心。
const foo={};
foo.prop=123;
foo.prop //123
foo={};//TypeError:"foo" is read-only
ES6声明变量的六种方法
ES5:var function
ES6:let const var function import class
4.顶层对象的属性
var a = 1;
// 如果在 Node 的 REPL 环境,可以写成 global.a
// 或者采用通用方法,写成 this.a
window.a // 1
let b = 1;
window.b // undefined
global对象
#变量的解构赋值
1.数组的解构赋值
基本用法
ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring)。
以前,为变量赋值,只能直接指定值。
let a = 1;
let b = 2;
let c = 3;
ES6 允许写成下面这样。
let [a, b, c] = [1, 2, 3];
上面代码表示,可以从数组中提取值,按照对应位置,对变量赋值。
本质上,这种写法属于“模式匹配”,只要等号两边的模式相同,左边的变量就会被赋予对应的值。下面是一些使用嵌套数组进行解构的例子。
let [foo,[[bar],baz]]=[a,[[2],3]];
// foo//1
// bar//2
// baz//3
let [,,third]=["foo","bar","baz"];
//third ...baz
//
let [x,,y]=[1,2,4];
//x ...1
//y ...3
let[head,...tail]=[1,2,3,4,5];
//head ...1
//tail ...[2,3,4,5]
//
let [x,y,...z]=['a'];
//x 'a'
//y undefied
//z []
事实上,只要某种数据结构具有 Iterator 接口,都可以采用数组形式的解构赋值。
function* fibs(){
let a=0;
let b=1;
while(true){
yield a;
[a,b]=[b,a+b];
}
}
let[first,second,third,fourth,fifth,sixth]=fibs();
console.log(sixth);
默认值
解构赋值允许制定默认值
let [foo=true]=[];
foo//true
let [x,y='b']=['a'];//a='a',y='b'
let [x,y='b']=['a',undefined];//x='a', y='b'
注意,ES6 内部使用严格相等运算符(===),判断一个位置是否有值。所以,只有当一个数组成员严格等于undefined,默认值才会生效。
let [x = 1] = [undefined];
x // 1
let [x = 1] = [null];
x // null
2.对象的解构赋值
let {foo,bar}={foo:"aaa",bar:"bbb"};
foo //"aaa"
bar //"bbb"
3.字符串的解构赋值
字符串也可以解构赋值。这是因为此时,字符串被转换成了一个类似数组的对象
const [a,b,c,d,e]="hello";
a//'h'
b//'e'
c//'1'
d//'1'
e//'0'
类似数组的对象都有一个length属性,因此还可以对这个属性解构赋值。
let{length:len}="hello";
len //5
注:原文来自阮一峰ES6博客