代表通信～すごく基本的なことだけど、、アロー関数の（）と｛｝

こんばんは。代表の草場です。

朝は学校関連の方とSDGsに関しての打ち合わせでした。公立高校向けのコンテンツを考えており、ネックは予算面。全国の高校生に広げていきたいものの、予算が限られているため、どういうスキームを組んでいくかがカギです。経験豊富な方なので、新たなアイデアができました。ファシリテーターの方々と連携して進めていきます。
その後はラボメン佐々木さんと取材対応でした。佐々木さんのプレゼンが前に比べてさらに磨きがかかっており、すべて責任を取るCEOの立場で仕事を自分で取りに行っている日常が見て取れました。かっこいいですね。株式会社WacWac、今後が楽しみです。

さて、React使っていろいろモノ作っています。アロー関数がかっこよくてひたすら使っています。MDN Web docによると、「アロー関数式は、より短く記述できる、通常の function 式の代替構文です。また、this, arguments, super, new.target を束縛しません。アロー関数式は、メソッドでない関数に最適で、コンストラクタとして使うことはできません。」
例えば、
elements.map(function(element( {
return elements.length;
}
が
elements.map(elements => {
return elements.length;
}
とか短く書ける感じです。

かっこいいので使っていたら、例えば
const elements = () => {
<h2>Hello Shuichi</2>
}
だとエラーがでて、
const elements = () => (
<h2>Hello Shuichi</2>
)
だとエラーが出ないケースが。なんだこれ？ということで、arrow func () {}でググるとこのStack Overflow出てきました。回答によると、「MDN ドキュメントで説明されているように、()でラップされたアロー関数は、それがラップした値を返す。」
なるほど、つまり、
const elements = () => (
<h2>Hello Shuichi</2>
)
と
const elements = () => {
return <h2>Hello Shuichi</2>
}
が同値なのか。なんとも基本的な話で草生えますが、一歩一歩。

明日もアロー関数。