Day 06 JavaScript/Rails AJAX

阿修的说文解字

AJAX 的全名是 Asynchronous JavaScript and XML
Asynchronous JavaScript 昨天介绍过了，就是 JS 的非同步处理。
XML 是一种标记语言，一种用来传输以及储存资料的格式，不过现在网页很少用到了，
现在大部分都是使用 JSON 的格式来传输、储存，而掺在一起就可以做成 AJAX 啦。
简单解释 AJAX 就是原本传送资料需要换页才能做到，现在可以透过 JS 帮你传送资料，而且不会换页。
利用非同步处理的方式来传送资料可以让使用者的体验变好。
当你在浏览网页时，点击网页上的超连结，网页不是「整张」更新而是只有「局部」更新，
那麽该网页就很有可能有采用了AJAX的方法。

范例

1. 当你在 IG 上按赞或是留言时，不会跳转整个画面，而是只更新那则贴文的状态。
2. Rails 的 Turbolinks 就是使用 AJAX 来换页的，实际上他只抽换 HTML body 的内容，并非整个换页。
3. 在 Rails 的写法(1)：使用 js.erb 档来从局部渲染页面(render partial)，而不是跳转到其他页面(redirect_to)。
4. 在 Rails 的写法(2)：可以藉由 XHR、fetch、axios、Rails.ajax 来打 API，让网页能局部更新。

非同步请求资料的方法

每次在 IG 上点击按赞都是发送一个 XHR = AJAX。
XHR 的全名是 XMLHttpRequest，是一种古老的 API。
使用 XHR 物件可以在自己网页上读取远端的资料，最常见的用途是在注册页面验证「用户名」及「信箱」是否被重复使用。
除了 XHR 以外，fetch、axios、Rails.ajax 都是非同步请求资料的方法。
XHR 是最原始的方法，使用起来也比较繁琐，需要设定很多值。
fetch 会比 XHR 好用一点，而 axios 跟 ajax 又比 fetch 更好用。

参考：
[1][JS] AJAX 笔记
[2]Ajax