js实现reqire中的amd,cmd功能 ,大概实现了 路径和模块 引入等重要功能。 本帖属于原创,转载请出名出处。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> </head> <body> <script> /* 原生js 实现 require Cmd Amd 功能 作者:姚观寿 */ (function( root, factory ) { var modules = {}, // 内部require 。 _require = function( deps, callback ) { var args, len, i; // 如果deps不是数组,则直接返回指定module if ( typeof deps === 'string' ) { return getModule( deps ); } else { args = []; for( len = deps.length, i = 0; i < len; i++ ) { args.push( getModule( deps[ i ] ) ); } return callback.apply( null, args ); } }, // 内部define,暂时不支持不指定id. _define = function( id, deps, factory ) { if ( arguments.length === 2 ) { factory = deps; deps = null; } _require( deps || [], function() { setModule( id, factory, arguments ); }); }, // 设置module, 兼容CommonJs写法。 setModule = function( id, factory, args ) { var module = { exports: factory }, returned; if ( typeof factory === 'function' ) { args.length || (args = [ _require, module.exports, module ]); returned = factory.apply( null, args ); returned !== undefined && (module.exports = returned); } modules[ id ] = module.exports; }, // 根据id获取module getModule = function( id ) { var module = modules[ id ] || root[ id ]; if ( !module ) { throw new Error( '`' + id + '` is undefined' ); } return module; }, // 将所有modules,将路径ids装换成对象。 exportsTo = function( obj ) { var key, host, parts, part, last, ucFirst,obj=obj||{}; ucFirst = function( str ) { return str && (str.charAt( 0 ).toUpperCase() + str.substr( 1 )); }; for ( key in modules ) { host = obj; if ( !modules.hasOwnProperty( key ) ) { continue; } parts = key.split('/'); last = ucFirst( parts.pop() ); while( (part = ucFirst( parts.shift() )) ) { host[ part ] = host[ part ] || {}; host = host[ part ]; } host[ last ] = modules[key]; } return obj; }, makeExport = function( ) { // root.__dollar = dollar||''; return exportsTo( factory( root,_define, _require ) ); }, origin, arr, pattern = new RegExp(/(.+)/, "igm"), str = factory.toString().match(pattern); str = str[0].replace(/s/g, ""); str = str.substring(1, str.toString().length - 1); arr = str.split(','); if ( typeof module === 'object' && typeof module.exports === 'object' ) { module.exports = makeExport(); } else if ( typeof define === 'function' && define.amd ) { define([ ], makeExport ); } else { root[arr[3]] = makeExport()||{}; } } //这里最后一个参数是插件名称 这样window 上面就能用了 )(window, function( window,define, require, carousel ) { //定义模块 define('setId',[],function() { return function(id){ this.id=id; } }); //定义模块 define('getId',[],function() { return function(){ console.log("id:"+this.id); } }); //定义模块 define('getAge',[],function() { return function(){ console.log("age:"+this.age); } }); //定义模块 合并 define('merge',['setId','getId','getAge'],function(setId,getId,getAge) { return { getId:getId, setId:setId, getAge:getAge }; }); //定义插件 或者组件构造函数 define('_carousel',['merge'],function(merge) { function _carousel(age){ this.age=age; } _carousel.prototype=merge; return _carousel; }); return require('_carousel'); }); var _carousel=new carousel('25') _carousel.getAge(); _carousel.setId(30); _carousel.getId(); </script> </body> </html>