/    Sign up×
Community /Pin to ProfileBookmark

Asking for help on simple Javascript code regarding Inheritance

Copy linkTweet thisAlerts:
Mar 07.2014

[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?[/code]

Thanks in advance.

to post a comment
JavaScript

6 Comments(s) ↴

Copy linkTweet thisAlerts:
@tech_soul8Mar 07.2014 — This line of code effectively overwrites any previous values:

<i>
</i> Dignitary.prototype = new Person(); // making Dignitary inherit Person


any call to the [i]Person()[/i] function will overwrite any previous values set. Adding this to the last line of the code proves it:

<i>
</i>console.log(p1.firstName) // undefined


Probably you wanted to do something like:

<i>
</i> function Person()
{
//dummy function <br/>
}
Person.prototype = {
get firstName() {return this._firstName;},
set firstName(x) {this._firstName = x;},
get lastName() {return this._lastName;},
set lastName(x) {this._lastName = x;}
}

<i> </i> var person = new Person;

<i> </i> person.firstName = "Bruce";
<i> </i> person.lastName = "Lee"
<i> </i> console.log(person.firstName + " " + person.lastName);

<i> </i> function Dignitary()
<i> </i> {
<i> </i> //dummy function
<i> </i> }
<i> </i> Dignitary.prototype = Person.prototype;

<i> </i> var dignitary = new Dignitary;

<i> </i> dignitary.firstName = "Johny";
<i> </i> dignitary.lastName = "Bravo";
<i> </i> console.log(dignitary.firstName + " " + dignitary.lastName);


Note that using the [I]__defineGetter__[/I] and [I]__defineSetter__[/I] functions is deprecated.
Copy linkTweet thisAlerts:
@grendallauthorMar 07.2014 — This line of code effectively overwrites any previous values:

<i>
</i> Dignitary.prototype = new Person(); // making Dignitary inherit Person


any call to the [i]Person()[/i] function will overwrite any previous values set. Adding this to the last line of the code proves it:

<i>
</i>console.log(p1.firstName) // undefined


Probably you wanted to do something like:

<i>
</i> function Person()
{
//dummy function <br/>
}
Person.prototype = {
get firstName() {return this._firstName;},
set firstName(x) {this._firstName = x;},
get lastName() {return this._lastName;},
set lastName(x) {this._lastName = x;}
}

<i> </i> var person = new Person;

<i> </i> person.firstName = "Bruce";
<i> </i> person.lastName = "Lee"
<i> </i> console.log(person.firstName + " " + person.lastName);

<i> </i> function Dignitary()
<i> </i> {
<i> </i> //dummy function
<i> </i> }
<i> </i> Dignitary.prototype = Person.prototype;

<i> </i> var dignitary = new Dignitary;

<i> </i> dignitary.firstName = "Johny";
<i> </i> dignitary.lastName = "Bravo";
<i> </i> console.log(dignitary.firstName + " " + dignitary.lastName);


Note that using the [I]__defineGetter__[/I] and [I]__defineSetter__[/I] functions is deprecated.[/QUOTE]

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.
Copy linkTweet thisAlerts:
@grendallauthorMar 07.2014 — 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.
Copy linkTweet thisAlerts:
@grendallauthorMar 07.2014 — 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!
Copy linkTweet thisAlerts:
@tech_soul8Mar 07.2014 — 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.[/QUOTE]

...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 [I]__defineGetter__[/I] and [i]__defineSetter__[/i] (also __lookupGetter__ and __lookupSetter___) methods are considered deprecated. New syntax for accessor properties is introduced in [I]ECMAScript 5[/I] and it looks like:

get [I]accessor property[/I]() {//function body}

set [I]accessor property[/I](value) {//function body}



You can also use [I]Object.defineProperty(object,propName,descriptor)[/I]. I recommend you read on these new methods. So, back to your question! I defined two dummy functions: [I]Person[/I] and [I]Dignitary[/I]. The prototype object has two getter and setter properties named [I]firstName[/I] and [I]lastName[/I]. 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 [I]_firstName[/I] and [I]_lastName[/I] properties.



Later you are using getter methods to get the value of newly created properties.
Copy linkTweet thisAlerts:
@tech_soul8Mar 07.2014 — 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![/QUOTE]

Already answered, no problem! ?
×

Success!

Help @grendall spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...