Why should the front end use modularity?
This time I will bring you why the front-end should use Modularization? , what are the precautions for front-end modularization? The following is a practical case, let’s take a look.
What do CMD, AMD, and CommonJS specifications refer to? What applications are there?
AMD (Asynchronous Module Definition) specifies a mechanism under which modules and dependencies can be loaded step by step. This is especially true for asynchronous loading on the browser side, which is also an extension of the CommonJS specification. 12
Syntax
define(id?, dependencies?, factory);1
id: The name of the module in the definition, optional; if If this parameter is not provided, the module name should default to the name of the specified script requested by the module loader. .
Dependencies dependencies: It is an array literal of the module identifier that the current module depends on and has been defined by the module. The dependency parameter is optional, if this parameter is omitted it should default to ["require", "exports", "module"]. However, if the factory method's length attribute is less than 3, the loader will choose to call the factory method with the number of arguments specified by the function's length attribute.
Factory method factory: The module initializes the function or object to be executed. If it is a function, it should be executed only once. If it is an object, this object should be the output value of the module.
Example
define('modal', ['jQuery', 'dialog'], function($, Dialog){$('.modal').show();
Dialog.open();
});1234AMD’s libraries include RequireJS, curl, Dojo, etc. CommonJS is a specification for server-side modules, and Node.js adopts this specification. Node.JS first adopted the concept of js modularity. In a module, there is a free variable "require", which is a function. The "require" function receives a module identifier. "require" returns the API exported by the external module. If a dependency cycle occurs, the external module may not have completed execution when required by its transitive dependencies; in this case, the object returned by "require" must contain at least the Output that has been prepared before calling the require function (which will enter the current module execution environment). If the requested module cannot be returned, then "require" must throw an error. In a module, there will be a free variable named "exports", which is an object to which the module can add its own API during execution. Modules must use the "exports" object as the only representation of output.
Example
exports.add = function() {
var sum = 0, i = 0, args = arguments, l = args.length; while (i < l) {
sum += args[i++];
}
return sum;
};1234567CMD (Common Module Definition) is generated during the promotion process of SeaJS.
CMD was proposed by Yu Bo in China. Its main difference from the AMD specification is the definition module and dependency introduction part. AMD needs to specify all dependencies when declaring the module and pass them into the module through formal parameters
Example
define(function(require, exports, module) {
exports.add = function() {
var sum = 0, i = 0, args = arguments, l = args.length; while (i < l) {
sum += args[i++];
}
return sum;
};
});123456789Compared with the AMD module, CMD is closer to Node’s definition of the CommonJS specification:
define(factory);1
In the dependency part, CMD supports dynamic introduction. The example is as follows:
define(function(require , exports , module){ //the module code goes here
});123require, exports, module are passed to the module through formal parameters. When you need to rely on a module, you can call the module to import it at any time.
I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to the php Chinese website Other related articles!
Recommended reading:
Methods for front-end page testing
The application of call and apply in javascript
The above is the detailed content of Why should the front end use modularity?. For more information, please follow other related articles on the PHP Chinese website!
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
Unable to log in to mysql as root
Apr 08, 2025 pm 04:54 PM
The main reasons why you cannot log in to MySQL as root are permission problems, configuration file errors, password inconsistent, socket file problems, or firewall interception. The solution includes: check whether the bind-address parameter in the configuration file is configured correctly. Check whether the root user permissions have been modified or deleted and reset. Verify that the password is accurate, including case and special characters. Check socket file permission settings and paths. Check that the firewall blocks connections to the MySQL server.
Navicat's method to view MongoDB database password
Apr 08, 2025 pm 09:39 PM
It is impossible to view MongoDB password directly through Navicat because it is stored as hash values. How to retrieve lost passwords: 1. Reset passwords; 2. Check configuration files (may contain hash values); 3. Check codes (may hardcode passwords).
How to view database password in Navicat for MariaDB?
Apr 08, 2025 pm 09:18 PM
Navicat for MariaDB cannot view the database password directly because the password is stored in encrypted form. To ensure the database security, there are three ways to reset your password: reset your password through Navicat and set a complex password. View the configuration file (not recommended, high risk). Use system command line tools (not recommended, you need to be proficient in command line tools).
How to recover data after SQL deletes rows
Apr 09, 2025 pm 12:21 PM
Recovering deleted rows directly from the database is usually impossible unless there is a backup or transaction rollback mechanism. Key point: Transaction rollback: Execute ROLLBACK before the transaction is committed to recover data. Backup: Regular backup of the database can be used to quickly restore data. Database snapshot: You can create a read-only copy of the database and restore the data after the data is deleted accidentally. Use DELETE statement with caution: Check the conditions carefully to avoid accidentally deleting data. Use the WHERE clause: explicitly specify the data to be deleted. Use the test environment: Test before performing a DELETE operation.
Centos stops maintenance 2024
Apr 14, 2025 pm 08:39 PM
CentOS will be shut down in 2024 because its upstream distribution, RHEL 8, has been shut down. This shutdown will affect the CentOS 8 system, preventing it from continuing to receive updates. Users should plan for migration, and recommended options include CentOS Stream, AlmaLinux, and Rocky Linux to keep the system safe and stable.
How to install mysql in centos7
Apr 14, 2025 pm 08:30 PM
The key to installing MySQL elegantly is to add the official MySQL repository. The specific steps are as follows: Download the MySQL official GPG key to prevent phishing attacks. Add MySQL repository file: rpm -Uvh https://dev.mysql.com/get/mysql80-community-release-el7-3.noarch.rpm Update yum repository cache: yum update installation MySQL: yum install mysql-server startup MySQL service: systemctl start mysqld set up booting
Navicat's method to view PostgreSQL database password
Apr 08, 2025 pm 09:57 PM
It is impossible to view PostgreSQL passwords directly from Navicat, because Navicat stores passwords encrypted for security reasons. To confirm the password, try to connect to the database; to modify the password, please use the graphical interface of psql or Navicat; for other purposes, you need to configure connection parameters in the code to avoid hard-coded passwords. To enhance security, it is recommended to use strong passwords, periodic modifications and enable multi-factor authentication.
Navicat Connection Timeout: How to Resolve
Apr 08, 2025 pm 11:03 PM
Reasons for Navicat connection timeout: network instability, busy database, firewall blocking, server configuration problems, and improper Navicat settings. Solution steps: Check network connection, database status, firewall settings, adjust server configuration, check Navicat settings, restart the software and server, and contact the administrator for help.
