Free Online Courses for Software Developers - MrBool
× Please, log in to give us a feedback. Click here to login
×

You must be logged to download. Click here to login

×

MrBool is totally free and you can help us to help the Developers Community around the world

Yes, I'd like to help the MrBool and the Developers Community before download

No, I'd like to download without make the donation

×

MrBool is totally free and you can help us to help the Developers Community around the world

Yes, I'd like to help the MrBool and the Developers Community before download

No, I'd like to download without make the donation

How Prototype assists in Object tracking using JavaScript

This article will cover today the basics on the usage of prototype and also the properties of constructor which will help in tracking an object to the base of the object.

One of the key aspects of OOP or Object Oriented Programming is known by inheritance, on the other hand extending the existing class creates a new class. Let us see the main objective of the process, called sub classing. It helps in creating progressively more specialized classes by building on existing ones. A prototype is one of the best techniques for the JavaScript to implement its own hierarchy model.

How to refer Object's Parent

There is always a route to fetch a class’s parent in all the object-oriented languages and talking in particularly about Java, it is done through the super pointer. The below codes illustrates the process so that the Learner subclass can call the People constructor directly so as to set its inherited name property:

public class People
{
  private String name;

  public People(String initialName)
  {
    name = initialName;
  }
}

public class Learner extends People
{
  private int learnerNumber;

	//we can call the parent's constructor via the "super" pointer
  public Learner(String initialName, int initiallearnerNumber)
  {
    super(initialName);
    learnerNumber = initiallearnerNumber;
  }
}

If the People had a setter() for name, we could call it instead making use of: super.setName(initialName);

Introduction to Object Constructor Function

Talking about the super pointer, this is not just restricted to class's immediate parent. It can be utilized to track the object chain from the lowest level subclass that goes up to the Object super class. Also there is a mode in JavaScript that offers to follow the ancestry of an object up to the Object. However, here instead of the super, it is the object constructor that holds the reference to the parent. A very vital role is played by the constructor in object creation in that it is the function by which the object is created. The reason for all the objects having a constructor function is that ALL objects are functions in JavaScript. Even {}.constructor returns a function!

By this, we mean that, there is a unique "object" type in JavaScript. To distinguish between the two of them, we can make use of typeof() function as can be seen from the below code:

alert(typeof( function() {}));      //displays "function"
alert(typeof( new function() {}));  //displays "object"

The main difference between them is the inclusion of the "new" keyword which is used to create an object. Like above, typeof((new function() {}).constructor) is also used to give back the default Object constructor function

By making use of prototypal inheritance, it is possible for the objects to inherit from other objects. But the thing to note here is that we don’t have any specific keyword or operator like we have "extends" in Java - to achieve that end. When you instantiate an object making use of the "new" keyword, "new myObject()" generates a new object that is inherited from myObject.prototype instead of doing it directly from the object itself.

With the help of following the inheritance chain, we can keep track of the parent within the child object. The below example illustrates how the parent's constructor function is stored:

function People(name) {
  if ( arguments.length > 0 )
    this.init(name);
}

People.prototype.init = function(name) {
    this.name = name;
}

Employee.prototype = new People();
Employee.prototype.constructor = Employee;
Employee.constructor = People.prototype.constructor;

function Employee(name, id) {
    if ( arguments.length > 0 ) {
        this.init(name);
        this.id = id;
    }
}

Manager.prototype = new Employee;
Manager.prototype.constructor = Manager;
Manager.constructor = Employee.prototype.constructor;

function Manager(name, id, department) {
    if ( arguments.length > 0 ) {
        this.init(name);
        this.department = department;
    }
}

What is the Effect of Object Creation Methods on Debugging?

Every time a new object is instantiated without an explicit constructor, the default will be used by the JavaScript interpreter that holds true of the base Object constructor. We cannot figure out actually the constructor's owner for the reason that it doesn't contain the object name which is this case is "Object".

document.writeln(Object.constructor.toString());
//outputs "Function() { [native code] }"

Hence, the below code reflects the naming of any function that may probably be called more than once:

//avoid this if possible!
var myFunc = function() {
  alert('Hello from the ' + arguments.callee.functionName() + '() function!');
	//outputs "Hello from the Anonymous () function!". Not much help!
};

//while redundant, the following is perfectly legal
var myFunc = function myFunc() {
  alert('Hello from the ' + arguments.callee.functionName() + '() function!');
	//outputs "Hello from the myFunc() function!"
}

Any “function” type can make use of this functionName() utility method so as to parse the name from the function code as shown below:

Function.prototype.functionName = function()
{
  var name=/\W*function\s+([\w\$]+)\(/.exec(this);
  if(!name) return 'Anonymous';
  return name[1];
}
alert(myFunc.functionName());  //outputs myFunc"
}

Use of functionName() Function method

is to follow an object chain with the help of each object's function constructor property.

getInheritanceChain() Object method

Follows the prototype chain all the way to the base Object by looking for the overridden Object.constructor.toString()'s return value of "Object".

When we exit from the loop, the next step is to push the "Object" string onto the inheritance Chain array as shown in the below code:

Object.constructor.toString = function() { return "Object"; }
Object.prototype.getInheritanceChain = function() {
	var parent = this.constructor;
	var inheritanceChain = new Array();
	
	while ( parent != 'Object' ) {
		inheritanceChain.push( parent.functionName() );
		parent = parent.constructor;
	}
	inheritanceChain.push( parent ); //this is the Object superclass
	
	return inheritanceChain.join(", ");
}

var manager = new Manager("SteveJohnson", 1234, "finance");
document.writeln('I am '+manager.name+', a '+Manager.functionName()+', and I extend '+Manager.getInheritanceChain());
//outputs "I am Steve Johnson, a Manager, and I extend Employee, People, Object"

Conclusion

Here we come to an end of this article and learned on the prototype and constructor uses to track an object ancestry to the base of the Object.



I am a software developer from India with hands on experience on java, html for over 5 years.

What did you think of this post?
Services
[Close]
To have full access to this post (or download the associated files) you must have MrBool Credits.

  See the prices for this post in Mr.Bool Credits System below:

Individually – in this case the price for this post is US$ 0,00 (Buy it now)
in this case you will buy only this video by paying the full price with no discount.

Package of 10 credits - in this case the price for this post is US$ 0,00
This subscription is ideal if you want to download few videos. In this plan you will receive a discount of 50% in each video. Subscribe for this package!

Package of 50 credits – in this case the price for this post is US$ 0,00
This subscription is ideal if you want to download several videos. In this plan you will receive a discount of 83% in each video. Subscribe for this package!


> More info about MrBool Credits
[Close]
You must be logged to download.

Click here to login