前言
jQuery确实是一个挺好的轻量级的JS框架，能帮助我们快速的开发JS应用，并在一定程度上改变了我们写JavaScript代码的习惯。
废话少说，直接进入正题，jQuery的ajax方法非常好用，这么好的东西，你想拥有一个属于自己的ajax么？接下来，我们来自己做一个简单的ajax吧。
首先需要一个配置文件
功能来引入一个模板库
* query字符串可以当做一个参数传递进来
* 例如： /users/{{query}}和{query:'?name=jisika&sex=1'}
* @Author Wdd
* @DateTime 2017-03-13T19:42:58+0800
* @param {[type]} tpl [description]
* @param {[type]} data [description]
* @return {[type]} [description]
*/
render: function(tpl,data){
var re = /{{([^}]+)?}}/;
var match = '';
while(match = re.exec(tpl)){
tpl = tpl.replace(match[0],data[match[1]]);
}
return tpl;
}
};
/**
- [setHeader 暴露设置头部信息的方法]
- 有些方法需要特定的头部信息，例如登录之后才能获取sesssionId,然后访问所有的接口时，必须携带sessionId
- 才可以访问
- @Author Wdd
- @DateTime 2017-03-13T10:34:03+0800
- @param {[type]} headers [description]
*/
Api.pt.setHeader = function(headers){
headers = headers;
};
/** - [fire 发送ajax请求，this会绑定到每个接口上]
- @Author Wdd
- @DateTime 2017-03-13T19:42:13+0800
- @param {[type]} pathParm [description]
- @param {[type]} payload [description]
- @return {[type]} [description]
*/
function fire(pathParm,payload){
var url = util.render(this.path,pathParm);
return util.ajax(url,this.method,payload);
}
/** - [for 遍历所有接口]
- @Author Wdd
- @DateTime 2017-03-13T19:49:33+0800
- @param {[type]} var i [description]
- @return {[type]} [description]
*/
for(var i=0; i < Config.pathList.length; i++){
Api.pt[Config.pathList[i].name] = {
path: Config.basePath + Config.pathList[i].path,method: Config.pathList[i].method,fire: fire
};
}
return new Api();
}
试用一下
<Meta charset="utf-8">
优点与扩展
[优点]：类似与promise的回调方式
[扩展]：当前的ajax 的contentType我只写了json，有兴趣可以扩展其他的数据类型
[缺点]：没有对函数参数进行校验
总结
以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作具有一定的参考学习价值，如果有疑问大家可以留言交流，谢谢大家对编程之家的支持。
原文链接：https://www.f2er.com/jquery/34604.html