Home >Web Front-end >JS Tutorial >A brief discussion on the simulation of object-oriented technology in JavaScript_javascript skills

A brief discussion on the simulation of object-oriented technology in JavaScript_javascript skills

WBOY
WBOYOriginal
2016-05-16 19:25:48916browse

1. Introduction
In C# and Java languages, object-oriented is implemented in the form of classes, especially inheritance. Class inheritance shows powerful functions and is easy to learn. JavaScript is not a pure object-oriented language, but an object-based language. The inheritance of objects is in the form of prototype functions. Many beginners do not understand it when they first come into contact with it, but JavaScript is implemented in the form of prototype functions. Object-oriented technology is not only feasible, but also provides dynamic inheritance functions for object-oriented technology. This article mainly discusses the object-oriented technology of JavaScript.
2. Overview of prototype objects
Every JavaScript object has a prototype object, and the objects inherit all properties of the prototype object. An object's prototype is defined by the constructor that creates the object. All functions in JavaScript have an attribute called prototype, which refers to the prototype object. When the prototype object is initialized, only the constructor attribute refers to the object that created the prototype object. JavaScript does not have the concept of Class to define a class. The constructor defines the class and initializes the properties in the class. The members of each class will inherit the same properties from the prototype object. In other words, the prototype object provides the same properties shared by instances of the class. Properties and methods, which saves memory.
When reading the properties of an object, JavaScript will first search from the object. If it is not found, it will search for the property (or method) in the prototype object. Therefore, especially for methods, it is best to save them. into the prototype object to facilitate sharing and save memory, and the prototype object also has a powerful function, that is, if you instantiate some objects through the constructor, and then add attributes and methods to the prototype object of the constructor, then The object instance it originally instantiated will inherit these added properties and methods.
3. Object attributes, object methods, class attributes, class methods
Each object will have its own separate copy of instance attributes and instance methods. If 5 objects are instantiated, there will be 5 objects. Copies of instance properties and instance methods. This keyword refers to their instance objects, that is to say, whoever operates the instance method, this refers to him; which instance object attribute is accessed, this refers to the instance object.
There is only one copy of class methods and class attributes. When calling a class method, the name of the class must be quoted, for example: Date.setHours();
A program is used below to represent instance attributes, instance methods, class attributes, and classes. Method

Copy code The code is as follows:

function Mobile(kind,brand) {
this.kind=kind;//Define the type of mobile phone, such as GSM/CDMA
  this.brand=brand;//Define the brand of the mobile phone, the this keyword represents the object instantiated with this constructor
 }
 
 /**//*
  The second step in defining a class is to define its instance methods or other properties in the prototype object of the constructor
Any properties defined by this object will be inherited by all instances of this class.
 
*/
  //Dial, here just returns the phone number
 Mobile.prototype.dial = function(phoneNo) {
return phoneNo;
 } ;
 
 
 /**//*
The third step in defining a class is to define class methods, constants and other necessary class attributes as attributes of the constructor itself, not as attributes of the prototype object of the constructor
Note that class methods are not used keyword this, because they only operate on their actual arguments.
*/
 //Turn on and off methods
 Mobile.turnOn=function() {
  return "The power of mobile is on";
 }
 Mobile.turnOff=function() {
  return "The power of mobile is off";
 }
 

 
  // Class attributes, so that they can be used as constants, note that they are not actually read-only
  Mobile.screenColor=64K; // Assume that the screen colors of this type of mobile phones are all 64K Color screen
4. Subclassing
JavaScript supports subclassing. You only need to instantiate the prototype object of the subclass with the super class. However, it should be noted that there will be a problem after subclassing. Since it is obtained by instantiating the prototype object of the subclass with the superclass, it flushes out its own constructor attribute provided by JavaScript. In order to ensure the correctness of the constructor, it needs to be respecified. An example of a subclassing program is as follows:
/***** Subclassing *****/
//The following is the subclass constructor Smartphone
function SmartPhone(os)
{
this.os=os;

}
//We use the Mobile object as its prototype
//This means that instances of the new class will inherit SmartPhone.prototype,
//The latter is inherited from Mobile.prototype
//Mobile.prototype is inherited from Object.prototype
SmartPhone.prototype=new Mobile(GSM,Nokia);
//The following adds a new method to the subclass to send an email. Here it just returns Email address
SmartPhone.prototype.sendEmail=function(emailAddress) {
return this.emailAddress
}
//The above subclassing method has a slight flaw, because we explicitly set SmartPhone.prototype It becomes an object we created, so it overwrites the prototype object provided by JS
// and discards the given Constructor attribute. This property refers to the constructor that created this object. However, the SmartPhone object integrates its
//constructor of the parent class. It does not have this attribute itself, and explicitly setting an attribute can solve this problem:
SmartPhone.prototype.constructor=SmartPhone;
var objSmartPhone= new SmartPhone();//instantiate subclass
Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn