zoukankan      html  css  js  c++  java
  • JavaScript中模块“写法”

    在JavaScript模块到底是什么,能用代码具体展现一下吗?

    其实上一篇已经写了一段事件模块代码

    event = function() {
    	// do more
    	return {
    		bind: function() {},
    		unbind: function() {},
    		trigger: function() {}
    	};	
    }();
    

    这能代表“模块”吗?这就是一个JS对象啊,以为有多么深奥。

    是的,JavaScript中模块多数时候被实现为一个对象。这么看来,多数时候我们都写过“模块”(但没有在整个项目中应用模块化思想)。或许每个人写模块的方式(风格)还不同。比如上面的事件模块是一个匿名函数执行,匿名函数中封装了很多代码,最后通过return返回给event变量,这个event就是事件模块的接口。

    又如jQuery,它也是一个匿名函数执行,但它并不返回接口对象。而是将自己暴露给window对象。

    (function(window){
    	// ..
    	// exports
    	window.jQuery = window.$ = jQuery;
    })(window);
    

    再如SeaJS,它一开始就将接口公开了

    /**
     * Base namespace for the framework.
     */
    this.seajs = { _seajs: this.seajs };
    

    后续是很多的匿名函数执行给变量seajs添加很多工具方法。注意,这里的this在浏览器环境指window对象,如果是定位在浏览器中,这个this也可以去掉。就象Ext

    Ext = {
        /**
         * The version of the framework
         * @type String
         */
        version : '3.1.0'
    };
    

    呃,我们已经看到了四种方式写模块(把jQuery,SeaJS,Ext看成模块,呃很大的模块)。

    哪一种更好呢? 哪一种更适合在浏览器端呢?纯从代码风格上说,是萝卜白菜各有所爱。只要我们运用了“模块化”的思想来开发就行了。

    但如果有一种统一的语法格式来写模块岂不是更好,就不会出现各用各的风格来写模块而使代码乱糟糟。

    这就是目前的现状,开发者强烈需要一种统一的风格来写模块(最好是语言内置了)。这时一些组织出现了,最具代表的如CommonJSAMD。此外ECMAScript也开始着手模块的标准化写法。

    无论它们提供什么样的写法,我们需要的仅仅是

    • 将一些零散代码封装成一个有用的单元(encapsulate)
    • 导出模块的接口API(exports)
    • 方便友好引用其它模块(dependency)

     

    服务器端的JSer是幸运的,它有Node.js,Node.js遵循了一个称为CommonJS的规范。CommonJS其中就有对写模块的标准化。当然模块化只是其中的一部分而已。具体来说Node.js实现了

     
    模块化方面它实现了Modules/1.0(已经更新到1.1.1)。
     
    以下是node中是写模块的一个示例。
     
    math.js
    exports.add = function() {
        var sum = 0, i = 0, args = arguments, l = args.length;
        while (i < l) {
            sum += args[i++];
        }
        return sum;
    };
    

    increment.js

    var add = require('math').add;
    exports.increment = function(val) {
        return add(val, 1);
    };
    

    main.js,该文件为入口文件

    var inc = require('increment').increment;
    var a = 1;
    inc(a); // 2

    这就写了一个math、increment、main模块。math提供了add方法来实现数字相加。increment模块依赖于math模块,它提供increment方法实现相加。main获取到increment方法,执行相加操作。

    以上代码示例可以看到

    1. node要求一个js文件对应一个模块。可以把该文件中的代码想象成是包在一个匿名函数中,所有代码都在匿名函数中,其它模块不可访问除exports外的私有变量
    2. 使用exports导出API
    3. 使用require加载其它模块
     
    CommonJS module基本要求如下
    1. 标示符require,为一个函数,它仅有一个参数为字符串,该字符串须遵守Module Identifiers的6点规定
    2. require方法返回指定的模块API
    3. 如果存在依赖的其它模块,那么依次加载
    4. require不能返回,则抛异常
    5. 仅能使用标示符exports导出API
     

    Modules/1.1较1.0仅增加了标示符module,require函数增加了main和paths属性。而仔细比对1.1与1.1.1后发现除了格式调整了下几乎没有变化。

    相关:

    Modules

    Modules/1.0

    Modules/1.1

    Modules/1.1.1

    下一篇:Node.js模块格式在浏览器中的尝试

  • 相关阅读:
    requirejs 初探
    jquery版本
    querystring
    git 使用记录
    nodejs mocha 单元测试
    Jquery之promise
    nodejs express命令问题
    Sublime Text 资料整理
    SQL SERVER 2008 R2 自动备份并删除过期备份数据
    无法编辑的word解密
  • 原文地址:https://www.cnblogs.com/snandy/p/2378441.html
Copyright © 2011-2022 走看看