箭头函数抓重点

[pekonchan]

格式

规规矩矩的格式：

([param1, param2, ...]) => {
    return ...
}

形参放在括号内；执行部分放在花括号内；有返回值就return。 这是一个规规矩矩的格式。

还有简写的形式。

只有一个形参

此时可以省略括号

param1 => {...}

执行部分只有一个表达式，且需返回表达式结果

此时可以省略花括号

param1 => param1 || 0;

上述就好比

(param1) => {
    return param1 || 0;
}

如果返回结果是一个对象格式，则需要圆括号包裹

param1 => ({a: param1});

函数是返回一个{a: param1}对象。

重中之中

箭头函数内是没有this,arguments,super,``这些对象的，且不得用作构建函数。

var Foo = () => {};
var foo = new Foo(); // TypeError: Foo is not a constructor

在箭头函数内出现的this，arguments等其实就是自己的作用域链的上一层继承来的。

若想在箭头函数里使用原本属于它自身的参数列表对象，那么可以是剩余参数

const test = (...args) => {
    console.log(args);
}

这时的args就相当于下面函数形式的arguments

function test() {
    console.log(arguments);
}

箭头函数的call、apply、bind

由于箭头函数没有自身的this，所以它使用call、apply、bind方法时，不能绑定this的。由于这三个方法的第一个参数是指定this，所以当在箭头函数上调用时，第一个参数是会被忽略的，第二个参数才算传参。

const invoke = (param) => {
    console.log(param);
}

invoke.call(1, 2) // 打印2
invoke.apply(1, [2]) // 打印2
(invoke.bind(1, 2))() // 打印2