title: JavaScript Object.create -- inheriting nested properties
body: <p>I've come across a peculiarity with Douglas Crockfords Object.create method which I'm hoping someone might be able to explain:</p>
  
  <p>If I create an object - say 'person' - using object literal notation then use Object.create to create a new object - say 'anotherPerson' - which inherits the methods and properties from the initial 'person' object.</p>
  
  <p>If I then change the name values of the second object - 'anotherPerson' - it also changes the name value of the initial 'person' object.</p>
  
  <p>This only happens when the properties are nested, this code should give you an idea of what I mean:</p>
  
  <pre><code>if (typeof Object.create !== 'function') {
      Object.create = function (o) {
          function F() {}
          F.prototype = o;
          return new F();
      };
  };
  
  // initiate new 'person' object
  var person = {
      name: {
          first: 'Ricky',
          last: 'Gervais'
      },
      talk: function() {
          console.log('my name is ' + this.name.first + ' ' + this.name.last);
      }
  }
  
  // create anotherPerson from person.prototype
  var anotherPerson = Object.create(person);
  // change name of anotherPerson
  anotherPerson.name.first = 'Stephen';
  anotherPerson.name.last = 'Merchant';
  
  // call talk method of both 'person' and 'anotherPerson' objects
  person.talk(); // oddly enough, prints 'Stephen Merchant'
  anotherPerson.talk(); // prints 'Stephen Merchant'
  </code></pre>
  
  <p>If I were to store the name values without nesting then this odd behaviour does not occur -- e.g.</p>
  
  <pre><code>// initiate new 'person' object
  var person = {
      firstName: 'Ricky',
      lastName: 'Gervais',
      talk: function() {
          console.log('my name is ' + this.firstName + ' ' + this.lastName);
      }
  }
  
  // create anotherPerson from person.prototype
  var anotherPerson = Object.create(person);
  // change name of anotherPerson
  anotherPerson.firstName = 'Stephen';
  anotherPerson.lastName = 'Merchant';
  
  // call talk method of both 'person' and 'anotherPerson' objects
  person.talk(); // prints 'Ricky Gervais'
  anotherPerson.talk(); // prints 'Stephen Merchant'
  </code></pre>
  
  <p>This nesting issue doesn't seem to occur when using a classical style of inheritance with a constructor function and the 'new' keyword.</p>
  
  <p>I'd be much appreciative if anyone's able to explain why this occurs!?</p>