In object-oriented programming, a class is a template for objects (object) that defines properties and methods common to the same set of objects (also known as "instances").
The JavaScript language does not support "classes," but you can use some workarounds to simulate "classes."
First, the method of constructing function
This is the classic method, but also the textbook must teach method. It simulates a "class" with a constructor, within which it uses the This keyword to refer to an instance object.
function Cat () {
THIS.name = "Mao";
}
When generating an instance, use the New keyword.
var cat1 = new Cat ();
alert (cat1.name); Da Mao
The properties and methods of the prototype class can also be defined on top of the constructor's object.
Cat.prototype.makeSound = function () {
Alert ("Meow Meow");
}
For a detailed introduction to this method, please see my series of articles, "Javascript Object-oriented programming", which is not much to say here. Its main disadvantage is that it is more complicated, and it is very laborious to write and read the prototype.
Second, object.create () Law
In order to solve the disadvantage of "constructor method", it is more convenient to generate objects, JavaScript International standard ECMAScript Fifth edition (currently in the third edition), proposed a new method Object.create ().
In this way, "class" is an object, not a function.
var Cat = {
Name: "Da Mao",
Makesound:function () {alert ("Meow Meow");}
};
Then, generate the instance directly with Object.create (), without the need for new.
var cat1 = object.create (Cat);
alert (cat1.name); Da Mao
Cat1.makesound (); Meow Meow
Currently, the latest versions of major browsers (including IE9) have deployed this method. If you encounter an old-fashioned browser, you can deploy it yourself with the following code.
if (! Object.create) {
Object.create = function (o) {
function F () {}
F.prototype = O;
return new F ();
};
}
This method is simpler than "constructor method", but it cannot implement private properties and private methods, nor can data be shared between instance objects, and the simulation of "class" is not comprehensive enough.
Iii. Minimalist Law
The Dutch programmer, Gabor de Mooij, proposed a new approach that was better than object.create (), which he called the "minimalist approach" (minimalist approach). This is also my recommended method.
3.1 Package
This method does not use this and prototype, and the code is very simple to deploy, which is probably why it is called "minimalism."
First, it also simulates "class" with an object. Inside this class, define a constructor createnew (), which is used to generate the instance.
var Cat = {
Createnew:function () {
Some code here
}
};
Then, in CreateNew (), define an instance object that takes the instance object as the return value.
var Cat = {
Createnew:function () {
var cat = {};
Cat.name = "Mao";
Cat.makesound = function () {alert ("Meow Meow");};
return cat;
}
};
When used, the instance object can be obtained by invoking the CreateNew () method.
var cat1 = Cat.createnew ();
Cat1.makesound (); Meow Meow
The benefit of this approach is that it is easy to understand, the structure is clear and elegant, and conforms to the traditional "object-oriented programming" constructs, so the following features can be easily deployed.
3.2 Inheritance
It is convenient to have one class inherit another class. As long as in the former CreateNew () method, call the latter's CreateNew () method.
Define a animal class first.
var Animal = {
Createnew:function () {
var animal = {};
Animal.sleep = function () {alert ("Sleeping in");};
return animal;
}
};
Then, in the Cat's CreateNew () method, call the animal's CreateNew () method.
var Cat = {
Createnew:function () {
var cat = Animal.createnew ();
Cat.name = "Mao";
Cat.makesound = function () {alert ("Meow Meow");};
return cat;
}
};
The cat instances that are obtained will inherit both the cat class and the animal class.
var cat1 = Cat.createnew ();
Cat1.sleep (); Sleep
3.3 Private properties and private methods
In the CreateNew () method, the methods and properties that are not defined on the Cat object are private.
var Cat = {
Createnew:function () {
var cat = {};
var sound = "Meow meow meow";
Cat.makesound = function () {alert (sound);};
return cat;
}
};
The internal variable sound of the above example cannot be read externally, only through cat's public Method MakeSound ().
var cat1 = Cat.createnew ();
alert (Cat1.sound); Undefined
3.4 Data sharing
Sometimes, we need all the instance objects to be able to read and write the same internal data. This time, as long as the internal data, encapsulated in the class object inside, CreateNew () method outside.
var Cat = {
Sound: "Meow meow Meow",
Createnew:function () {
var cat = {};
Cat.makesound = function () {alert (cat.sound);};
Cat.changesound = function (x) {cat.sound = x;};
return cat;
}
};
Then, build two instance objects:
var cat1 = Cat.createnew ();
var cat2 = Cat.createnew ();
Cat1.makesound (); Meow Meow
At this point, if there is an instance object that modifies the shared data, the other instance object is also affected.
Cat2.changesound ("La la La");
Cat1.makesound (); La La la
I simply test the code
One method
function cart (name)
{
THIS.name = name;
This.show=function ()
{
alert (this.name);
}
}
var Icart = new Cart ("Hello");
Icart.show ();
The method
var cat = {
Name: "Hello",
Show:function () {alert (this.name)}
}
var cat1 = Object.create (cat);
Cat1.show ();
Three method
function Horse ()
{
}
Horse.prototype.makeSound = function () {
Alert ("Meow Meow");
}
var ihorse = new Horse ();
Ihorse.makesound ();
Simple definition of JavaScript class