Heim > Web-Frontend > js-Tutorial > Detaillierte Erläuterung des Unterschieds zwischen ES6-Modularität und CommonJS-Modularität

Detaillierte Erläuterung des Unterschieds zwischen ES6-Modularität und CommonJS-Modularität

青灯夜游
Freigeben: 2020-06-22 18:24:46
nach vorne
2433 Leute haben es durchsucht

Detaillierte Erläuterung des Unterschieds zwischen ES6-Modularität und CommonJS-Modularität

Der Unterschied zwischen ES6-Modularität und CommonJS-Modularität

In aktuellen Projekten, über ES6-Import, -Export und ich bin Ich bin verwirrt über die Verwendung von module.exports und require in CommonJS. Wenn etwas nicht stimmt, geben Sie mir bitte einen Rat. Der Befehl

ES6-Modularität

import wird zur Eingabe der von anderen Modulen bereitgestellten Funktionen verwendet; der Befehl export dient zur Angabe die externe Schnittstelle des Moduls.

1. Import und Export

// 导出 a.js

/** 写法一 **/
var name = 'sheep'
function getSheep() {
    name = 'hourse'
}
export {getSheep}

// 引入 b.js
import {getSheep} from './a.js'


/** 写法二 **/
var name = 'sheep'
export function getSheep() {
    name = 'hourse'
}

// 引入 b.js

import {getSheep} from './a.js'
Nach dem Login kopieren

2. Import und Export standardmäßig

Es kann mehrere Exporte geben, Exportstandard Es gibt nur eine

// 导出 a.js
let obj = {
    name: 'hello',
    getName: function (){
        return this.name
    }

export default obj

// 引入 b.js

import obj from './a.js'
Nach dem Login kopieren

CommonJS-Modularität

1. require und module.exports

require wird sowohl in ES6 (Bable konvertiert Import in Require) als auch in CommonJS unterstützt. Selbst wenn wir das ES6-Modulsystem verwenden und Babels Konvertierung verwenden, wird das ES6-Modulsystem schließlich in die CommonJS-Spezifikation konvertiert.

Bei Verwendung von require in Babel5 ist der importierte Wert der von module.export zurückgegebene Wert oder der vom Exportstandard zurückgegebene Wert.

    Wenn Sie in Babel6 den Import zum Einführen verwenden, können Sie den Wert von export default direkt abrufen. Wenn es sich jedoch um eine per require importierte Komponente handelt, wird exportiert, ob der Export module.export ist , oder Standard exportieren, können Sie direkt Um den Standardwert für den Export zu erhalten, müssen Sie einen Standardwert hinzufügen.
  • Referenz:

  • https://www.jianshu.com/p/27ee06296bcd

https://juejin.im/post/5a2e5f0851882575d42f5609

  • Empfohlenes Tutorial: „

    JS Tutorial

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung des Unterschieds zwischen ES6-Modularität und CommonJS-Modularität. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:segmentfault.com
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage