es6新特性(一)

关于es6,阮一峰的《ECMAScript 6入门》 http://es6.ruanyifeng.com/写的非常详尽,可以经常看看,这里是对这本书进行一个缩略,可能有误,欢迎大家纠正。

注:代码区域内容十分的重要,折叠起来是为了能够总览特性,详细阅读,可以查看代码区内容

1. let 和 const new

  let的特性

  •   只在代码块内有效   
  •   不存在变量提升  如果先使用变量再声明就会报错ReferenceError,而不是和var一样,只会报undefined
  •   暂时性死区  如果代码块内定义了和外部的相同的变量,那么返回上一条这种情况
  •   不属于window  在es6里面,全局声明的let、const、class类不属于window对象
  •   不允许重复声明
    var tmp = 123;
    
    function func(arg) {
     //如果区块中存在let和const命令,这个区块对这些命令声明的变量,从一开始就形成了封闭作用域。凡是在声明之前就使用这些变量,就会报错。
     tmp = 'abc'; // ReferenceError ,还没有定义就会报错,变量不会提升
     let tmp;
     console.log(tmp);  //现在使用tmp就不会报错
    
     console.log(typeof undeclared_variable);   //如果一个变量根本没有被声明,使用typeof反而不会报错。没有let之前,typeof运算符是百分之百安全的
    
     let tmp = 'cctv';  //报错,不允许重复声明
     let arg = tmp;     //报错,不允许重复声明参数
    View Code

    const的特性 

  •   和let5条特性相同
  •   是一个只读常量    声明后立马赋值,不然就会报错
  •   存储的是地址  所以最好不要使用对象,因为地址是不可更改的但对象内容可以改
    const foo = Object.freeze({});
    
    // 常规模式时,下面一行不起作用;
    // 严格模式时,该行会报错
    foo.prop = 123;
    View Code

     

2.变量的解构赋值 new

  数组的解构赋值

 var a = 1;
 var b = 2;
 var c = 3;
 //ES6允许写成下面这样,左边是数组,右边也是数组(如果不是数组,那么严格地说,不是可遍历的结构,参见《Iterator》一章),那么将会报错)
 var [a, b, c] = [1, 2, 3];
 //嵌套数组解构
 let [foo, [[bar], baz]] = [1, [[2], 3]];    //  foo = 1    bar = 2    baz = 3
 //不完全解构,但会成功
 let [ , , third] = ["foo", "bar", "baz"];  //  third = "baz"
 //不完全解构,但会成功
 let [x, , y] = [1, 2, 3];  //  x = 1  y = 3
 //...tail代表数组
 let [head, ...tail] = [1, 2, 3, 4];    //  head = 1   tail = [2, 3, 4]
 //允许变量有默认值,只要变量的赋值不严格等于undefined(null,number,或者boolean等的情况下就不使用默认值)
 [x, y = 'b'] = ['a', undefined]; // x='a', y='b'
 //默认值取值是比较懒惰的,如果默认值是表达式或者函数,那就先取到赋值,有赋值就不管函数或者表达式啦
 function f() {
     console.log('aaa');
 }
 let [x = f()] = [1];
View Code

  对象的解构赋值

//先找到同名属性,比如左边的foo和右边的foo相对应,那么就把123值赋给obj.prop属性,所以这里真正赋值的是obj.prop而不是foo,见《对象的扩展》一章
let obj = {};
let arr = [];
//这里如果不用圆括号括起来就会报错,括起来以后就是一个表达式
//obj在这里面是子对象,也可以写成 { foo: obj{prop:undfined}, bar: arr[0] }
({ foo: obj.prop, bar: arr[0] } = { bar: true ,foo: 123});

//与数组一样,允许嵌套,和默认值,但是和数组不一样的就是对象可以不指定次序。
View Code

  字符串的解构赋值

//字符串被转换成了一个类似数组的对象。
const [a, b, c, d, e] = 'hello';
a // "h"
b // "e"
c // "l"
d // "l"
e // "o"
//类似数组的对象都有一个length属性,因此还可以对这个属性解构赋值。
let {length : len} = 'hello';
len // 5
View Code

  数值和布尔值的解构赋值

//解构赋值时,如果等号右边是数值和布尔值,则会先转为对象。
let {toString: s} = 123;
s === Number.prototype.toString // true

let {toString: s} = true;
s === Boolean.prototype.toString // true
//只要等号右边的值不是对象,就先将其转为对象。由于undefined和null无法转为对象,所以对它们进行解构赋值,都会报错
View Code

  函数参数的解构赋值

function move({x, y} = { x: 0, y: 0 }) {
  return [x, y];
}

move({x: 3, y: 8}); // [3, 8]
move({x: 3}); // [3, undefined]
move({}); // [undefined, undefined]
move(); // [0, 0]
View Code

 

posted @ 2016-10-18 14:55  yerr1990  阅读(327)  评论(0编辑  收藏  举报