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。

相关推荐
@大迁世界4 分钟前
07.React 中的 createRoot 方法是什么?它具体如何运作?
前端·javascript·react.js·前端框架·ecmascript
January120712 分钟前
VBen Admin Select 选择框选中后仍然显示校验错误提示的解决方案
前端·vben
. . . . .19 分钟前
前端测试框架:Vitest
前端
xiaotao13131 分钟前
什么是 Tailwind CSS
前端·css·css3
炸膛坦客32 分钟前
单片机/C/C++八股:(二十)指针常量和常量指针
c语言·开发语言·c++
兑生1 小时前
【灵神题单·贪心】1481. 不同整数的最少数目 | 频率排序贪心 | Java
java·开发语言
颜酱1 小时前
DFS 岛屿系列题全解析
javascript·后端·算法
战南诚2 小时前
VUE中,keep-alive组件与钩子函数的生命周期
前端·vue.js
发现一只大呆瓜2 小时前
React-彻底搞懂 Redux:从单向数据流到 useReducer 的终极抉择
前端·react.js·面试