title: Referencing complex variables in JavaScript
body: <p>How do you make the following JS variable references:</p>
  
  <ol>
  <li><p>When you have an array (<code>x[0], x[1], ...</code>), and you have a button like so:</p>
  
  <pre><code>&lt;button onclick="say(0)"&gt;&lt;/button&gt;
  </code></pre>
  
  <p>The function looks like this:</p>
  
  <pre><code>function say(src){
    // Define the box (some random div element will do)
    var box = document.querySelector('#box');
  
    // This is wrong, I know... I need to refer to the variable 'response[0]' in this case...
    box.innerHTML = response[src];
  }
  </code></pre></li>
  <li><p>When you have the following list of variables:</p>
  
  <pre><code>var book = "Some Book";
  var shelf = "Some Shelf"
  var bookshelf = "The cake!"
  </code></pre></li>
  </ol>
  
  <p>In this case, if I want to (for whatever reason) refer to the variable <code>bookshelf</code>, how do I do it by combining the variable names of the other two variables?</p>
  
  <p>I mean, I can't do <code>var x = book + shelf;</code> since that will give me the <code>result = "Some BookSome Shelf"</code>.</p>