title: Javascript Dot Notation vs Bracket Notation
body: <p>I am trying to figure out why console prints <code>undefined</code> when I use <code>dot notation</code> when why it prints values of each key when I use <code>bracket notation</code>. </p>
  
  <p>What I want is to print the values of each key, so I use bracket notation. I just want to know why dot notation doesn't work.  </p>
  
  <p>Below is the example. </p>
  
  <pre><code>const sunny = { mac: 'priest', dennis: 'calculating', charlie: 'birdlaw', dee: 'bird', frank: 'warthog' };
  
  for(var key in sunny){
    console.log(sunny.key)
  }
  
  for(var key in sunny){
    console.log(sunny[key])
  }
  </code></pre>
  
  <blockquote>
    <p>undefined<br>
    undefined<br>
    undefined<br>
    undefined<br>
    undefined<br>
    "priest"<br>
    "calculating"<br>
    "birdlaw"<br>
    "bird"<br>
    "warthog"  </p>
  </blockquote>