Maison > Article > interface Web > Quelle est la différence entre la modularité commonjs et es6
Différences : 1. Les modules CommonJS sont chargés au moment de l'exécution, tandis que les modules ES6 sont des interfaces de sortie au moment de la compilation ; 2. require() du module CommonJS charge les modules de manière synchrone, tandis que la commande d'importation du module ES6 se charge de manière asynchrone ; module, ES6 est l'introduction du module.
L'environnement d'exploitation de ce tutoriel : système Windows 7, ECMAScript version 6, ordinateur Dell G3.
CommonJS
Pour les types de données de base, il s'agit d'une copie. Autrement dit, il sera mis en cache par le module. Parallèlement, les variables sorties par ce module peuvent être réaffectées dans un autre module.
Pour les types de données complexes, il s'agit d'une copie superficielle. Puisque les objets référencés par les deux modules pointent vers le même espace mémoire, les modifications de la valeur du module affecteront l'autre module.
Lorsqu'un module est chargé à l'aide de la commande require, le code de l'ensemble du module sera exécuté.
Lorsque la commande require est utilisée pour charger le même module, le module ne sera pas exécuté à nouveau, mais la valeur dans le cache sera obtenue. En d'autres termes, quel que soit le nombre de chargements du module CommonJS, il ne s'exécutera qu'une seule fois lors de son premier chargement. S'il est chargé ultérieurement, le résultat de la première exécution sera renvoyé, sauf si le cache système est chargé. effacé manuellement.
Lors d'un chargement en boucle, il est exécuté lors du chargement. Autrement dit, lorsque le code du script est requis, il sera entièrement exécuté. Une fois qu'un module est "chargé en boucle", seule la partie exécutée sera sortie, et la partie non exécutée ne sera pas sortie.
Module ES6
Les valeurs du module ES6 appartiennent à [référence dynamique en lecture seule].
En lecture seule, c'est-à-dire que la valeur de la variable importée ne peut pas être modifiée. La variable importée est en lecture seule, qu'il s'agisse d'un type de données de base ou d'un type de données complexe. Lorsqu'un module rencontre une commande d'importation, une référence en lecture seule est générée. Lorsque le script est réellement exécuté, la valeur sera récupérée du module chargé en fonction de cette référence en lecture seule.
Pour la dynamique, lorsque la valeur d'origine change, la valeur chargée par l'import changera également. Qu'il s'agisse d'un type de données de base ou d'un type de données complexe.
Lors d'un chargement en boucle, les modules ES6 sont référencés dynamiquement. Tant qu'une référence existe entre les deux modules, le code pourra s'exécuter.
La différence entre les modules ES6 et les modules CommonJS
1 Les modules CommonJS sont chargés au moment de l'exécution, tandis que les modules ES6 sont des interfaces de sortie au moment de la compilation.
2. Le require() du module CommonJS charge le module de manière synchrone, tandis que la commande import du module ES6 se charge de manière asynchrone, avec une phase de résolution indépendante pour les dépendances du module.
3. CommonJS est une copie superficielle du module, et le module ES6 est l'introduction du module. C'est-à-dire que le module ES6 est uniquement en lecture seule et ne peut pas modifier sa valeur. , semblable à const.
4. L'interface d'importation est en lecture seule (statut lecture seule), et sa valeur variable ne peut pas être modifiée. Autrement dit, le pointeur pointant vers sa variable ne peut pas être modifié, mais le pointeur interne pointant vers la variable peut être modifié. Vous pouvez réaffecter une paire commonJS (modifier le pointage du pointeur), mais attribuer une valeur à un module ES6 entraînera une erreur de compilation.
Ce que les modules ES6 et CommonJS ont en commun :
1. Les modules CommonJS et ES6 peuvent attribuer des valeurs aux objets importés, c'est-à-dire modifier les valeurs des propriétés internes des objets.
【Recommandations associées : tutoriel vidéo javascript, front-end web】
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!