Prototypal Inheritence in Javascript

Question

How to pass values to super class constructors in Javascript.

In the following code snippet

(function wrapper() {
var id = 0;

window.TestClass = TestClass;

function TestClass() {
    id++;
    this.name = 'name_' + id;
    function privateFunc() {
        console.log(name);
    }
    function publicFunc() {
        privateFunc();
    }

    this.publicFunc = publicFunc;
}

function TestString() {
    this.getName = function() {
        console.log("***" + this.name + "****************");
    }
}

TestClass.prototype = new TestString(); 
})();

How do I pass values to the TestString constructor? Currently, the super class method is using value using 'this' keyword. Is there a way to directly pass values to the super class constructor. Also, I want to see a simple example of extending String. That would demystify a lot of things.

I recommend to not use `TestClass.prototype = new TestString();` to establish inheritance: http://stackoverflow.com/q/17392857/218196 — Felix Kling, Aug 16 '13 at 10:44
It looks like you will be using "private variables", then prototypal inheritance doesn't work (nor does anything else that works on object properties) — Esailija, Aug 16 '13 at 10:49
@Esailija..can you please elaborate. A little example with help here. Thanks. — Gopal, Aug 16 '13 at 10:54
@Gopal here are multiple examples that show difference between variables and properties http://jsfiddle.net/VjZnn/ — Esailija, Aug 16 '13 at 11:04
http://stackoverflow.com/questions/16063394/prototypical-inheritance-writing-up/16063711#16063711 Maybe this is helpful how to use function constructors, prototype, inheritance and overriding functions. It doesn't have the module pattern used for privates sometimes because that'll screw up your prototype (as mentioned before). It shows how not to use new TestString to inherit and explains why you don't define functions in the constructor body (have them on the prototype) — HMR, Aug 16 '13 at 11:42

alex · Answer 1 · 2013-08-16T10:47:21.517

2

You can use the following code in the constructor of TestClass().

TestString.apply(this, arguments);

This will call the constructor with the new object as its context.

However, note that establishing the [[Prototype]] chain with TestClass.prototype = new TestString(); will have already called the constructor once.

jsFiddle.

I want to see a simple example of extending String.

You can augment its prototype property.

String.prototype.endsWidth = function(str) {
    return this.slice(-str.length) === str;
};

edited Aug 16 '13 at 10:47

answered Aug 16 '13 at 10:41

alex

479,566
201
878
984

@alex..thanks for quick response. Can you please check this fiddle http://jsfiddle.net/gCwZD/1/ I have commented out the prototype part, still, it works!! How is that possible? – Gopal Aug 16 '13 at 10:58
@Gopal: Because you didn't add anything to `TestString.prototype`, so it does not matter whether you set it or not. I recommend to read https://developer.mozilla.org/en-US/docs/Web/JavaScript/Introduction_to_Object-Oriented_JavaScript to get a better idea about what the `prototype` property actually is. – Felix Kling Aug 16 '13 at 11:16
@FelixKling..I looked at your answer here http://stackoverflow.com/questions/17392857/benefits-of-using-object-create-for-inheritance Thanks for great explanation. But, I'm not getting one thing here. Why is it mandatory that I call super class constructor. For instance can you please check this fiddle http://jsfiddle.net/AvVG2/1/ ? – Gopal Aug 16 '13 at 12:50

Prototypal Inheritence in Javascript

1 Answers1