javascript - es6箭头函数的写法

Question

const mapStateToProps = (state) => ({
  todos: getVisibleTodos(state.todos, state.visibilityFilter)
})

明白这段代码返回了一个{todos:{...}}对象。但是不明白这种 =>后边是()的写法。

const testFun = (parameter) => ({result: parameter}) // <-求分析这种写法

Answer 1

哈哈，大兄弟，咱就直接上文档了哦
https://developer.mozilla.org...

看语法部分。

---

其实这事儿，可以这么理解。

基础语法中

(param1, param2, …, paramN) => expression
         // equivalent to:  => { return expression; }

同时({key: val}) 可以看成一个表达式。

() => ({key: val})
         // equivalent to:  => { return ({key: val}); }

Answer 2

不加括号你试试能得到你要的结果吗？估计被当成代码块了。

Answer 3

const testFun = (parameter) => ({result: parameter})

加了（）应该就相当于下面这段代码：

const testFun = (parameter) => {
    return {result: parameter}
}

隐式的告诉编译器返回{result: parameter}这么一个对象。

如果去掉（），那么testFun()的结果应该为undefined.

Answer 4

传送门->箭头函数

Answer 5

本来=>后面可以直接接返回值的

// 这两种写法效果一样
const fun1     = () => 1;
const fun1_alt = () => { return 1; };

但是这个返回值是对象字面量({})时会有歧义, 因为{}可以指对象字面量也可以是函数体
所以规定=>后的字面量时必须带()，就是你看到这个东西了