最初,JavaScript 没有导入/导出模块的方法。这是个问题。想象一下将您的应用程序写入一个文件中。这是一场噩梦。然后,比我聪明得多的人尝试为Javascript 添加模块化。其中有CJS、AMD、UMD、ESM等。您可能听说过其中一些(还有其他方法,但这些是主要的)。描述语法、用途和基本行为等高级信息。我的目标是让读者在看到它们时能够认出它们。
CJSCJS 是CommonJS 的缩写。这看起来像这样:
//importing const doSomething=require('./doSomething.js'); //exportingmodule.exports=function doSomething(n) { //do Something} 也许有些人会立即从node.js 语法中识别出CJS。这是因为Node 使用CJS 模块格式。 CJS同步导入模块。您可以从库node_modules 或本地目录导入它。通过const myLocalModule=require('./some/local/file.js') 或var React=require('react');当CJS 导入时,它提供导入对象的副本。 CJS 不适用于浏览器。它需要翻译和打包。 AMDAMD 代表异步模块定义。示例代码如下。
Define(['dep1', 'dep2'], function (dep1, dep2) { //通过返回值来定义模块的值return function () {};});or
//'简化的CommonJS 包装' https://requirejs.org/docs/whyamd.htmldefine(function (require) { var dep1=require('dep1'), dep2=require('dep2'); return function () {} ;}) ;AMD 异步导入模块(因此得名)。 AMD(提出时)是为前端设计的(CJS 是后端)。 AMD 语法不如CJS 直观。我认为AMD是CJS的对立兄弟。 UMDUMD 代表通用模块定义。这看起来像这样(来源):
(function(route,factory) { if (typeof Define==='function'definition.amd) { Define(['jquery', '下划线'], 工厂); } else if (typeofexports==='object' ) { module.exports=Factory(require('jquery'), require('underscore')); } else { root.Requester=Factory(root.$, root._); }}(this, function ($ , _) { //我们在这里定义了一个模块实现var Requester={ //. }; return Requester;})); 适用于前端和后端(因此称为通用附加)。与CJS和AMD不同,UMD是一种由多个模块组成系统的模式。使用Rollup/Webpack 等捆绑器时,UMD 通常用作后备模块。 ESMESM 代表ES 模块。实现标准模块系统是Javascript 的建议。我相信你们很多人以前都见过这个。
从“react”导入React;其他情况
import {foo, bar} from './myLib';export default function() { //function};export const function1() {.};export const function2() {.};many与现代浏览器配合使用提供两全其美的功能,借助ES6 的静态模块结构,具有类似CJS 的简单语法和AMD 的异步tree-shaking 功能ESM 消除了对Rollup 代码等打包程序的需要,因此您的网站发送的代码更少,加载速度更快。可以在HTML 中调用。只需按照以下步骤操作:这可能无法在所有浏览器中100% 工作。
总结ESM 是最好的模块化模式管理风格,这要归功于其简单的语法、异步特性和树摇动功能。 UMD 无处不在,并且经常被用作ESM 不起作用时的后备方案。 CJS 是同步的,有利于后端。 AMD 是异步的,因此适合前端。感谢您的阅读。 (本文翻译自温书其武的Igor Irianto文章《What Are CJS, AMD, UMD, and ESM in Javascript》,转载请注明出处。原文链接:https://irian.to/blogs/what-are-cjs-amd- umd-and-esm-in-javascript /)
标题:jscode什么意思,.js是什么
链接:www.ggaan.com/news/sypc/2729.html
版权:文章转载自网络,如有侵权,请联系删除!