layui 的模块定义和加载方法 (layui.define 和 layui.use)

这是一个简易版的 layui 模块定义和加载模块封装

layui github: https://github.com/layui/layui

(function () {
  "use strict";

  // 定义 layui 类
  var Layui = function () {
    this.v = "1.0.9";
  };

  // 定义模块
  Layui.prototype.define = function (deps, factory) {
    // 将模块加载到全局变量 layui 中
    var setApp = function (app, exports) {
      window.layui[app] = exports;
    };

    if (typeof deps === "function") {
      factory = deps;
      deps = [];
    }

    factory(setApp);
    return this;
  };

  // 加载模块
  Layui.prototype.use = function (apps, callback, exports) {
    if (typeof apps === "string") {
      apps = [apps];
    }

    // 导出的模块
    exports = exports || [];

    // 获取第一个需要加载的模块
    var item = apps[0];

    // 加载模块方法
    function onCallback() {
      exports.push(window.layui[item]);
      callback.apply(window.layui, exports);
    }

    // 如果要加载的模块大于1个，则递归调用 use 方法来继续加载后续模块
    if (apps.length > 1) {
      this.use(apps.slice(1), callback, exports);
    } else {
      // 调用加载模块的方法
      onCallback();
    }
  };

  // 导出 layui 类到全局变量
  window.layui = new Layui();
})();

// 后续就可以直接使用 layui.define 和 layui.use 了

// 定义一个 jquery 模块
layui.define("jquery", function (exports) {
  // 这里可以写一些 jquery 插件的定义
  var obj = {
    test: function (msg) {
      console.log(msg);
    },
  };

  // 导出 jquery 对象
  exports("jquery", obj);
});

layui.use("jquery", function ($) {
  // 这里就可以直接使用自己定义的 jquery 里的 test 方法了
  $.test("<h1>Hello, layui!</h1>");
});