JSXへ関数を埋め込む際に、変数を渡すのとそうでないので挙動が変わる

これは、div を mousedown するとhandlerが実行される：

React.createClass({
  render: function() {
    var handler = function() {
      console.log('clicked');
    };
    return <div onMouseDown={handler} />;
  }
});

一方これは実行されない：

React.createClass({
  render: function() {
    return <div onMouseDown={function() {
      console.log('clicked');
    }} />;
  }
});

こうすると実行されるようになる：

React.createClass({
  render: function() {
    return <div onMouseDown={(function() {
      console.log('clicked');
    })()} />;
  }
});

仕組みは不明