What exactly is prototype in JavaScript _javascript skill

JavaScript is also an object-oriented language, but it is a prototype-prototype language, not a class-based language. In JavaScript, classes and objects don't look much different.

What is prototype:

function defines an object that has a prototype attribute, and the prototype attribute points to a prototype object, noting that the prototype property is two different from the prototype object, paying attention to the difference. There is another constructor attribute in the prototype object, and the constructor attribute also points to a constructor object, and this constructor object is exactly the function itself. Isn't it very round? The following is represented in pseudocode:

var function{
prototype:prototype{
constructor:constructor = = function
}
}

Don't you get it? Look at the picture:

The role of prototype:

What's the effect of this prototype? Look at the following example:

function jb51 () {
}
jb51.prototype.name = "a";
var test = new jb51 ();
Alert (Test.name)//"a";

Strangely, there is no Name attribute set for test, but why is there a value?

That's the credit of prototype. The name object in the prototype attribute in UW3C is inherited into the properties of the object Test after UW3C by the new constructor. Next look:

var name = "JS";
function jb51 (name) {
alert (this.name);//"CSS"
}
jb51.prototype.name = "css";
var test = new jb51 ();
Test ()

Why is alert's value not "JS"? This process is generally as follows:

var test={};
Uw3c.call (test);

The first step is to create a new object (test).

The second step is to set the prototype object built into the object (test) as the prototype object referenced by the constructor (that is, the UW3C) prototype property.

The third step is to invoke the object (test) as the This parameter to call the constructor (that is, UW3C) and complete the initialization of the member settings.

The second step in the emergence of a term is a built-in prototype object, note that this word is not the same as the prototype object, in order to distinguish I call it inobj,inobj point to the function uw3c prototype object. Any properties or functions that appear in the UW3C prototype object can be used directly in the test object, and this is the prototype in JS inherits.

Typically, this creates an object:

function person (name) {
This.sayhi = function () {
alert (' Hi ' + this.name);
}
this.name = name;
var p = new Person ("Dan");

Above, use the New keyword to create an object instance from an object (a function is also a special object).

In a class-based language, a property or field is usually defined beforehand in a class, but in JavaScript, you can add fields to the class after you create the object.

function animal () {}
var cat = new Animal ();

Above, color This field only belongs to the current cat instance.
What if you want to have all the instances of animal in the fields that you add?

--Use prototype
function animal () {}
animal.prototype.color= "green";
var cat = new Animal ();
var dog = new Animal ();
Console.log (Cat.color);//green

Not only can you add fields through prototype, you can add methods as well.

function animal () {}
animal.prototype.color= "green";
var cat = new Animal ();
var dog = new Animal ();
Console.log (Cat.color);//green
Console.log (dog.color);//green animal.prototype.run
= Funciton () {
Console.log ("Run");
}

By prototype property, you can change the behavior of an object after you create it.
For example, you can add a method to this particular object of the array.

Array.prototype.remove = function (elem) {
var index = this.indexof (elem);
if (index >= 0) {
this.splice (index, 1);
}
}
var arr = [1, 2, 3];

In addition to defining properties or methods for an object by prototype, you can also define the properties or methods of the class by using the object's constructor.

function animal () {
This.color = "green";
This.run = function () {
console.log ("Run");
}
}
var mouse = new animal ();

The above approach also allows all animal instances to share all the fields and methods. There is also a benefit that you can use the local variables of the class in the constructor.

function animal () {
var runalready = false;
This.color = "green";
This.run = Funciton () {
if (!runalreadh) {
Console.log ("Start Running");
} else {
console.log (" Already running ")
}
}

In fact, a more practical approach is to define the fields and behavior of a class by combining the constructor with the prototype.

function animal () {
var runalready = false;
This.run = function () {
if (!runalready) {
console.log (' I am running ');
} else {
console.log ("I am Already running ");
}}} Animal.prototype.color = ';
Animal.prototype.hide = Funciton () {
console.log ("");
}
var horse = new Animal ();
Horse.run ();

Prototype allows us to alter the behavior of an object or class after the object is created, and all object instances of the fields or methods that are added through the prototype property are shared.