# Ajax筆記

## 前言
AJAX 是「Asynchronous JavaScript and XML」（非同步的 JavaScript 與 XML 技術）的縮寫，簡單說就是網頁不用重新整理，就能即時地透過瀏覽器去跟伺服器溝通，撈出資料。

伺服器對 AJAX 資料請求回應通常是以三種資料格式其中之一（HTML、XML、JSON），最常與 Javascript 做搭配就是 JSON。

（所以老師一開始才要過場JSON的程式碼寫法）

{                                 // <-json開始，用大括號 
  "msg": "success",               // <-注意物件名直接用引號，內容用冒號、引號來處理
  "data": 
        [                         // <-陣列開始 
            {                     // <-第一筆資料開始
            "book_name": "YA",    // <-注意逗點使用時機
            "book_price" : "1450" 
            },                    // <-第一筆資料結束，若還有資料，要加逗號
            {                     // <-第二筆資料開始
            "book_name" : "YAYA",
            "book_price" : "1450"
            }                     // <-第二筆資料結束，若為最後一筆資料，則不須加逗號
        ]                         // <-陣列結束 
}                                 // <-json結束，大括號收尾

### 字串
JSON 字串可以包含 object (物件) 或 array (陣列) 資料，object 與 array 也可互相包含：

{
    "member": [
        { "name": "Jacky" },
        { "name": "Marry" },        
    ]
}

### 物件
* 一個 object 以 { 開始，並以 } 結束，來寫入資料。
* name 為 string，必須以 "" 括起來。
* name 與 value 之間使用 : 分隔。
* 多個 name:value 之間使用 , 分隔。

{ "name": value, "name": value }

### 陣列
* 一個陣列以 [ 開始，並以 ] 結束，來寫入資料。
* 多個 value 之間使用 , 分隔。

[value, value]

### object 和 array 的值
object 和 array 可使用的資料型態與值如下：

{ "array": ["string", 10, 1.0, -1, true, false, null] }

### JSON資料型態統整

| 英文 | 中文 | 值/說明 |
| -------- | -------- | -------- |
|object| 物件 | {} |
|array|陣列|[]
|string|字串|"" 括起來的內容（不可使用單個 ''）
|number|數值|0-9 的數字組合（整數、小數或負數）
|boolean|布林值|true 或 false
|null|空值|null

## JSON 與 XML 比較
JSON與XML最大的不同在於，XML是一個完整的標記語言，而JSON不是。這使得XML在程式判讀上需要比較多的功夫。主要的原因在於XML的設計理念與JSON不同。XML利用標記語言的特性提供了絕佳的延展性（如XPath），在資料儲存，擴充功能及高階檢索方面具備對JSON的優勢，而JSON則由於比XML更加小巧，以及瀏覽器的內建快速解析支援，使得其更適用於網路資料傳輸領域。

簡言之：XML比較容易閱讀，但JSON比較好寫。

## 關於xhr
ajax技術的核心是XMLHttpRequest物件（簡稱XHR），這是由微軟首先引入的一個特性，其他瀏覽器提供商後來都提供了相同的實現。XHR提供的介面能夠以非同步方式從伺服器取得更多資訊，意味著使用者單擊後，可以不必重新整理頁面也能取得新資料。