Javascript prototypes and inheritance (Prototypes and Inheritance)_javascript skills

JavaScript objects inherit properties from a prototype object. All objects have prototypes; all properties of a prototype look like properties of the objects that use it as a prototype. Simply put: All objects inherit properties from their prototype.
(each object inherits properties from its prototype).

The prototype of an object is defined by its constructor function. All functions in JavaScript have a prototype property. This property starts out empty, and any properties you add to it will be owned by the object created by the constructor.

The prototype object is associated with the constructor. This means that the prototype can be an ideal place to place methods as well as other constants. Properties in the prototype are not copied to the newly created object; their properties look just like the object's properties. This means that using prototypes can significantly reduce the memory occupied by multiple objects of the same type.

Each class has only one prototype object, with a set of properties. But we may create multiple instances of the class at runtime. So what happens if a read or write to a prototype's property occurs?
When you read an attribute, JavaScript first tries to find out whether the object itself has this attribute. If not, then it searches to see if it exists in the prototype. If so, the result is returned.
When you write the attributes of the prototype, because multiple objects share the prototype, obviously you cannot write directly on the prototype. At this time, JavaScript will actually create a property with the same name on the object and then write the value into it. The next time you read this property, JavaScript will immediately find it in the object's properties, so there is no need to look in the prototype. At this time, we say that "the properties of the object mask or hide the properties of the prototype."(shadows or hides).

As can be seen from the above discussion, in fact, when we design classes, we only need to master one principle: Only define some methods in the prototype (methods generally do not change), constants, constants, etc. This will make it less confusing.
例子：

// Define a constructor method for our class.
// Use it to initialize properties that will be different for
// each individual Circle object.
functionCircle(x, y, r)
{
    this.x = x;  // The X-coordinate of the center of the circle

this.y = y;  // The Y-coordinate of the center of the circle

this.r = r;  // The radius of the circle
}


// Create and discard an initial Circle object.
// This forces the prototype object to be created in JavaScript 1.1.
new Circle(0,0,0);


// Define a constant: a property that will be shared by
// all circle objects. Actually, we could just use Math.PI,
// but we do it this way for the sake of instruction.
Circle.prototype.pi =
3.14159;


// Define a method to compute the circumference of the circle.
// First declare a function, then assign it to a prototype property.
// Note the use of the constant defined above.
function Circle_circumference(  ) { return
2
*
this.pi *
this.r; }
Circle.prototype.circumference =Circle_circumference;


// Define another method. This time we use a function literal to define
// the function and assign it to a prototype property all in one step.
Circle.prototype.area =
function(  ) { return
this.pi *
this.r *
this.r; }


// The Circle class is defined.
// Now we can create an instance and invoke its methods.
var c =
new Circle(0.0, 0.0, 1.0);
var a =c.area( );
var p = c .circumference( );


Prototype of built-in classes.

Not only user-defined classes can have prototypes. System built-in classes such as String and Date can also have prototypes. some. And you can add new methods, properties, etc. to them.
다음 코드는 모든 String 객체에 유용한 함수를 추가합니다.

// 다음과 같은 경우 true를 반환합니다. 마지막 문자는 c
String.prototype.endsWith =입니다.
기능(c) {
 반환 (c ==
this.charAt(this.length-1))
}


그러면 다음과 같이 호출할 수 있습니다.

var message =
"안녕하세요";
message.endsWith('h') // false 반환
message.endsWith('d') // true를 반환합니다