title: Syntax rules for parentheses in JavaScript
body: <p>I'm curious about the syntax rules for parentheses in certain circumstances in JavaScript, such as in wrapping bits of code. I'm very familiar with using them for conditions, like <code>if(this) that</code> and to call functions, but there are a couple of other ways I've noticed myself using them and I don't actually know what the rule is, or if they're even connected.</p>
  
  <p>What I've seen:</p>
  
  <p>I've seen them used to wrap a function in IIFEs -the outside pair in <code>(() =&gt; { do something })();</code>, and also in implicit return statements from arrow functions when you want to break the line, like in React stateless functional components: </p>
  
  <pre><code>() =&gt; (
    &lt;div&gt;
      Hello World
    &lt;/div&gt;
  );
  </code></pre>
  
  <p>I'm also aware that you can wrap a condition in multiple parentheses (for no good reason) and it doesn't break anything: <code>if(((true)))</code>. </p>
  
  <p>What I want to know:</p>
  
  <p>I've discovered that I can't use parenthesis to organize my code just wherever I want to.</p>
  
  <p>Are these all related? What is the rule for how/when you can wrap things? Is it all for organization's sake or is there sometimes a change in functionality (I'm thinking IIFEs in particular here)?</p>
  
  <p>Thanks for any clarity on this!</p>