ES6 的 新特性 3 箭头函数

箭头函数的作用:

1. 比function这种写法更加简洁；

2. 可以解决this指向的问题，因为它不会创建自己的this，而是继承上一级作用域的this。

使用场景:

1. 当函数内部不需要用到this的时候，都可以用箭头函数代替function;

2.需要this，但是需要的是上一级作用域的this。

箭头函数的几种写法：

1. 无参方法

    const fn = ()=>{alert(1)};
    fn();

2. 有参方法，有返回值

    const fn = (a,b)=>{return a+b};
    const r = fn(1,2);
    alert(r);

如果方法体只有一行代码，可以简化

    const fn = (a,b)=>a+b;
    const r = fn(1,2);
    alert(r);

如果参数只有一个，可以简化

    const fn = a=>a+1;
    const r = fn(1);
    alert(r);

 

需要注意的点

箭头函数被定义在对象中时，对象不产生作用域，箭头函数中的this指向对象的作用域中的this。

    var age = 100;

var obj = {
    age: 20,
    say: () => {
        alert(this.age)
    }
}

obj.say();

弹出的值是 100 。

如果用function，弹出的就是20，说明此时对象中的 this 指向的是 obj 自己的 作用域。

    var obj = {
        age: 20,
        say: function () {
            alert(this.age)
        }
    }

 如果在箭头函数中想调用对象的age，就不能用this，需要指定obj.age。

alert(obj.age)