题目1： ajax 是什么？有什么作用？
Ajax是Asynchronous JavaScript and XML的缩写，这一技术能够向服务器请求额外的数据而无需卸载整个页面，会带来良好的用户体验。
AJAX 在浏览器与 Web 服务器之间使用异步数据传输（HTTP 请求）从服务器获取数据
这里的异步是指脱离当前浏览器页面的请求、加载等单独执行，这意味着可以在不重新加载整个网页的情况下，通过JavaScript发送请求、接受服务器传来的数据，然后操作DOM将新数据对网页的某部分进行更新，使用Ajax最直观的感受是向服务器获取新数据不需要刷新页面等待了
题目2： 前后端开发联调需要注意哪些事情？后端接口完成前如何 mock 数据？
前后端开发联调中需要注意的是数据的传输，即需要事先协议好前端传入后台的请求，后端穿回前端的数据，浏览器发出请求即服务器发回数据，这是前后端沟通的渠道。
因此，在后端接口完成前，我们可以使用node.js中server-mock在本地模拟后端，虚拟出后端传回来的数据，前端对数据进行运行处理，以检测前端网页的功能。
题目3：点击按钮，使用 ajax 获取数据，如何在数据到来之前防止重复点击?
防止重复点击有两种思路：
1.在服务器数据到来之前，忽略用户的重复点击；
2.服务器对用户的重复请求进行判断，如果请求相同，则只返回一组数据。
这两种思路分别是对应前端和后端。
思路1就是在前端对用户的操作进行判断，类似于之前的密码验证，能有效阻止90%的不当操作，更为有效的提高服务器速率。
前端对重复点击进行判断，只需要给发送的请求添加一个状态锁的属性，在服务器数据到来之前，状态锁为false，来之后为true，然后在浏览器发送请求前对状态锁进行判断。
<script>
var btn = document.querySelector('.layout > a')
var ct = document.querySelector('#show')
var isLoading = false;//状态锁设置初始状态
function getrRndomint(min,max){
return Math.floor(Math.random()*(max-min+1)+min)
}
btn.addEventListener('click',function(e){
e.preventDefault();
var xhr = new XMLHttpRequest()
if (isLoading) {
return ;
};//对状态进行判断，阻止重复点击
xhr.onreadystatechange = function(){
if(xhr.readyState === 4 && (xhr.status === 200 || xhr.status === 304)){
var data = JSON.parse(xhr.responseText)
ct.innerHTML= '';
for (var i = 0; i< data.length; i++) {
var image = document.createElement('img')
image.src = data[i]
ct.appendChild(image)
}
console.log(data)
}
isLoading = false;//收到后台数据，状态锁为false
}
xhr.open('get', '/picture?number=' + (getrRndomint(3,6)), true)
xhr.send()
isLoading = true;// 发送请求后未收到后台数据，状态锁为true
})
</script>
