AJAX

**1. ** ajax 是什么？有什么作用？
AJAX:asynchronous JavaScript and XML的缩写 ，是一种页面刷新技术。
作用：实现网页的局部刷新，和异步加载，并不需要重新跳转网页进行刷新。
**2. ** 前后端开发联调需要注意哪些事情？后端接口完成前如何 mock 数据？
约定数据：前后端通信时所用的数据，需要传输什么类型的数据
约定接口：确定接口名称和请求的数据格式
使用express来搭建服务器环境，或是运用mock server进行模拟。
**3. **点击按钮，使用 ajax 获取数据，如何在数据到来之前防止重复点击?
1.禁止按钮的默认事件，使用preventDefault();
2.将按钮的设置为disabled
3.使用状态锁

var IsLockUp=false //解锁       

e.addEventListener('click',function(){
   if(IsLockUp){  //点击的时候，锁解开，则执行else，当锁上时，则什么都不执行
     return;}  
   else{  
   IsLockUp=true //发送请求之前上锁
   var xhr=new XMLHttpRequset();
   xhr.onreadystatechange=function(){
   if(xhr.readyState==4){
    //do something
   IsLockUp=false //解锁  ，当数据发过来了，则解锁     
     }
   }
xhr.open();
xhr.send();
}

**4. **封装一个 ajax 函数，能通过如下方式调用。后端在本地使用server-mock来 mock 数据

function ajax(opts){
https://github.com/komolei/demo/tree/master/test2
放在github上了。
}
document.querySelector('#btn').addEventListener('click', function(){
ajax({
url: '/login', //接口地址
type: 'get', // 类型， post 或者 get,
data: {
username: 'xiaoming',
password: 'abcd1234'
},
success: function(ret){
console.log(ret); // {status: 0}
},
error: function(){
console.log('出错了')
}
})
});
**5. **实现加载更多的功能，效果范例112，后端在本地使用server-mock来模拟数据
https://github.com/komolei/demo/tree/master/test3