Ajax,赋予前端新活力

何宏伟

Asynchronous & Synchronization

[嵌牛导读]

当你编写代码遇到同步 | 异步时， 差不多这个时候Google就该给你你想要的一推名词解释，和排名靠前的Ajax - [ Asynchronous Javascript And XML ]。只要你耐心的看下去，虽然无法教会你在实际应用中灵活区分同步操作 | 异步操作，但我一定会让你明白什么是同步操作，什么是异步操作。

[嵌牛鼻子]

同步，异步，回调(callback)，Ajax，过程

[嵌牛提问]

Parallel

• 当你意识到你要解决的问题顺着过程化的思维方式行不通的时候，有没有去思考同步和异步的问题？
• 当你使用Ajax的时候到底发生了什么？为什么Ajax提高了执行效率？

[嵌牛正文]

有如下示例：

就餐时间到了

• 就餐时间

为了不饿肚子，及时的吃到妈妈做的午饭。当妈妈在做午饭的时候，你是如何确定你该吃午饭的时间？

• 搜索引擎

打开google，有没有发现当你点击输入检索内容时，每一个字都会有相应的检索提示，在输入框下方弹出，很大的概率弹出的提示中前几个就是你想要找的.

0x01. 同步和异步

我们尝试着这样来就餐：

• 方式一

你站在厨房看着妈妈做饭，一刻也不松懈的等候在妈妈身边，等到饭菜熟了就开始吃饭。

• 方式二

你跑到厨房告诉妈妈，“妈妈，等你做好了饭菜记得叫我吃饭哦！”，你在房间看着电视，玩着游戏，不一会儿听到妈妈喊你吃饭，你才起身去填满早已饥肠辘辘的躯体。

相信你已经看懂了两种方式的不同之处。方式一你可以吃到可口的饭菜，但缺点是你什么也不能干，必须守在妈妈的身边，方法二则大不相同，安心的坐在房间做自己的事，你只需要等到妈妈叫你，然后去吃饭，两种方式，不同的享受。

同步，就是在系统的执行过程中一些过程需要在时间上呈现一致性，执行操作有时间单向性（操作按步骤执行不可跳转，逆转）或者接续性（当前续步骤完成才能执行当前步骤）
异步，就是系统执行过程中操作的单向性可控制，接续性操作“可并行”，“可并行”依赖于可控制单向性操作（回调）。

这样，就不难看出方式一属于同步操作，方式二属于异步操作，你也可以分析出搜索引擎对于你的搜索内容进行实时分析，实时回应但丝毫不影响操作体验，那么这种实时操作是如何做到的，继续往下看。

0x02. Ajax做了什么

Ajax 不是一种新的编程语言，而是一种用于创建更好更快以及交互性更强的Web应用程序的技术，作为异步操作，Ajax堪称典型代表。

Ajax通过Javascript向服务器发送HTTP请求，在等待服务器回应的同时可以继续执行其他操作不阻塞交互逻辑。Ajax能够使得从服务端获取数据后不需要刷新整个页面，可以做到只动想动的，节省了网络请求的带宽占用，处理时间的高效保证了执行率的高效，减轻了服务端的压力。

搜索引擎正是使用Ajax，来实时的将用户的搜索内容提交到服务器，却丝毫不卡顿，提升用户体验的同时提升了整个系统的容灾能力。

---

END