ajax

题目1： ajax 是什么？有什么作用？

含义：脚本发起HTTP通信

作用：传输数据到服务器，监听状态码实现服务器返回结果，在整个网页中，数据的发送响应过程中不会影响网页其他位置的操作，这个过程实现了异步操作，节省用户表单验证时间，提高用户体验。
优点：
（1）无刷新更新数据。
AJAX最大优点就是能在不刷新整个页面的前提下与服务器通信维护数据。这使得Web应用程序更为迅捷地响应用户交互，并避免了在网络上发送那些没有改变的信息，减少用户等待时间，带来非常好的用户体验。

（2）异步与服务器通信。
AJAX使用异步方式与服务器通信，不需要打断用户的操作，具有更加迅速的响应能力。优化了Browser和Server之间的沟通，减少不必要的数据传输、时间及降低网络上数据流量。

（3）前端和后端负载平衡。
AJAX可以把以前一些服务器负担的工作转嫁到客户端，利用客户端闲置的能力来处理，减轻服务器和带宽的负担，节约空间和宽带租用成本。并且减轻服务器的负担，AJAX的原则是“按需取数据”，可以最大程度的减少冗余请求和响应对服务器造成的负担，提升站点性能。

（4）基于标准被广泛支持。
AJAX基于标准化的并被广泛支持的技术，不需要下载浏览器插件或者小程序，但需要客户允许JavaScript在浏览器上执行。随着Ajax的成熟，一些简化Ajax使用方法的程序库也相继问世。同样，也出现了另一种辅助程序设计的技术，为那些不支持JavaScript的用户提供替代功能。

（5）界面与应用分离。
Ajax使WEB中的界面与应用分离（也可以说是数据与呈现分离），有利于分工合作、减少非技术人员对页面的修改造成的WEB应用程序错误、提高效率、也更加适用于现在的发布系统。

缺点：

（1）浏览器历史记录的遗失： 在使用AJAX对页面进行改变后，由于并没有刷新页面，没有改变页面的访问历史，当用户想要回到上一个状态时，无法使用浏览器提供的后退。

（2）AJAX的安全问题： AJAX的出现就像建立起了一直通服务器的另一条通道，容易遭受到一些攻击。

题目2 前后端开发联调需要注意哪些事情？后端接口完成前如何 mock 数据？

１．约定数据：约定好页面需要的数据和数据类型
２． 约定接口：
(1)约定接口的名称。
(2)约定请求的参数。
(3)约定响应的的格式，比如：成功后返回什么数据，响应失败返回什么内容。
３．将约定好的东西整理成接口文档和规范
mock数据：参照接口相关文档，使用假数据来验证我们制作的页面响应和接口是否正常。可以搭建php本地服务器用，php写脚本提供临时数据；
也可写js脚本模拟数据，利用server-Mock完成对页面和接口的测试。

题目3：点击按钮，使用 ajax 获取数据，如何在数据到来之前防止重复点击?

var isLoading = false;//状态变量：用于在数据到来之前防止重复点击
btnNode.addEventListener('click', function() {
    if(isLoading) return;//正在加载则终止
    var text = textNode.value;
    var xhr = new XMLHttpRequest();
    xhr.open('get', '/test?text=' + text, true);
    xhr.send();
    xhr.onreadystatechange = function(){
        if (xhr.readyState === 4 && xhr.status === 200) {
            var content = xhr.responseText;
            console.log(content);
            contentNode.innerText = content;
            isLoading = false;//加载成功则重置状态变量
        }
    }
    isLoading = true;//加载开始时改变状态变量的值
});

题目4：实现加载更多的功能，效果范例372，后端在本地使用server-mock来模拟数据

http://js.jirengu.com/yorayawoyi/2/edit