Quelques bases modulaires associées

Cet article expliquera en détail les bases de la modularisation et comment comprendre les connaissances pertinentes dans ce domaine.

Pourquoi utiliser la modularité ?

Résoudre les conflits de noms et éviter la pollution mondiale

Résoudre la gestion des dépendances

Améliorer la lisibilité du code

Découplage du code pour améliorer la réutilisabilité

Que faire Les spécifications CMD, AMD et CommonJS font-elles référence ? Quelles sont les applications ?

CMD est Common Module Definition. Il s'agit principalement du résultat standardisé de la définition modulaire dans le processus de promotion de sea.js, et utilise souvent le nom de fichier. C'est l'ID du module et recommande les dépendances proches. L'application principale est sea.js Exemple :

define(function(require,exports,module){
    var $ = require('jquery.js')
    $('div').addClass('active');

});//cmd recommande les dépendances proches, donc les dépendances sont écrites dans les fonctions require est une méthode. , exporte Est un objet qui fournit une interface externe. Le module est un objet qui stocke les propriétés et les méthodes liées au module actuel.

AMD est une définition de module asynchrone. Il s'agit principalement de la sortie standardisée de la définition de module pendant le processus de promotion de require.js. Il résout le problème de dépendance de plusieurs fichiers js et le chargement de fichiers js. problèmes d'attente de page fréquents, la dépendance frontale est recommandée. L'application principale est require.js Exemple :

define('modal',['jQuery'],function($){
    $('modal').show();

})//define est le mot-clé de définition, modal est le nom du module défini, qui peut. généralement omis, [] contient les modules dépendants à charger, suivis de la fonction de rappel.

CommonJS fait principalement référence à la spécification de module qui s'exécute côté navigateur, et son application principale est node.js.

Un fichier correspond à un module, chaque module est une portée distincte et les modules chargés sont chargés de manière synchrone.

Il n'y a qu'un seul export dans un module, l'objet module.exports Mettez les objets que le module veut sortir dans le module.

Chargez les modules en utilisant la méthode require. Exemple :

//模块定义  myMode.jsvar name = 'jiuyi';function printName(){    console.log(name);
}
functionprintFullName(firstName){
    consoele.log(firstName+name);
}module.erports = {    printName: printName,    printFullName: printFullName
}//加载模块var nameModule = require('./myMode.js')
nameModule.printName();

Dans la configuration requirejs suivante, quel est le rôle de baseUrl ? Quelle est la base ? Quel est le rôle et l'utilisation des chemins ?

requirejs.config({  baseUrl: "src/js",  
  paths: {    'jquery': 'lib/bower_components/jquery/dist/jquery.min'
  }
});

Le rôle de baseUrl est de définir le chemin de base pour le chargement des fichiers JS, en fonction du chemin où se trouve le HTML, et le rôle des chemins est de définir le chemin de base de baseUrl. De plus, définissez le chemin de certains fichiers spécifiques, en fonction du chemin baseUrl.

Qu'est-ce que baseUrl dans la configuration d'emballage r.js suivante ? Quel est le nom ?

({
    baseUrl: "./src/js",
    paths: {        'jquery': 'lib/bower_components/jquery/dist/jquery.min'
    },
    name: "main",
    out: "dist/js/merge.js"})

Ici, baseUrl fait référence à la recherche du fichier de configuration de require.js en fonction de son propre chemin de fichier. . Le baseUrl

name fait référence au nom du module principal de l'entrée

out fait référence au chemin de la sortie packagée

Cet article explique les connaissances de base liées à. modularisation.Si vous voulez en savoir plus. Pour plus de connaissances connexes, veuillez consulter le site Web chinois de php.

Recommandations associées :

Quelle est la différence entre innerText et innerHTML des objets dom ?

Quelques questions de base sur JS

Comment modulariser require.js avec js front-end

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!