4

Please help me in understanding this piece of code.

var person = {
    'first-name': 'FirstName',
    'last-name': 'LastName',
    'gender': 'Male'
};

var anotherPerson = new Object(person);
anotherPerson.desig = 'Designation';

console.log('Another person designation: ' + anotherPerson['desig'] + ', person designation: ' + person['desig']);

I expected the output to be Another person designation: Designation, person designation: undefined but to my surprise I found it to be `Another person designation: Designation, person designation: Designation.

According to me anotherPerson is extending person object and properties set to anotherPerson should not be visible to person object. Am I wrong here? Or is that both the object are pointing to the same location?

[EDIT]

Now there are even more surprises.

I added the following code to the above.

person.place = 'XYZ';
console.log(person['place'] + ', ' + anotherPerson['place']); // Expected: XYZ, undefined. Result: XYZ, XYZ.

Based on the above result and answers I thought that both objects are referring to the same location. Now I added few more lines

person = undefined;
console.log(anotherPerson['place']) //Expected: error, Result: XYZ. ??!?!?
console.log(person['place']) // Expected: error, Result: error.

Can someone throw some light on me to understand this? Thanks for your help in advance

Improve this question
4
  • There's no inheritance here. Just two references to the same object. Commented Apr 27, 2012 at 19:59
  • Then how can you clone the object and make a new one? I, like the OP probably, assumed that new would make a NEW object. Commented Apr 27, 2012 at 20:01
  • See: stackoverflow.com/questions/728360/… Commented Apr 27, 2012 at 20:03
  • Object.create() is the correct way ncombo.wordpress.com/2013/07/11/… Commented Jul 11, 2013 at 13:53

5 Answers 5

Reset to default
2

You are not doing extending or any kind of inheritance.

This comes closer:

var Person = function () {
    this["first-name"] = 'FirstName',
    this["last-name"] = 'LastName',
    this["gender"] = 'Male'
};

var person = new Person();
var anotherPerson = new Person();

Now you have two seperate instances of Person. If you also want anotherPerson to be a subclass ..

var Person = function () {
    this["first-name"] = 'FirstName',
    this["last-name"] = 'LastName',
    this["gender"] = 'Male'
};

var AnotherPerson = function () {
    this.desig = "Designation";
}
AnotherPerson.prototype = new Person();   // inherit from Person
AnotherPerson.prototype.constructor = AnotherPerson;  // reset constructor

var person = new Person();
var anotherPerson = new AnotherPerson();

console.log(person.desig); // undefined
console.log(anotherPerson.desig); // Designation
Improve this answer
Sign up to request clarification or add additional context in comments.

5 Comments

I had just finished writing up the same first block of code ;) +1
@Frits Thanks for your reply. I get the code you have explained. So when we do new Object(person) is it that anotherPerson is referring to the same location? I tried adding a new property to person and anotherPerson was able to read that new property successfully. Why is it so?
I'm not entirely sure what new Object(person) does .. maybe it just resolves to person? I do know that it doesn't magically extend from person :P
@FritsvanCampen Hmm very weird. I some times doubts whether I really know javascript when these kind of results are shown
I don't like the way native prototypes work in JavaScript, supposedly it has a memory leak too! Find a framework to do inheritance for you.
0

Not really a solution, but for me, this is how I clone an object in such a way that I can extend it:

var anotherPerson = new Object();
for(i in person) anotherPerson[i]=person[i];

Instead of

var anotherPerson = new Object(person);

It then works as expected.

Improve this answer

1 Comment

May I know what exactly happens when we do var anotherPerson = new Object(person)?
0

The Object function (note: the same, even more startlingly if you're not familiar with what's going on, applies to calling new Object(...)) doesn't create a new object if it's passed something that isn't of boolean, number or string type; it just returns the already existing object. (Rationale: because it's already an Object. Almost everything is an Object in Javascript.)

Therefore, anotherPerson is the exact same object as person, so when you modify it you modify person too.

I do not claim that this is sensible behaviour; but it is what the language spec defines.

Improve this answer

Comments

0

If you want to extend/inherit an object then you can do

var person = {
    'first-name': 'FirstName',
    'last-name': 'LastName',
    'gender': 'Male'
};
if (typeof Object.create !== 'function')
{
    Object.create=function(o)
    {
        function F(){}
        F.prototype=o;
        return new F();
    }
}
var newPerson=Object.create(person);
newPerson.age=25;
newPerson.gender="Female";

console.log(person.gender); // Male
console.log(newPerson.gender); // Female

console.log(person.age); // undefined
console.log(newPerson.age); // 25

Fiddle

Reference: Prototypal Inheritance in JavaScript

Improve this answer

1 Comment

The Douglas Crockford way! Perfect.
0

a general solution for inheritance implementation in JavaScript

function inherits(base, extension)
{
   for ( var property in base )
   {
      try
      {
         extension[property] = base[property];
      }
      catch( warning ){}
   }
}
Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.