Open In App

Difference between proto and prototype

Last Updated : 03 Jan, 2023
Improve
Improve
Like Article
Like
Save
Share
Report

In this article, we will be going to cover the topic what is proto and prototypes, their syntax, examples, and what are differences exist between both, and how they differ and how they differ in different aspects. 

Proto and prototype both are objects that help in whether creating an array, object, or function and provide access to those specific methods or objects directly without taking memory and even it will give access to its constructor and all the array methods like push, pop, etc.

Proto: It is an actual object that provides a way to inherit properties from JavaScript with the help of an object which is created with new. Every object with behavior associated has internal property [[prototype]].

Syntax: 

Object.__proto__ = value

Example:

Javascript




function Student(name,age) {
 this.name = name;
 this.age = age;
}
var stu1 = new Student("John", 50);
 
// Object have proto property
stu1
 
// Also if apply strict equal to check
// if both point at the same
// location then it will return true.
Student.prototype === stu1._proto_


Output:

object have proto property

object and function refer to the same prototype

Prototype: It is a special object which means it holds shared attributes and behaviors of instances. It is a way to inherit properties from javascript as it is available in every function declaration.

Syntax:

objectTypeName.prototype.SharedPropertyName=value;

Example:

Javascript




// Constructor function
function Student(name, age) {
    this.name = name;
    this.age = age;
}
 
// Objects
var stu1 = new Student("gfg1", 25);
var stu2 = new Student("gfg2", 42);
 
// Prototype
Student.prototype.getName = function() { return this.name; }
 
 
// Function have property prototype
// Student
 
// Function call using object
stu1.getName();
 
// Constructor function
function Student(name, age) {
    this.name = name;
    this.age = age;
}
 
// Objects
var stu1 = new Student("gfg1", 25);
var stu2 = new Student("gfg2", 42);
 
// Prototype
Student.prototype.getName = function() { return this.name; }
 
 
// Function have property prototype
// Student
 
// function call using object
stu1.getName();
 
// Access prototype
Student.prototype


Output:

function have property prototype

function call using object

access prototype property

Difference between proto and prototype:

Prototype

proto

Prototypes is a simple way to share behavior and data between multiple objects access using .prototype proto is also a way to share behavior and data between multiple objects access using __proto__
All the object constructors (function) have prototype properties. All the objects have proto property.

The prototype gives access to the prototype of function using function.

Syntax: (function.prototype)

proto gives access to the prototype of the function using the object.

Syntax: (object.__proto__)

It is mostly used to resolve issues of memory wastage when creating an object in constructor mode then each object has separate behavior. It is used in the lookup chain to resolve methods, constructors, etc.
It is the property of the class. It is the property of the instance of that class.
The prototype property is set to function when it is declared. All the functions have a prototype property. proto property that is set to an object when it is created using a new keyword. All objects behavior newly created have proto properties.
It is introduced in EcmaScript 6. It is introduced in ECMAScript 5.
It is also called it as .prototype It is also called dunder proto.
It is mostly used in javaScript. It is rarely used in JavaScript.


Like Article
Suggest improvement
Share your thoughts in the comments

Similar Reads