js 模块化

js 模块化

模块化主要是用来抽离公共代码,隔离作用域,避免变量冲突等。

模块化的整个发展历史如下:

IIFE:使用自执行函数来编写模块化,特点:在一个单独的函数作用域中执行代码,避免代码冲突。

js 复制代码
(function () {
  return {
    data: [],
  };
})();

AMD:使用 require 来编写模块化,特点:依赖必须提前声明好。

js 复制代码
define("./index.js", function (code) {
  //code 就是index.js返回的内容
});

CMD:使用 seaJS 来编写模块化,特点:支持动态引入依赖文件。

js 复制代码
define(function (require, exports, module) {
  var indexCode = require("./index.js");
});

CommonJS:nodeJS 中自带的模块化。

js 复制代码
var fs = require("fs");

UMD:兼容 AMD,CommonJS 模块化语法。

webpack(require.ensure):webpack2.x 版本中的代码分割。

ES Modules:ES6 引入的模块化,支持 import 来引入另一个 js。

相关推荐
掘金安东尼26 分钟前
用 CSS 打造完美的饼图
前端·css
掘金安东尼8 小时前
纯 CSS 实现弹性文字效果
前端·css
牛奶9 小时前
Vue 基础理论 & API 使用
前端·vue.js·面试
牛奶9 小时前
Vue 底层原理 & 新特性
前端·vue.js·面试
anOnion9 小时前
构建无障碍组件之Radio group pattern
前端·html·交互设计
pe7er9 小时前
状态提升:前端开发中的状态管理的设计思想
前端·vue.js·react.js
NAGNIP10 小时前
一文搞懂深度学习中的通用逼近定理!
人工智能·算法·面试
SoaringHeart10 小时前
Flutter调试组件:打印任意组件尺寸位置信息 NRenderBox
前端·flutter
晚风予星11 小时前
Ant Design Token Lens 迎来了全面升级!支持在 .tsx 或 .ts 文件中直接使用 Design Token
前端·react.js·visual studio code
sunny_11 小时前
⚡️ vite-plugin-oxc:从 Babel 到 Oxc,我为 Vite 写了一个高性能编译插件
前端·webpack·架构