title: Can I omit Return value in arrow function in JavaScript?
body: <p>I've been struggled from this for a long time.  we all know that <strong>arrow function</strong> simplifies the syntax, like this:</p>
  
  <p>A. Arrow function: </p>
  
  <pre><code>        onClick={() =&gt; toggleTodo(todo.id)}
  </code></pre>
  
  <p>B. Expand the Arrow function: </p>
  
  <pre><code>        onClick={() =&gt; {
             // we can see there is a return keyword here. can I just remove the return keyword ? 
             return toggleTodo(todo.id); 
             ^^^^^^
          }}
  </code></pre>
  
  <p>In the official redux tutorial, the file <code>AddTodo.js</code>:</p>
  
  <pre><code>import React from 'react'
  import { connect } from 'react-redux'
  import { addTodo } from '../actions'
  
  const AddTodo = ({ dispatch }) =&gt; {
    let input
  
    return (
      &lt;div&gt;
        &lt;form
          onSubmit={e =&gt; {                   // focus on this line
            e.preventDefault()
            dispatch(addTodo(input.value)).  // focus on this line, if i put return here, the code below won't be executed. if not, how to explain the syntax in the beginning?
            input.value = ''
          }}
        &gt;
          &lt;input ref={node =&gt; (input = node)} /&gt;
          &lt;button type="submit"&gt;Add Todo&lt;/button&gt;
        &lt;/form&gt;
      &lt;/div&gt;
    )
  }
  
  export default connect()(AddTodo)
  </code></pre>
  
  <p>The question is: in the <code>onSubmit</code>, why we don't need to put a <code>return</code> inside the function body ? Thank you.</p>