


A brief discussion on the simulation of object-oriented technology in JavaScript_javascript skills
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
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

Hot AI Tools

Undresser.AI Undress
AI-powered app for creating realistic nude photos

AI Clothes Remover
Online AI tool for removing clothes from photos.

Undress AI Tool
Undress images for free

Clothoff.io
AI clothes remover

Video Face Swap
Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Article

Hot Tools

Notepad++7.3.1
Easy-to-use and free code editor

SublimeText3 Chinese version
Chinese version, very easy to use

Zend Studio 13.0.1
Powerful PHP integrated development environment

Dreamweaver CS6
Visual web development tools

SublimeText3 Mac version
God-level code editing software (SublimeText3)

Hot Topics



Frequently Asked Questions and Solutions for Front-end Thermal Paper Ticket Printing In Front-end Development, Ticket Printing is a common requirement. However, many developers are implementing...

There is no absolute salary for Python and JavaScript developers, depending on skills and industry needs. 1. Python may be paid more in data science and machine learning. 2. JavaScript has great demand in front-end and full-stack development, and its salary is also considerable. 3. Influencing factors include experience, geographical location, company size and specific skills.

JavaScript is the cornerstone of modern web development, and its main functions include event-driven programming, dynamic content generation and asynchronous programming. 1) Event-driven programming allows web pages to change dynamically according to user operations. 2) Dynamic content generation allows page content to be adjusted according to conditions. 3) Asynchronous programming ensures that the user interface is not blocked. JavaScript is widely used in web interaction, single-page application and server-side development, greatly improving the flexibility of user experience and cross-platform development.

How to merge array elements with the same ID into one object in JavaScript? When processing data, we often encounter the need to have the same ID...

In-depth discussion of the root causes of the difference in console.log output. This article will analyze the differences in the output results of console.log function in a piece of code and explain the reasons behind it. �...

Discussion on the realization of parallax scrolling and element animation effects in this article will explore how to achieve similar to Shiseido official website (https://www.shiseido.co.jp/sb/wonderland/)...

Learning JavaScript is not difficult, but it is challenging. 1) Understand basic concepts such as variables, data types, functions, etc. 2) Master asynchronous programming and implement it through event loops. 3) Use DOM operations and Promise to handle asynchronous requests. 4) Avoid common mistakes and use debugging techniques. 5) Optimize performance and follow best practices.

Explore the implementation of panel drag and drop adjustment function similar to VSCode in the front-end. In front-end development, how to implement VSCode similar to VSCode...
