50分钟ES6入门基础

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博客