Skip to content Skip to sidebar Skip to footer

Javascript Constructor Is Not Executed?

I'm attempting to implement an example I found on JavaScript inheritance, and the child object does not seem to be constructing as expected. In the example below, creating the jill

Solution 1:

In you case var Jill acts like a regular function, not like constructor. Change your code as shown below:

varJill = (function () {
    functionJill() {
        Person.call(this);
        this.name = "Jill";
    };
    Jill.prototype = Object.create(Person.prototype);
    Jill.prototype.constructor = Jill;
    Jill.prototype.expressJoy = function () {
        console.log("Huray!");
    };
    returnJill;
})();

var jill = newJill();
console.log(jill);   // Jill {name: "Jill"}console.log(jill instanceofJill); // true
jill.expressJoy(); // Huray!
jill.sayName();    // My name is Jill

Now Jill is a "real" constructor that will generate objects as you expected. (BTW, A constructor name should start with an uppercase letter, according to good practice)

Solution 2:

You are wrongly initiating the object,

var jill = Jill();
var obj = new jill();

The function Jill is returning a function reference not an object. And on top of that, returning function reference we have to create the object for your requirement.

Solution 3:

This is the corrected code, will edit with detailed explanation:

JSBIN Example

// This is your Person class, all "people" will inherit from this objectvarPerson = function() {
  this.name = "unnamed";
};
// add the sayName function to this prototypePerson.prototype.sayName = function() {
  console.log("My name is " + this.name);
};

// now we make a 'Jill' constructor;varJill = function() {
  Person.call(this); // bind this (Jill) to Personthis.name = 'jill';
};

// create the correct prototype delegation hereJill.prototype = Object.create(Person.prototype);

// the above code, sets  Jill's constructor, to Person so we need to set // it back to Jill here:Jill.prototype.constructor = Jill;

// add functions on Jill's prototype, these will only be on the Jill object not PersonJill.prototype.expressJoy = function() {
    console.log("Huray!");
  };

// make a 'Jill'var obj = newJill();
console.log(obj instanceofJill); // true
obj.expressJoy(); // "Huray!"
obj.sayName(); // "My name is jill"

Now more importantly you are mixing two types of instantiation patterns, prototypal and pseudoclassical, Person is the latter, while Jill is the former.

Take a look at this awesome picture from the following blogpost by Ryan Atkinson:

Blog Post

instantiation Patterns

Solution 4:

With your code you need to:

1) return new jill(); in the inner function, and then

2) var jill = Jill(); to call the function that creates the new instance.

DEMO

This is a less-complicated method.

functionPerson() {
  this.name = "unnamed";
}

Person.prototype.sayName = function() {
  console.log("My name is " + this.name);
}

functionJill() {
  Person.call(this);
  this.name = "Jill";
}
Jill.prototype = Object.create(Person.prototype);
Jill.prototype.constructor = Jill;
Jill.prototype.expressJoy = function() {
  console.log("Huray!");
};

var jill = newJill();

DEMO

Solution 5:

This should work

functionPerson() {
  this.name = "unnamed";
};
Person.prototype.sayName = function() {
  console.log("My name is " + this.name);
};

functionJill() {
    Jill.prototype.__proto__ = Person.prototype;

    this.name = "Jill";

    Jill.prototype.expressJoy = function() {
        console.log("Huray!");
    };

    returnJill;
};

var jill = newJill();
console.log(jill instanceofJill); // True
jill.expressJoy(); // Hurray !
jill.sayName(); // My name is Jill

Post a Comment for "Javascript Constructor Is Not Executed?"