ES6语法初探

1 前言

作为一个只写过Android的年轻工程师，起初让我接触ReactNative我是拒绝的，没办法，无法改变世界，只能接受世界。
先从学习ES6开始。
let和const命令
let命令
对比java来说
let类似于局部变量，只在相应的代码块内有效，var相应的对应为全局变量，所有的针对局部变量的说明针对let几乎都适用。
const命令
const命令类似于 之前写的 public static final 这样的命令
定义一个只读的常量，一旦生命，常亮的值就不能改变。
相比编译型的语言，js的声明变量的形式相对很稀少，ES6 共有6中，分别是var ,function,
let, const,import,class。
关于其他
大家学习ES6可能都是从阮一峰老师的书开始，感觉js的语法越来越接近传统的java语法，最起码思想上越来越接近，使我们这些只写过JAVA的接触起来更加方便了很多
重点记录一下目前为止用的比较多的
箭头函数
基本用法

//ES6允许使用‘箭头’(=>)定义函数。
var f  = v=>v;
//上面的箭头函数等同于：
var f = function(v) {
  return v;
};
//如果箭头函数不需要参数或需要多个参数，就使用一个圆括号代表参数部分。
var f = ()=>5;

//等同于
var f = function(){return 5};


var sum = (num1,num2) => num1+num2;

//等同于
var sum = function(num1,num2) {
   return num1+num2;

}
//若果箭头函数的代码块部分多余一条语句，就要使用大括号将他们括起来，并且使用return语句返回。
var sum = (num1,num2) => {return num1+num2;}
//由于大括号被解释成代码块，所以如果箭头函数直接返回一个对象，必须在对象外面加上括号。
var getTempItem = id => ({id:id,name:"Temp"});
//箭头函数可以与变量解构结合使用。
const full = ({first,last}) => first + ' ' + last;
//等同于
function full(person) {
  return person.first +' ' + person.last;

}
// 正常函数写法
[1,2,3].map(function(x){
   return x*x;
});
//箭头函数写法
[1,2,3].map(x=>x*x);

另一个例子是
//正常函数写法
var result =values.sort(function(a,b) {
    return a-b;
});
//箭头函数写法
var result = values.sort((a,b)=>a-b);

使用注意点
箭头函数有几个使用注意点。
(1) 函数体内的this对象，就是定义时所在的对象，而不是使用时所在的对象。
(2)不可以当做构造函数，也就是说，不可以使用new命令，否则会抛出一个错误。
(3)不可以使用arguments对象，该对象在函数体内不存在，如果要用，可以用Rest参数代替。
(4)不可以使用yield命令，因此箭头函数不能用作Generator函数。
上面四点中，第一点尤其值得注意。this对象的指向是可变的，但是在箭头函数中，他是固定的。

function foo() {
  setTimeout(() => {
     console.log('id:',this.id);
  },100);
}
var id = 21;
foo.call({id:42});

上面代码中，setTimeout的参数是一个箭头函数，这个箭头函数的定义生效是在foo函数生成时，二它的真正执行要等到100毫秒后，如果是普通函数，执行时 this 应该指向全局对象 window，这是应输出21。但是，箭头函数导致this总指向函数定义生效时所在的对象（本例是{id:42}）,所以输出的是42。
箭头函数可以让setTimeout里面的this，绑定定义时所在的作用域，而不是指向运行时所在的作用域。下面是另一个例子。

function Timer() {
    this.s1 = 0;
    this.s2 = 0;
    //箭头函数
    setInterval(() =>this.s1++,1000);
    //普通函数
    setInterval(function() {
       this.s2++;
     },1000);
}
   var timer = new Timer();

   setTimeout(()=> console.log('s1: ',timer.s1),3100);
   setTimeout(() => console.log('s2: ',timer.s2),3100);
//s1:3
//s2:0

上面代码中，Timer函数内部设置了两个定时器，分别使用了箭头函数和普通函数。前者的this绑定定义时所在的作用域(即Timer函数)，后者的this指向运行时所在的作用域(即全局对象)。所以3100毫秒之后，timer.s1被更新了3次，而timer.s2 一次都没更新。