Methods of class and instance implementation in JavaScript _javascript techniques

This article illustrates the class and instance implementation methods in JavaScript. Share to everyone for your reference. Specifically as follows:

JavaScript does not have a parent class, the concept of subclasses, there is no class and instance concept, rely on prototype chain to achieve inheritance. When you look up an object's properties, JavaScript traverses the prototype chain up until you find the corresponding property. There are several ways to enable JavaScript to simulate the concepts of class and instance.

1. Use the constructor directly to create the object and use this to refer to the object instance inside the constructor.

Copy Code code 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

Look at another example:

Copy Code code 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

Above, first specify the prototype property of the constructor object. Then a new instance of the object can invoke the method specified in prototype.

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

Copy Code code as follows:

var Animal = {
Name: "Animal",
Makesound:function () {Console.log ("animal Sound");},
}
var animal2 = object.create (Animal);
Animal2.name;
' Animal '
Console.log (Animal2.name);
Animal
Animal2.makesound ();
Animal Sound

This method is simpler than the constructor method, but it can't realize private property and private method, and the instance object can't share data, so the simulation of class is not enough.

3. The minimalist approach presented by the Dutch programmer Gabor de Mooij (minimalist approach). Recommended usage.

Copy Code code as follows:

var Animal = {
Init:function () {
var animal = {};
Animal.name = "Animal";
Animal.makesound = function () {Console.log ("animal Sound");
return animal;
}
};
var animal3 = Animal.init ();
Animal3.name;
' Animal '
Animal3.makesound ();
Animal Sound

Without using prototype and this, you only need to customize one constructor init. The implementation of inheritance is also simple.

Copy Code code 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 (); Overloads similar to methods
Cat Sound
Cat.sleep ();
Cat Sleep

Use of private properties and private methods:

Copy Code code 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 properties can only be read through the object's own methods.
Animal.sound; Undefined private properties can only be read by means of the object itself
Animal4.makesound ();
Private Animal Sound

As long as the properties and methods that are not defined on the animal object are private, the outside world is inaccessible.
Between classes and instances, data sharing can be done.

Copy Code code 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; Can be treated as a class property
' Common animal sound '
Animal5.sound; Instance object cannot access class properties
Undefined
Animal6.sound;
Undefined
Animal5.commonsound ();
Common Animal Sound
Animal6.commonsound ();
Common Animal Sound
Animal5.changesound (); Modifying class Properties
Undefined
Animal.sound;
' Common animal sound '
Animal5.commonsound ();
Common Animal Sound
Animal6.commonsound ();
Common Animal Sound

If Animal.sound is a common property of a class and an instance, it can be treated as a class property and a class method.
If an instance modifies the shared property, the common properties of the class and other instances are also modified.
In summary, it is the concept and usage of class and instance modeled in JavaScript.

The

wants this article to help you with your JavaScript programming.