# What is Prototype in Javascript ?

## Introduction
We javascript developers have come across this Javascript buzzword ***Prototype*** while preparing for interview or sneaking into the codes of npm modules. 
So, In this blog I will try my best to unfold the hidden mystery of ***Prototype***.

### Prototype
Javascript is prototype based language. Every functions and objects has a hidden property called  ***Prototype***. With this we can add property to a function and object.The prototype object is special type of enumerable object to which additional properties can be attached to it which will be shared across all the instances(objects) of it's constructor function.
> Before object-oriented feature added to javascript, **prototype** was used for inheritance.

Let's understand it by an example
Suppose we have an function called ```Person```

```js
function Person() {
 this.name = "Sanjit";
 this.gender = "Male";
}

const person1 = new Person();
person1.age = 23;
console.log(person1.age);  //23

const person2 = new Person();
console.log(person2.age); //undefined
```

As it is known from the above example that after attaching and initializing the age property we are getting output as ```
23
``` but after creating a new instance of the constructor function ```
Person
```, we are getting ```
undefined 
``` as the property doesn't get shared across the instances(objects) of the constructor function.
So, To fix this issue ***Prototype*** comes into play.


Now we will convert the above example with ***Prototype***.

```js
function Person() {
 this.name = "Sanjit";
 this.gender = "Male";
}
Person.prototype.age = 23;
const person1 = new Person();
console.log(person1.age);  //23

const person2 = new Person();
console.log(person2.age); //23
```
### Difference between *prototype* and *______proto______*
But there is a catch that we have to attach and initialize the age property in the Function
itself. 
Like every Function's
property can be accessed and initialized by
**function-name.prototype**
but
for instances(objects) of 
Function
e can use  
**object-name.______proto____**

Let's understand by an example.

```js
function Person() {
    this.name = 'Sanjit';
    this.gender = 'Male';
}

const person1 = new Student();

console.log(Person.prototype); // object
console.log(person1.prototype); // undefined
console.log(person1.__proto__); // object

console.log(typeof Student.prototype); // object
console.log(typeof Person.__proto__); // object

console.log(Person.prototype === person1.__proto__ ); // true
```
### Prototype for adding method

Prototype can also be used for adding methods to a constructor function or object.
Suppose we want to add a method to check whether the person is an adult or not.

Let's understand by an example.

```js
function Person() {
    this.name = 'Sanjit';
    this.age = 18;
}

Person.prototype.isAdult = function(){
 if(this.age>=18)
  return "You are an adult"
  return "Your are not an adult"
}
const person1 = new Student();

console.log(person1.isAdult()) //You are an adult
```

With the help of ***prototype inheritance***, we can add methods and properties to Standard javascript object like **Array, Object, String, Numbe**r etc.
### Conclusion

In this article we learnt about the ins and out of prototype and it's implementation.
Following things to be taken care of while using prototype - 
> - Only modify your own prototypes. Never modify the prototypes of standard JavaScript objects.
> - Use it only when it is needed.

Thank you for Reading...
### References:
- [https://www.w3schools.com/js/js_object_prototypes.asp](https://www.w3schools.com/js/js_object_prototypes.asp)
- [https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/includes](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/includes)