1. Implement classes with JavaScript
JAVASCRITPT does not have a dedicated mechanism to implement classes, here is the use of its functions to allow nested mechanisms to implement the class. A function can contain variables, and can contain other functions, so that variables can be properties, and internal functions can be used as member methods. So the outer function itself can be used as a class. As follows:
Copy Code code as follows:
function MyClass ()
{
This is equivalent to the constructor function
}
Here MyClass is a class. You can actually think of it as a class constructor. As for the part of the constructor, it will be described in detail later.
2. How to obtain an instance of a class
Implementing a class should be able to get an instance of the class, and JavaScript provides a way to get an object instance. That is, the new operator. In fact, in JavaScript, classes and functions are the same concept, and when you use new to manipulate a function, you return an object. As follows:
var obj1 = new MyClass ();
3. References to members of the object
There are three ways to refer to a property or method of a class in JavaScript.
1> Point number operator
This is one of the most common ways of quoting, and it is not burdensome. In the form of:
Object name. property name;
Object name. Method name;
2> square brackets Reference
In JavaScript, members of an object are allowed to be referenced with brackets. As follows:
The object name [property name];
The object name [method name];
In square brackets here is a string representing the name of the property or method, not necessarily a string constant. You can also use variables. This allows you to pass a property or method name with a variable. It is convenient for programming. In some cases, you can use this method when you are not sure that you want to invoke that property or method in your code. Otherwise, if you use the dot operator, you need to use conditional judgment to invoke the property or method.
In addition, the properties and method names that are referenced by using brackets can also begin with a number, or a space, and the property and method names referenced by the point number follow the rules of the identifiers. However, the use of a non-identifier naming method is not generally advocated.
3> using the Eval function
The Eval function is a good choice if you do not want to use a variable to pass a variable or method name, and you do not want to use conditional judgment. Eval receives a parameter of type string and then executes the string as code in the context, returning the result of execution. This is where the Eval function is used. As follows:
Alert (eval ("Object name." + Element.value));
4. Add, modify, and delete operations on object properties, methods
In JavaScript, you can dynamically add, modify, and delete properties and methods for an object after the object is generated, which is different from other object-oriented languages.
1> Add properties and methods
To create an object, there are no properties and methods after the empty object is created, but we can create it in code.
Copy Code code as follows:
var obj1 = new Object ();
Add properties
Obj1.id = 1;
Obj1. Name = "Johnson";
Add method
Obj1.showmessage = function ()
{
Alert ("ID: + this.id +", Name: "+ this.") Name);
}
2> Modifying properties and methods
Similar to adding properties and methods, such as the following example:
Copy Code code as follows:
modifying properties
Obj1.id = 2;
Obj1. Name = "Amanda";
Modify method
Obj1.showmessage = function ()
{
Alert ("ID: + this.id");
}
3> Delete Properties and methods
The property or method that you want to delete directly assigns a value of undefined:
Copy Code code as follows:
Obj1.id = 1;
Obj1. Name = undefined;
Obj1.showmessage = undefined;
5. Create an object of no type.
Similar to the anonymous types,javascript in c#3.0 can also create objects of no type. The form is as follows:
Copy Code code as follows:
var obj1 = {};
var obj2 =
{
Id:1,
Name: "Johnson",
Showmessage:function ()
{
Alert ("ID:" + this.id + "Name:" + this.) Name);
}
}
This defines two objects of no type, obj1 and Obj2. Where Obj1 is an empty object. Obj2 includes two property IDs, name, and a method showmessage. Each property and method is separated by commas. The property (method) name is separated from its value by a semicolon.
When you create a property method in this manner, you can also define the name of the property method with a string. Such as:
Copy Code code as follows:
var obj2 =
{
"ID": 1,
"Name": "Johnson"
}
6. Prototype
Each function object has a child object prototype, because a function can also represent a class, so prototype represents a collection of members of a class. When an object is new, the members of the prototype object are instantiated as members of the object. Let's look at one example:
Copy Code code as follows:
function MyClass ()
{ }
MyClass.prototype.ID = 1;
MyClass.prototype.Name = "Johnson";
MyClass.prototype.showMessage = function ()
{
Alert ("ID:" + this.id + "Name:" + this.) Name);
}
var obj1 = new MyClass ();
Obj1.showmessage ();
Creating a class using the prototype object has a benefit. If all members are written directly in the declaration of the class, the following are:
Copy Code code as follows:
function MyClass ()
{
Add properties
This.id = 1;
This. Name = "Johnson";
Add method
This.showmessage = function ()
{
Alert ("ID: + this.id +", Name: "+ this.") Name);
}
}
var obj1 = new MyClass ();
var obj2 = new MyClass ();
In the above code, a class MyClass is defined, and two attributes and one method are defined directly in the class. The two objects were then instantiated, with two properties and one method created once for each MyClass object, wasting memory space. And with prototype can solve this problem, each new function, its prototype object members will automatically assign to this object, when the new multiple objects will not be repeatedly created.
Since the initialization of prototype occurs before the function body executes, the following code can be used to prove that:
Copy Code code as follows:
function MyClass ()
{
This is equivalent to the constructor function
This.id = 1;
This. Name1 = this. Name;
This.showmessage ();
}
MyClass.prototype.Name = "Johnson";
MyClass.prototype.showMessage = function ()
{
Alert ("ID: + this.id +", Name: "+ this.") Name);
}
var obj1 = new MyClass ();
Executing the above code shows that the dialog box pops up when new objects of this type are available.
Finally, the prototype has a method that is used in object-oriented design. That is: the constructor property, which is a call to a constructor, where the constructor is the code in the declaration of the class mentioned above. Such as:
Copy Code code as follows:
function MyClass ()
{
This is equivalent to the constructor function
Alert ("This are in constructor");
}
MyClass.prototype.constructor ();
var obj1 = new MyClass ();
Execute the above code and you will find that the dialog box pops up two times. Thus, prototype can be used specifically for members of the design class, and in fact, in JavaScript object-oriented design, prototype is often used.
