[Node.js] require背后的故事

前言

熟悉Node.js的肯定对下面的代码熟悉

var http = require('http');

这段代码很好理解,就是加载一个http模块。但是你有没有想过为什么要这么写?这其中的缘由是什么呢?下面将一一道来。

JavaScript模块化

起因

开发中,一般把全局变量放到一个对象里,以防过多的全局变量。比如:

var global={
	$:function(id) { 
		return document.getElementById(id); 
	};

但是有可能你会引用其他的js类库,他们也会占用这个全局变量,这样一来就会引起全局变量的冲突;

我经常会用到一个js类库需要引用另一个js类库这种情况。最典型的是由jQuery衍生的一些插件。如果没有引用jQuery类库或者引用顺序错误都会导致应用出错。而且每个页面都需要添加引用项,当你有一天不需要这些引用项时,还得一个一个移除,而且非常容易出错,有可能有些页面还需要这些引用项,你忘记了就会导致这个页面出错,这就是类库依赖问题;

上面的问题该怎么解决呢?这时模块化编程出现了。它很好的解决了上面所述的 问题。下面先说一说JavaScript怎么进行模块化编程。

模块化

JavaScript不是一种模块化编程语言,它不支持“类”(class)更别说模块(module)了(现在ECMAScript 6标准已经正式发布,支持“类”和“模块”。但我更想说的是ES6之前JavaScript是怎么做的,况且完全应用ES6还需要一段时间,现在业内做法是用ES6编写然后再转换成ES5)。JavaScript社区做了很多努力,在现有环境中,实现“模块”的效果。下面将一步步探究“模块化”怎么写。

  1. 原始写法
    模块就是实现特定功能的一组方法。只要把不同的函数(以及记录状态的变量)简单地放在一起,就算是一个模块。
function m1(){
	//todo something
}
function m2(){
	//todo something
}

上面的函数m1和m2组成一个模块。使用的时候,直接调用就行了。这种做法的缺点很明显:“污染”了全局变量,无法博癌症不与其他模块发生变量名冲突,而且模块成员之间看不出直接关系。

  1. 对象写法

为了解决上面的缺点,可以吧模块写成一个对象,所有模块成员都放到这个对象里面。

var odule=new Object({
	_count:0,
	m1:function(){ //…… },
	m2:function(){ //…… },
});

上面的函数m1和m2,都封装在module对象里。使用的时候,就调用这个对象的属性就可以了

module.m1();

但是,这样的写法会暴露所有的模块成员,内部状态可以被外部改写。比如,外部代码可以直接改变内部的计数器的值

module._count=10;
  1. 立即执行函数写法

使用立即执行函数(Immediately-Invoked Function Expression, IIFE),可以达到不暴露私有成员的目的。

var module=(function(){
	var _count=0;
	var m1=function(){ //…… };
	var m2=function(){ //…… };
	return {m1:m1, m2:m2};
})();

使用上面的写法,外部代码无法读取内部的_count变量。

 console.info(module._count) //undefined 

IIFE就是JavaScript模块的基本写法。下面将再对这种写法进行加工。

  1. 放大模式

如果一个模块很大,必须分成几个部分,或者模块需要继承另一个模块,这时就有必要采用“放大模式(augmentation)”。

var module1=(function(mod){
	mod.m3=function(){
		//……
	};
	return mod;
})(module);

上面的代码为module模块添加了一个新方法m3,然后返回新的module模块

  1. 宽放大模式(Loose augmentation)

在浏览器环境中,模块的各个部分通常是从网上获取的,有时无法知道哪个部分会先加载。如果采用上面4的写法,第一个执行的部分有可能加载一个不存在的空对象,这时就要采用“宽放大模式”。

var module1=(function(mod){
	//……
	return mod;
})(window.module||{});

与“放大模式”相比,“宽放大模式”就是“立即执行函数”的参数可以是空对象。

  1. 输入全局变量

独立性是模块的重要特点,模块内部最好不与程序的其他部分直接交互。为了在模块内部调用全局变量,必须显示地将其他变量输入模块。

var module=(function($,YAHOO){
	//……
})(jQuery,YAHOO);

上面的module模块需要使用jQuery和YUI库,就把这两个库(其实是两个模块)当做参数输入module。这样做除了保证模块的独立性,还使得模块之间的依赖关系变得明显。

模块规范

因为有了模块,我们就可以很方便的使用别人的代码,想要什么功能,就加在什么模块。

但是,这样做有一个前提,那就是大家必须以同样的方式编写模块,否则你有你的写法,我有我的写法,岂不是乱套了,于是乎模块化规范就出现了。

目前,同行的JavaScript模块化规范有CommonJS、AMD和CMD。下面先说一下CommonJS

CommonJS

CommonJS是服务器端模块化的规范,Node.js就是参照CommonJS规范来实现的。这也就是文章开头为什么要用require的原因

在CommonJS中,有一个全局性方法require(),用于加在模块。比如: var url = require('url'); console.log(url);

CommonJS加载模块是同步(synchronous)的,所以只有加载完成才能执行后面的操作。像Node.js主要用于服务器的变成,加载的模块文件一般都已经存在本地磁盘了,所以加载起来比较快,不用考虑异步加载的方式,所以CommonJS规范比较适用。但如果是浏览器环境,从服务器上加载模块,很可能由于网络原因导致加载时间很长,整个应用就会停在那里等待。这时就得采取异步(asynchronous)加载模式。于是乎就有了AMD和CMD的异步加载方案。

AMD

AMD是“Asynchronous Module Definition”的缩写,意思就是“异步模块定义”。它采用异步方式加载模块,模块的加载不影响它后面语句的运行。所有依赖这个模块的语句,都定义在一个回调函数中,等到加载完成之后,这个回调函数才会运行。

AMD也采用require语句加载模块,但是不同于CommonJS,它要求两个参数:

 
define(["module"],callback);

第一个参数[module]是一个数组,里面的成员就是要加载的模块;第二个参数callback就是加载成功后的回调函数。如果把上面的代码改写成AMD形式,就是下面这样的:

define(["url"], function(require) {
	var url = require("url");
	console.log(url);
})

实现AMD代表性的库有Require.js和curl.js

CMD

CMD是“Common Module Definition”的缩写,意思是“通用模块定义”。CMD和AMD一样,都是异步加载模块的方式。但是它们又有些区别:

  1. 对于依赖的模块,AMD是提前执行,CMD是延迟执行。不过Rquire.js从2.0开始也支持延迟执行。CMD推崇 as lazy as possible
  2. CMD推崇依赖就近,AMD推崇依赖前置
//CMD
define(function(require,exports,module){
	var a=require('./a');
	a.doSomething();
	var b=require('./b');//依赖就近书写
	b.doSomething();
});
//AMD
define(['./a','./b'],function(a,b){ // 依赖必须一开始就写好
	a.doSomething();
	b.doSomething();
});

从上面代码可以看出,CMD更接近于CommonJS规范。

参考:
http://www.ruanyifeng.com/blog/2012/10/javascript_module.html
ps:第一次用markdown写博客,感觉挺爽的,就是博客园显示效果不太好

posted on 2016-08-16 17:09  Khadron  阅读(871)  评论(1编辑  收藏

导航