为何mapStateToProps的props对象外要加()括号？是IIFE吗？

嗨，这个问题问到点子上了！很多刚接触箭头函数的同学都会被这个小细节搞懵，我给你一步步理清楚：

1. 括号的核心作用：避免语法歧义 #

箭头函数有个语法规则：如果你的函数要直接返回一个对象字面量，必须把这个对象用括号包起来。

为啥呢？因为JavaScript会把单独的{}当成函数体的分隔符，而不是对象的标志。比如你要是写成：

const mapStateToProps = state => { auth: state.auth };

JS引擎会把{ auth: state.auth }解析成函数体——里面的auth:会被当成标签语句（类似break/continue的标签），而不是对象的键值对，最后这个函数会返回undefined，完全不是你想要的结果！

加上括号之后：

const mapStateToProps = state => ({ auth: state.auth });

括号相当于给JS引擎递了个“暗号”：「嘿，这里的大括号是我要返回的对象，不是函数体哦！」这样它就会正确解析成包含auth属性的对象，作为函数的返回值。

2. 这和IIFE完全没关系！ #

你提到的立即执行函数表达式（IIFE）是定义完函数立刻执行的写法，比如：

(() => { console.log('我执行啦') })();

而咱们这里的括号只是用来包裹箭头函数的返回值，没有任何“执行”的操作，只是解决语法解析的问题，和IIFE八竿子打不着~

补充：等价的写法 #

如果觉得括号看着别扭，你也可以用完整的函数体写法，效果完全一样：

const mapStateToProps = state => {
  return { auth: state.auth };
};

这种写法用return明确返回对象，就不需要额外加括号了，只是箭头函数的简洁写法更常用在mapStateToProps这种逻辑简单的场景里。

内容的提问来源于stack exchange，提问作者t411tocreate