What is prototypes

In JavaScript, a prototype is an object that is associated with every function and object created with a constructor function.

When a property or method is called on an object, the JavaScript engine looks for the property or method on the object itself. If it is not found, the engine looks for the property or method on the object's prototype. This allows objects to inherit properties and methods from their prototypes, which can save time and code by avoiding the need to define the same properties and methods on multiple objects.

Sounds little complicated right🧐! Let's try explain prototypes in a way that's easy to understand!

A prototype is like a blueprint or a model for creating objects. When you make a new object, you can use the prototype to make sure that the object has all the right properties and methods.

For example, let's say you want to make a bunch of toy cars. You can create a prototype for a toy car that has all the right parts, like wheels and a steering wheel. Then, when you make a new toy car, you can just copy the parts from the prototype to make sure your toy car has everything it needs. This way, you don't have to make every single toy car from scratch, which would be time-consuming and difficult.

Prototypes are a way to save time and make sure that your objects have everything they need. In JavaScript, you can use the prototype property of a function to create a prototype for your objects, and then use the new operator to make new objects based on that prototype.

Here is an example of how prototypes work in JavaScript, with some explanation:

In this code, we first define a Person constructor function that takes a name argument and assigns it to the name property of the object being constructed. This allows us to create multiple Person objects with different name properties.

Next, we add a sayHello method to the Person prototype. This method logs a greeting to the console using the name property of the object on which the method was called. Because the sayHello method is defined on the Person prototype, all Person objects will be able to inherit this method and use it.

Then, we create two new Person objects using the Person constructor function and the new operator. These objects, person1 and person2, each have their own name property, but they do not have a sayHello method defined on them directly.

However, when we call the sayHello method on each object, the JavaScript engine looks for the method on the object itself and, not finding it, looks for the method on the object's prototype, Person.prototype. The sayHello method is found on the prototype, so it is called and the greeting is logged to the console.

In this example, the Person objects were able to inherit the sayHello method from their prototype, Person.prototype, thanks to the prototype chain in JavaScript. This can save time and code by avoiding the need to define the same method on each object individually.

In short, classes are a way to create multiple instances with their own properties, while prototypes provide a way to share properties and methods across multiple objects.

I hope that helps explain prototypes in JavaScript!