www.webdeveloper.com
Results 1 to 7 of 7

Thread: Asking for help on simple Javascript code regarding Inheritance

  1. #1
    Join Date
    Feb 2014
    Posts
    12

    Asking for help on simple Javascript code regarding Inheritance

    Code:
    function Person(firstName, lastName) {
            var _firstName = firstName;
            var _lastName = lastName;
            
            Person.prototype.__defineGetter__("firstName", function() {
               return _firstName; 
            });
            
            Person.prototype.__defineSetter__("firstName", function(value) {
                _firstName = value;
            });
            
            Person.prototype.__defineGetter__("lastName", function() {
                return _lastName;
            });
            
            Person.prototype.__defineSetter__("lastName", function(value) {
                _lastName = value;
            });
        };
        
        var p1 = new Person("John", "Doe");
        
        console.log(p1.firstName); // Prints John
        console.log(p1.lastName); // Prints Doe
        
        function Dignitary() {
            
        };
        
        Dignitary.prototype = new Person(); // making Dignitary inherit Person
        Dignitary.constructor = Dignitary; 
        
        var d1 = new Dignitary("Jane", "Bimbo");
        console.log(d1.firstName); // THIS IS COMING OUT UNDEFINED, WHAT AM I DOING WRONG?
    Thanks in advance.

  2. #2
    Join Date
    Oct 2012
    Location
    Croatia
    Posts
    249
    This line of code effectively overwrites any previous values:

    Code:
     Dignitary.prototype = new Person(); // making Dignitary inherit Person
    any call to the Person() function will overwrite any previous values set. Adding this to the last line of the code proves it:

    Code:
    console.log(p1.firstName) // undefined
    Probably you wanted to do something like:

    Code:
          function Person()
          {
            //dummy function  
          }
          Person.prototype = {
             get firstName() {return this._firstName;},
             set firstName(x) {this._firstName = x;},
             get lastName() {return this._lastName;},
             set lastName(x) {this._lastName = x;}
          }
          
          var person = new Person;
          
          person.firstName = "Bruce";
          person.lastName = "Lee"
          console.log(person.firstName + " " + person.lastName);
          
          function Dignitary()
          {
             //dummy function
          }
          Dignitary.prototype = Person.prototype;
          
          var dignitary = new Dignitary;
          
          dignitary.firstName = "Johny";
          dignitary.lastName = "Bravo";
          console.log(dignitary.firstName + " " + dignitary.lastName);
    Note that using the __defineGetter__ and __defineSetter__ functions is deprecated.
    Last edited by tech_soul8; 03-07-2014 at 09:49 AM.

  3. #3
    Join Date
    Feb 2014
    Posts
    12
    Quote Originally Posted by tech_soul8 View Post
    This line of code effectively overwrites any previous values:

    Code:
     Dignitary.prototype = new Person(); // making Dignitary inherit Person
    any call to the Person() function will overwrite any previous values set. Adding this to the last line of the code proves it:

    Code:
    console.log(p1.firstName) // undefined
    Probably you wanted to do something like:

    Code:
          function Person()
          {
            //dummy function  
          }
          Person.prototype = {
             get firstName() {return this._firstName;},
             set firstName(x) {this._firstName = x;},
             get lastName() {return this._lastName;},
             set lastName(x) {this._lastName = x;}
          }
          
          var person = new Person;
          
          person.firstName = "Bruce";
          person.lastName = "Lee"
          console.log(person.firstName + " " + person.lastName);
          
          function Dignitary()
          {
             //dummy function
          }
          Dignitary.prototype = Person.prototype;
          
          var dignitary = new Dignitary;
          
          dignitary.firstName = "Johny";
          dignitary.lastName = "Bravo";
          console.log(dignitary.firstName + " " + dignitary.lastName);
    Note that using the __defineGetter__ and __defineSetter__ functions is deprecated.
    Thanks for responding. I have to say though your response confuses me. I was creating a constructor that passed two parameters -- firstName and lastName, but your example did away with that.

    Can you show me how your suggested solution would handle a constructor with two parameters? Thanks.

  4. #4
    Join Date
    Feb 2014
    Posts
    12
    Oh, I take it back, I was thinking of a different sample I had elsewhere.

    My question for you is that your Person.prototype definition used variables like _firstName and _lastName. Can you tell me where it would get those values? Thanks.

  5. #5
    Join Date
    Feb 2014
    Posts
    12
    I think I should not check these responses when I'm very tired, haha!

    I take back my questions, I now get what you were trying to convey in your sample. Thanks for your help!

  6. #6
    Join Date
    Oct 2012
    Location
    Croatia
    Posts
    249
    Quote Originally Posted by grendall View Post
    Oh, I take it back, I was thinking of a different sample I had elsewhere.

    My question for you is that your Person.prototype definition used variables like _firstName and _lastName. Can you tell me where it would get those values? Thanks.
    ...as I always try to explain things in details as best as I can/know, so...

    Word about inheritance. Every object created with a constructor function will inherit properties from the prototype property of the constructor function. Like I said before the __defineGetter__ and __defineSetter__ (also __lookupGetter__ and __lookupSetter___) methods are considered deprecated. New syntax for accessor properties is introduced in ECMAScript 5 and it looks like:

    get accessor property() {//function body}
    set accessor property(value) {//function body}

    You can also use Object.defineProperty(object,propName,descriptor). I recommend you read on these new methods. So, back to your question! I defined two dummy functions: Person and Dignitary. The prototype object has two getter and setter properties named firstName and lastName. Since JavaScript is a loosely typed language you can create your properties dynamically and that's what I did with the setter methods and the _firstName and _lastName properties.

    Later you are using getter methods to get the value of newly created properties.
    Last edited by tech_soul8; 03-07-2014 at 11:05 AM.

  7. #7
    Join Date
    Oct 2012
    Location
    Croatia
    Posts
    249
    Quote Originally Posted by grendall View Post
    I think I should not check these responses when I'm very tired, haha!

    I take back my questions, I now get what you were trying to convey in your sample. Thanks for your help!
    Already answered, no problem!

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles