zoukankan      html  css  js  c++  java
  • 初始AMD和Common.js

    其实就是为了多个库可以良好的合作的指定的规范

    AMD---require.js Asynchronous Module Definition (AMD)
    Here’s module foo with a single dependency on jquery:

    //    filename: foo.js
    define(['jquery'], function ($) {
        //    methods
        function myFunc(){};
    
        //    exposed public methods
        return myFunc;
    });
    

    第一部分是定义一个存放依赖的数组,第二部分是放当依赖可以被正常执行之后的回调函数

    //    filename: foo.js
    define(['jquery', 'underscore'], function ($, _) {
        //    methods
        function a(){};    //    private because it's not returned (see below)
        function b(){};    //    public because it's returned
        function c(){};    //    public because it's returned
    
        //    exposed public methods
        return {
            b: b,
            c: c
        }
    });
    

    多个依赖库的话,注意回调函数的参数,要对应好,如果我们将$换成$$的话,之后使用就只能使用$$的


    Common.js---和node的写法很像

    //    filename: foo.js
    
    //    dependencies
    var $ = require('jquery');
    
    //    methods
    function myFunc(){};
    
    //    exposed public method (single)
    module.exports = myFunc;
    
    //    filename: foo.js
    var $ = require('jquery');
    var _ = require('underscore');
    
    //    methods
    function a(){};    //    private because it's omitted from module.exports (see below)
    function b(){};    //    public because it's defined in module.exports
    function c(){};    //    public because it's defined in module.exports
    
    //    exposed public methods
    module.exports = {
        b: b,
        c: c
    };
    

    UMD:Universal Module Definition

    (function (root, factory) {
        if (typeof define === 'function' && define.amd) {
            // AMD
            define(['jquery'], factory);
        } else if (typeof exports === 'object') {
            // Node, CommonJS-like
            module.exports = factory(require('jquery'));
        } else {
            // Browser globals (root is window)
            root.returnExports = factory(root.jQuery);
        }
    }(this, function ($) {
        //    methods
        function myFunc(){};
    
        //    exposed public method
        return myFunc;
    }));
    
    (function (root, factory) {
        if (typeof define === 'function' && define.amd) {
            // AMD
            define(['jquery', 'underscore'], factory);
        } else if (typeof exports === 'object') {
            // Node, CommonJS-like
            module.exports = factory(require('jquery'), require('underscore'));
        } else {
            // Browser globals (root is window)
            root.returnExports = factory(root.jQuery, root._);
        }
    }(this, function ($, _) {
        //    methods
        function a(){};    //    private because it's not returned (see below)
        function b(){};    //    public because it's returned
        function c(){};    //    public because it's returned
    
        //    exposed public methods
        return {
            b: b,
            c: c
        }
    }));
    
  • 相关阅读:
    (转)ANT与RTS的结合
    (转)[Android] 利用 ant 脚本修改项目包名
    (转)MULTIPLE TARGETS FROM ONE ANDROID SOURCE (THE BETTER WAY)
    JS+CSS打造网站头部蓝色简约可自动显示/隐藏的导航菜单
    CSS打造很棒的黑色背景下的导航菜单
    老外JS实现的Infinite Menus
    【荐】JavaScript打造的无限级可刷新树型折叠菜单
    【荐】纯CSS打造超酷的圆角菜单,鼠标移过向上/向下扩张
    来自阿里巴巴网的滑动TAB导航特效
    适用于商城JS实现的可折叠的商品分类导航
  • 原文地址:https://www.cnblogs.com/cyany/p/9175378.html
Copyright © 2011-2022 走看看