AMD代码示例:
1、模块定义:
新建myAmd.js文件,
define(function(){//因为myAmd.js文件对其它模块没有依赖,所以,不用写第一个参数
var name = 'Byron';
var age = 100;
function printName(){
console.log(name);
}
function setAge(transAge){
age = transAge;
}
function getAge(transAge){
return age;
}
return {
printName: printName,
setAge:setAge,
getAge:getAge
};
});
2、引入模块(使用模块):
新建demo.html文件,
<script type="text/javascript">
// 加载模块
require([‘myAmd’], function (my){ //模块加载完成后执行的函数
my.printName();
my.setAge(80);
console.log(my.getAge());
});
</script>
3、如果定义的模块对其它模块有依赖关系,则需要在定义时,写上第一个参数。
如:
myAmd.js文件代码
define([‘js/jquery.min’],function(){ // myAmd模块依赖jQuery,则需要写上jQuery模块
var name = 'Byron';
var age = 100;
function show(){
alert($("#btn").val());
}
return {
show : show
};
});
CMD
n在项目目录下建立js文件夹,放上sea.js文件
n定义模块
在js目录下建立moduleDemo.js代码
define(function(require,exports,module){
var id="";
var name = "“;
exports.setId = function(transId){
id = transId;
}
exports.setName = function(transName){
name = transName;
}
exports.showInfo = function(){
alert("我是"+name+",我的身份证号码是:"+id);
}
})
n加载模块
建立demo01.html
<body>
身份证:<input id="userId" type="text" /><br/>
姓 名:<input id="userName" type="text" /><br/>
<input type="button" id="btnSave" value="保存信息" />
</body>
<script type="text/javascript" src="js/jquery-1.8.3.min.js" ></script>
<script type="text/javascript" src="js/sea.js"></script>
<script type="text/javascript">
seajs.use([" moduleDemo"],function(m){
$("#btnSave").click(function(){
m.setId($("#userId").val());
m.setName($("#userName").val());
m.showInfo();
});
});
</script>