Ajax 实践

一、ajax 是什么？有什么作用？

Ajax（Asynchronous JavaScript and XML），异步 JS 和 XML。通过使用 Ajax ， 网页程序能够快速地将渐步更新呈现在用户界面上，不需要重载（刷新）整个页面。这使得程序能够更快地回应用户的操作。而所谓异步，就是在数据请求过程中，需要等待结果，为了不浪费这部分时间（也是为了又更好的交互），而采取先执行后续代码，直到请求返回收到后，再处理结果的策略。

刚开始的时候以 XML 格式传输数据为主，但由于 JSON 格式又诸多优势，使得用 JSON 格式传输数据变得更加流行。因此， Ajax 的主要作用就是可以在异步且不刷新当前页面的前提下，更新数据。

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

前后端开发联调，其实就是对接口，因此，需要处理的事情就有：

1. 约定接口名称、请求类型
2. 约定接口参数、数据类型
3. 整合文档

那么如何 mock （模拟真实数据）数据呢？

1. 直接写假数据在静态页面，简单粗暴。缺点：耦合程度高，解耦影响大。
2. 使用别人线上提供的接口服务，如 easy-mock。
3. 自己搭建后端环境，制作 mock-server，如 Node.js 提供路由，再用工具生成随机 JSON 数据。这样后端接口来时，直接更换 host 就行了，零成本。

参考：你是如何构建 Web 前端的 Mock Server | 知乎

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

1. 点击按钮后，disabled 按钮，直到 ajax 数据返回，或者其他条件达成后，取消限制。
2. 函数节流，利用定时器延迟请求发送，再利用定时器清除来防止短时间内的多次点击。

参考：怎样防止重复发送 Ajax 请求？ | 知乎

四、实现加载更多的功能，效果范例。

在线预览 | GitHub