# SMD同步模块 > 今天小感冒就不写那么多了，就先贴代码 > * 模块文件 ~~~ // 同步加载模块学习 // 定义模块管理单体对象 var F = F || {} F.define = function (str, fn) { /** * @param parts 路径解析 * @param old 祖先 * @param parent 父 * @param this 当前 * @param i 模块层级 * @param len 模块层级长度 * @type {string[]} */ var parts = str.split('.'), old = parent = this, i = len = 0; if(parts[0] === "F") { parts = parts.slice(1) } if(parts[0] === 'define' || parts[0] === "module") { return; } // 遍历路由模块并定义每层模块 for (len = parts.length; i<len; i++) { // 如果父模块中不存在当前模块 if(typeof parent[parts[i]] === 'undefined') { // 声明当前模块 在这里parent 依旧等于old,this parent[parts[i]] = {} } // 缓存下一层级的祖父模块 old = parent // 缓存下一层级父模块 parent 等于 str里定义的模块 parent = parent[parts[i]] } // 如果给定模块方法则定义该模块方法 if (fn) { // 此时i等于parts.length,故减一 old[parts[--i]] = fn () } old['test'] = 'kingEND' console.log("old=", old[parts[i]]) console.log("this=", this) console.log("parent=", parent) console.log("parts=", parts) // 返回模块管理器单体对象 return this } F.module = function () { var args = [].slice.call(arguments), // 获取回调执行函数 fn = args.pop(), parts = args[0] && args[0] instanceof Array ? args[0] : args, // 依赖模块列表 回调函数参数 modules = [], // 模块路由 modIDs = "", // 依赖模块索引 i = 0, // 依赖模块的长度 ilen = parts.length, // 父模块，模块路由层级索引，模块路由层级长度 parent,j,jlen; while (i < ilen) { // 如果是模块路由 if (typeof parts[i] === 'string') { // 设置当前模块父对象 parent = this // 解析模块路由，并屏蔽掉模块父对象 modIDs = parts[i].replace(/^F\./,'').split('.') console.log('modIDs=', modIDs) // 遍历模块路由层级 for (j = 0 ,jlen = modIDs.length; j< jlen; j++) { // 重置父模块 parent = parent[modIDs[j]] || false } console.log(parent) // 将模块添加到依赖模块列表中 modules.push(parent) //如果模块是对象 } else { modules.push(parts[i]) } // 取下一个模块 i++ } fn.apply(null, modules) } ~~~ * 测试文件 ~~~ F.define('string', function () { return { trim: function (str) { return str.replace(/^\s+|\s+$/g) } } }) var result = F.string.trim("测试用例") console.log("result=", result) F.define('dom', function () { var $ = function (id) { $.dom = document.getElementById(id) return $ } $.html = function(html) { if (html) { this.dom.innerHTML = html return this } else { console.log("$=", this.dom.innerHTML) return this.dom.innerHTML } } return $ }) F.dom('test').html() F.define('dom.addclass.removeclass') F.dom.addclass = function (type, fn) { return function (className) { if(!~this.dom.className.indexOf(className)) { this.dom.className += '' + className } console.log(this.dom.className.indexOf(className)) } }(); F.dom.removeclass = function () { return function (className) { if(!~this.dom.className.indexOf(className)) { console.log("removeclass") } } } F.module(['dom', document, F], function (dom, doc) { dom('test').html('new add!') doc.body.style.background = "blue" }) ~~~ ### 总结 * 先说定义模块