title: accessing javascript object from function
body: <p>Why does first work and not the latter?? *its only a minor difference where in the latter case i used the shorthand for accessing cats object property. I read that it shouldn't make any difference if "name of the property would be a valid variable name ― when it doesn't have any spaces or symbols in it and does not start with a digit character."</p>
  
  <pre><code>    //this works 
      var cats = {Spot:true};
  
      function addCat (name) {   cats[name] = true; }
  
      addCat("white");
  
      console.log ("white" in cats);  //true
  
      console.log (cats.white); //true
  </code></pre>
  
  <hr>
  
  <pre><code>    //this doesn't work 
      var cats = {Spot:true};
  
      function addCat (name) {   cats.name = true; }
  
      addCat("white");
  
      console.log ("white" in cats); //false
  
      console.log (cats.white); //undefined
  </code></pre>