前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >JavaScript模块化来龙去脉

JavaScript模块化来龙去脉

作者头像
城市中的游牧民族
发布2019-02-21 10:42:39
3390
发布2019-02-21 10:42:39
举报
文章被收录于专栏:前端真相前端真相

script

IIFE(立即执行函数表达式)

命名空间

AMD/CMD

var Modules = (function ModulesManager() {
		var modules = {};
		function define(name,deps,impl) {
			for (var i = 0; i < deps.length; i++) {
				deps[i] = modules[deps[i]];
			}
			modules[name] = impl.apply(impl,deps);
		}
		
		function getModule(name) {
			return modules[name];
		}

		return {
			define: define,
			getModule: getModule
		};
	 })();

	Modules.define('m1',[],function f1() {
		function hello(argument) {
			return "hello"+argument;
		}
		return {
			hello:hello
		};
	})
	Modules.define('m3',[],function f1() {
		function ff(argument) {
			return "ff"+argument;
		}
		return {
			ff:ff
		};
	})
	Modules.define('m2',['m1','m3'],function f2(argument,ff) {
		debugger;
		function awesome() {
			console.log(argument)
			console.log(argument.hello("finit"))
			console.log(ff.ff("finit"))

		}
		return {
			awesome:awesome
		};
		
	})

	var m2 =  Modules.getModule('m2');
	m2.awesome();

CommonJS 与 Node.js 模块系统

require UMD(universal module definition)

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

IIFE(立即执行函数表达式)在此有应用,将需要执行的函数放在第二位,示例代码如下:

(function iife(fn){
	fn(window);
})(function def(global){
	......
);

ES6 Module 标准

在这里插入图片描述
在这里插入图片描述
本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2018年08月11日,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • script
  • IIFE(立即执行函数表达式)
  • 命名空间
  • AMD/CMD
  • CommonJS 与 Node.js 模块系统
  • require UMD(universal module definition)
  • ES6 Module 标准
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档