title: How to conditionally destructure on object?
body: <p>I have the following destructuring:</p>
  
  <pre class="lang-js prettyprint-override"><code>const {
      user: {
          username,
          image,
          uid
      } = {},
      gallery: {
          image: picture,
      } = {},
  } = data
  </code></pre>
  
  <p>The problem is <code>gallery</code> is sometimes <code>null</code> (not the <code>picture</code> within <code>gallery</code>), even though what I need is the <code>picture</code> within <code>gallery</code> when it exists. In other words, <code>gallery: null</code>, not <code>gallery.image: null</code>.</p>
  
  <p>Therefore, I get:</p>
  
  <blockquote>
    <p>null is not an object</p>
  </blockquote>
  
  <p>error message for <code>gallery.image</code>. </p>
  
  <p>How do I conditionally destructure so that <code>gallery.image</code> is used when it exists, but <code>gallery</code> isn't destructured when null?</p>