title: How do I get access to values of object inside nested objects?
body: <p>I am trying to have a nested object with a structure similar to this one:</p>
  
  <p>[EDIT] - Updated the object to better explain the situation</p>
  
  <pre><code>const theme = {
    primary: "#18f4c9",
    secondary: "#3264E8",
    background: "#1E3359",
    none: "rgba(0,0,0,0)",
    buttons: {
       borders: {
         primary: `none`,
         secondary: `1px solid ${theme.primary}`
       },
       background: {
         primary: `${theme.primary}`,
         secondary: `${theme.none}`
       },
       text: {
         primary: "#000",
         secondary: `${theme.primary}`
       }
    }
  };
  </code></pre>
  
  <p>I get why I have this error now. I'm trying to use this in react for specific components. And when I init the object later I don't get the specifications I needed.</p>
  
  <p>I get this error message: </p>
  
  <blockquote>
    <p>Cannot access 'objectTest' before initialization</p>
  </blockquote>
  
  <p>I don't know if this is even possible without hard coding it. But I have a much larger object but want to access these values several levels deep. Is this even possible?</p>