ES6：箭头函数以及this

ES6的箭头函数应该是ES6标准里我接触比较多的，看过几篇文章，现在对箭头函数自己做一个总结。
阮一峰老师的ES6介绍里面的《函数的扩展》关于箭头函数的介绍，还是相当详细。
结合从 use strict 看 JS（一）：this 与箭头函数一文，写写我关于箭头函数的理解。

---

this的调用方式

• 函数作为对象方法，在对象方法内使用this

var obj = {
    name: 'objName',
    getName: function(){
        return this.name;// 在此处使用this，叫做方法调用
    }
}

• 在函数里面调用

function func(){
    return this.name;
}

这里的this指向的是window对象（如果是在全局调用的话），但在严格模式里，这个this表示undefined。

• 在构造函数中使用，构造函数与普通函数的区别就是new关键字。

function constructor(name){
    this.name = name;
}
var amy = new constructor('Amy');

this指向的是new出来的对象实例。

• 使用apply/call/bind改变this指向

---

箭头函数

主要的用法就不再说了，说说其特点和需要注意的地方。

• 函数体内的this对象，就是定义时所在的对象，而不是使用时所在的对象。
  这里可以使用ES6和ES5的两种方式，看看实现效果

//ES6
function timer(){
    setTimeout(()=>{console.log(this.name);}, 1000);
}
timer.call({name: 'amy'}); //输出amy

//ES5
name = 'tom';
function timer(){
    setTimeout(function(){console.log(this.name)}, 1000);
}
timer.call({name: 'amy'}) //输出tom

箭头函数可以让setTimeout里面的this，绑定定义时所在的作用域，而不是指向运行时所在的作用域。

• 箭头函数里没有this

箭头函数中，没有this。如果你在箭头函数中使用了this，那么该this一定就是外层的this。

//错误， this为undefined/window
const person = {
    name: 'tom',
    getName: ()=>this.name;// == return undefined.name/window.name
}
// 可以稍做改动
const person = {
    name: 'tom',
    getName: function() {
        return setTimeout(() => this.name, 1000);
    }
}

// 编译之后变成
var person = {
    name: 'tom',
    getName: function getName() {
        var _this = this;  // 使用了我们在es5时常用的方式保存this引用

        return setTimeout(function () {
            return _this.name;
        }, 1000);
    }
};

为什么第一个代码段里的this为undefined呢？
是因为，箭头函数默认使用的是严格模式，严格模式中是匿名函数中的this指向的不再是window了，而是undefined。
即便不是undefined,那也是window。
箭头函数里面根本没有自己的this，而是引用外层的this。

• 不存在arguments参数

在箭头函数中是没有arguments参数的，这点和this一样。

function getMsg(msg){
    setTimeout(()=>console.log(arguments[0]));
}
getMsg('hi');//输出hi