[React] onClickがクリックしなくても動作してしまうとき

const someFunction = () => (...)という関数を定義したあと、
下記のようにbuttonのonClickに記述したのですが、どうやらクリックしなくても実行されているみたいでした。

<button onClick={someFunction}}>BUTTON</button>

そこで色々調べたところ、onClickには関数を渡さなければならないとのことでした。

something.jsx

// 正しい
<button onClick={() => someFunction()}>BUTTON</button>

// 間違い（式 or 値を渡している）
<button onClick={someFunction}}>BUTTON</button>

結論

onClickに渡すものは

○ 関数
X 式
X 値

である。

関数を渡すと、クリック時にその関数が動作する
式, 値を渡すと、画面読み込み時にその式, 値を評価（実行）してしまう