Class and instance implementation in JavaScript _ javascript skills

This article mainly introduces the implementation methods of classes and instances in JavaScript. it cleverly simulates the implementation process of classes and instances and has some reference value, for more information about the classes and implementation methods in JavaScript, see the examples in this article. Share it with you for your reference. The details are as follows:

JavaScript does not have a parent class, a subclass, or a class or instance. prototype chain is used to implement inheritance. when you look for an object's properties, JavaScript will traverse the prototype chain up until the corresponding properties are found. there are several methods that allow JavaScript to simulate the concepts of class and instance.

1. Use the constructor directly to create an object. In the constructor, use this to refer to the object instance.

The Code is as follows:

Function Animal (){
This. name = "animal ";
}
Animal. prototype. makeSound = function (){
Console. log ("animal sound ");
}
[Function]
Var animal1 = new Animal ();
Animal1.name;
'Animal'
Animal1.makeSound ();
Animal sound

Let's look at another example:

The Code is as follows:

Function Point (x, y ){
This. x = x;
This. y = y;
}
Point. prototype = {
Method1: function () {console. log ("method1 ");},
Method2: function () {console. log ("method2 ");},
}
{Method1: [Function], method2: [Function]}
Var point1 = new Point (10, 20 );
Point1.method1 ();
Method1
Point1.method2 ();
Method2

In the preceding example, specify the prototype attribute of the constructor object. Then, a new object instance is created to call the method specified in prototype.

2. Use the Object. create () method to create an Object

The Code is as follows:

Var Animal = {
Name: "animal ",
MakeSound: function () {console. log ("animal sound ");},
}
Var Animal = Object. create (Animal );
Animal2.name;
'Animal'
Console. log (animal2.name );
Animal
Animal2.makeSound ();
Animal sound

This method is easier than the constructor method, but it cannot implement private attributes and private methods, and data cannot be shared between instance objects, and the simulation of class is still not comprehensive.

3. minimalist approach proposed by Dutch programmer Gabor de Mooij. Recommended usage.

The Code is as follows:

Var Animal = {
Init: function (){
Var animal = {};
Animal. name = "animal ";
Animal. makeSound = function () {console. log ("animal sound ");};
Return animal;
}
};
Var anim_3 = Animal. init ();
Animal3.name;
'Animal'
Animal3.makeSound ();
Animal sound

Without prototype and this, you only need to customize a constructor init. Inheritance implementation is also very simple.

The Code is as follows:

Var Cat = {
Init: function (){
Var cat = Animal. init ();
Cat. name2 = "cat ";
Cat. makeSound = function () {console. log ("cat sound ");};
Cat. sleep = function () {console. log ("cat sleep ");};
Return cat;
}
}
Var cat = Cat. init ();
Cat. name; // 'animal'
Cat. name2; // 'cat'
Cat. makeSound (); // method-like overload
Cat sound
Cat. sleep ();
Cat sleep

Use of private attributes and private methods:

The Code is as follows:

Var Animal = {
Init: function (){
Var animal = {};
Var sound = "private animal sound"; // private Property
Animal. makeSound = function () {console. log (sound );};
Return animal;
}
};
Var animal4 = Animal. init ();
Animal. sound; // undefined private attribute can only be read through the object's own method.
Animal. sound; // undefined private attribute can only be read through the object's own Method
Animal4.makeSound ();
Private animal sound

As long as the attributes and methods defined on an animal object are private, they cannot be accessed by the outside world.
Data can be shared between classes and instances.

The Code is as follows:

Var Animal = {
Sound: "common animal sound ",
Init: function (){
Var animal = {};
Animal. commonSound = function () {console. log (Animal. sound );};
Animal. changeSound = function () {Animal. sound = "common animal sound changed ";};
Return animal;
}
}
Var animal5 = Animal. init ();
Var animal6 = Animal. init ();
Animal. sound; // class attribute
'Common animal sound'
Animal5.sound; // The instance object cannot be a category property.
Undefined
Animal6.sound;
Undefined
Animal5.commonSound ();
Common animal sound
Animal6.commonSound ();
Common animal sound
Animal5.changeSound (); // modify class attributes
Undefined
Animal. sound;
'Common animal sound'
Animal5.commonSound ();
Common animal sound
Animal6.commonSound ();
Common animal sound

For example, Animal. sound is a common attribute of a class and an instance. It can be regarded as a Class Attribute and a class method.
If an instance modifies this common attribute, the common attribute of this class and other instances is also modified.
In summary, it is the concept and usage of the class and instance simulated in JavaScript.

I hope this article will help you design javascript programs.