How to inherit properties from parent object in JavaScript

Question

0.00/5 (No votes)

See more:

I am trying to create some objects and wrapper classes to simplify some form checking methods. I have researched the standard routine for JavaScript inheritance but I am getting a rather odd error when running my code. Here is the gist:

JavaScript

function FooParent (a){
    this.prop = a;
    this.val = a.value;//*
}
var elem = new FooParent(document.getElementById("someDomElement");
alert(elem.val);
//alerts the value of the form element no prob!

If I then add this block to the same code:

JavaScript

function FooKid (a, b) {
    FooParent.call(this, b);
    this.kidProp = b;
}
FooKid.prototype = new FooParent();
FooKid.prototype.constructor = FooKid;
var elem2 = new FooKid(document.getElementById("someDomElement");
alert(elem2.val);
//the variable declaration in the last two lines is inconsequential, the code breaks on line 3 when I run it after adding the last block.

The error that firebug gives me is that in the parent object this.val = a.value; is now undefined when it worked prior to trying to inherit from it. I also tried... this.val = this.prop.value, and this.val = prop.value (all should point to the same thing So in conclusion, my question is: why is this code breaking? Where is the bug?

Posted 14-Dec-12 23:30pm

JonC04

Add a Solution

Comments

Mohibur Rashid 15-Dec-12 7:13am

You have to coding error
on line 6 of first part of code
on line 6 of second part of code

FooParent only receive one parameter but you are calling it with two parameter

and so on....

2 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Jamal Seyedi · Answer 1 · 2012-12-19T00:37:00

Solution 1

inheritance in javascript:

JavaScript

if (typeof Object.create !== 'function') {
	Object.create = function (o) {
		function F() { }
		F.prototype = o;
		return new F();
	};
}

var newObject1 = Object.create({key1:'valuekke'});
var newObject2 = Object.create(newObject1);

Posted 19-Dec-12 0:37am

Jamal Seyedi

parths · Answer 2 · 2012-12-19T20:36:00

Solution 2

In you code FooParent expects a param 'a'
In your line...

JavaScript

new FooParent();

...you haven't provided this param.

Posted 19-Dec-12 20:36pm

parths