Prototype in Javascript

In this article we are going to discuss about prototypes in javascript. Before you read this article you need to a little knowledge about javascript with object and this. And in this article, I will explain about meaning of Prototype that is complex meaning and sometime it is difficult to understand.

What is protoype ?

If one developer ask you about this question: "What is Prototype ?" Please anwser question as below: "It is the father". With anwser this question it looks like rude. But we take this anwser to think again and again you will know that this anwser is 100% right. Because ever you talk about prototype. you need to talk about Father of the object. IT is the Father of the object in javascript.

In javascript, exception null and undefined, is not Object. Other things is Object includes string, boolean, number is object type as String, Number, Boolean. array is object type as Array. function is object type as Function. So prototype of each object is parent of that object.

Examples:

• prototype of string is String.prototype
• prototype of number is Number.prototype
• prototype of array is Array.prototype.

In JavaScript, the inheritance is implemented through the prototype. When we call the property or function of an object, JavaScript will look inside the object itself, if not, then look up its parent. Therefore, we can call the toUpperCase, trim function in String because they already exist in String.prototype.

When we add a function to the prototype, all of its children also learn the same function.

var str = 'abc'; 
String.prototype.duplicate = function() { return this + this; }
console.log(str.duplicate());

Arrays, numbers or strings have parent objects, so they all have functions like constructors, hasOwnProperty, toString belonging to Object.prototype.

If we already know we have 2 ways to create object in javascript. We can use literal and Constructor Function

• If we use Literal to create object, so we will create prototype of object is Object.prototype.
• If we use constructor Function to create object, so we will create the new prototype that inheritance is implemented Object.prototype.

var person = {
	firstName:: ‘Dam’,
	lastName: ‘SamNang’,
	showName: function() {
		console.log(this.firstName + ' ' + this.lastName);
	}
}: // Object has prototype is Object.prototype

function Person(firstName, lastName) {
	this.firstName = firstName;
	this.lastName = lastName;
	this.showName = function() {
		console.log(this.firstName + ' ' + this.lastName);
	};
}

var otherPerson = new Person(‘Dam’, ‘SamNul’);  // Object has prototype is Person.prototype
// New prototype: Person.prototype 
// Person.prototype is inheritance Object.prototype

Objects created by calling new Person () have the prototype Person.prototype. If you want to add a field or a function to these objects, just add one to the prototype. Understand the prototype also has some parts similar to class, each sida more.

function Person(firstName, lastName) {
  this.firstName = firstName;
  this.lastName = lastName;
}

Person.prototype.love = function() { console.log('XXX') };

var otherPerson = new Person('Dam', 'SamNang');
//object has prototype is Person.prototype
otherPerson.love(); // XXX

Why we need to use prototype ?

Why is this concept of prototype born? Please tell us, it is due to the JavaScript sida (I said that the more you learn it, the more sida). In JavaScript there is no class definition, so to inherit the fields / functions of an object we must use the prototype.

function Person() {
  this.firstName = 'Per';
  this.lastName = 'son';
  this.sayName = function() { return firstName + ' ' + lastName };
}
// write the Constructor with other function
function SuperMan(firstName, lastName) {
  this.firstName = firstName;
  this.lastName = lastName;
}
// We want to SuperMan function inheritan  attribute of Person
// So we will use prototype to do that
SuperMan.prototype = new Person();

var sm = new SuperMan(‘Dam’, ‘Samnang’); 
sm.sayName();  
// Dam SamNang, function sayName() is inheritance from prototype of Person

The prototype is somewhat like a class, used to implement interruptions in JavaScript. Write here suddenly dizzy dizziness, today's post ends soon offline. In the following article, I will talk about OOP in JavaScript, then you will recognize how JavaSscript sida.

Conclusion

With this article, it have explain about prototype in the easy way to understand. We hope that you can implement this article to your project or solution with your problem.

Document

• Javascript Prototype
• Inheritance and the protoype chain