相關(guān)代碼鏈接

AJAX 設(shè)置響應(yīng) 和 獲取請求

AJAX 設(shè)置請求 header

第一部分：request.open( 'POST', 'http://www.baidu.com/search' )
第二部分：request.setRequestHeader( hander, value )

 request.setRequestHeader( 'Content-Type', 'application/x-www-form-urlencoded' )
 request.setRequestHeader( 'who', 'bowen' )

第四部分：request.send( 'a=1&b=2' )

請求

1. POST /search HTTP/1.1
2. Host: www.baidu.com
   Content-Type: application/x-www-form-urlencoded
   who: bowen
   Content-Length: 
   Cookie: 
3. 
4. a=1&b=2

AJAX 獲取響應(yīng) header

第一部分：request.status 和 request.statusText
第二部分：

request.getResponseHeader( headerName ) 
request.getAllResponseHeaders() 

第四部分：request.responseText

響應(yīng)

1. HTTP/1.1 200 ok
2. key: value
3. 
4. 數(shù)據(jù)

Node.js（后端）設(shè)置響應(yīng) header

詳解

callback（回調(diào)）

callback 就是一個回調(diào)函數(shù)，如下圖所示。

callback 示例

1. 給 window 添加一個方法 fn123 ，這個方法接受一個對象 options 。
2. 使用 window 下的方法 fn123 ，并傳入一個對象，這個對象有一個方法 fn456 ，它是一個函數(shù)。
3. window 下的 fn123 接受到對象后將調(diào)用 fn456，將其 call back
4. fn456 中接受的 this 就是 window 下的方法中 call 時傳的第一個參數(shù)，x 就是 call 時傳的第二個參數(shù)

實(shí)現(xiàn) jQuery.ajax

1. 首先回顧下 window.jQuery

2. 將 AJAX-基礎(chǔ) 的代碼 進(jìn)行封裝，封裝為 window.jQuery.ajax，代碼地址

3. 將封裝的 window.jQuery.ajax 進(jìn)行代碼優(yōu)化（給參數(shù)命名）。由于傳入?yún)?shù)過多，將其參數(shù)設(shè)置為有結(jié)構(gòu)的數(shù)據(jù) ==> 對象，代碼地址

4. 實(shí)現(xiàn)傳入不定個參數(shù)的優(yōu)化。既可以傳入一個對象，也可以傳入 url + 對象。代碼地址。此時由于要使用 arguments ，所以不能使用箭頭函數(shù)。

5. 優(yōu)化代碼，使用 ES6 解構(gòu)賦值達(dá)到優(yōu)化代碼的目的，并增加 request.setRequestHeader() 功能。代碼地址。

6. 如果不實(shí)現(xiàn)傳入不定個參數(shù)，還可以進(jìn)一步使用 ES6 解構(gòu)賦值優(yōu)化。代碼地址

7. 使用 Promise 規(guī)范進(jìn)行優(yōu)化，return new Promise(function(resolve,reject){})，成功 === 調(diào)用 resolve，失敗 === 調(diào)用 reject，之后在調(diào)用時使用 .then 方法。代碼地址

8. Promise 實(shí)現(xiàn)原理

   window.Promise = function(fn){
     // ......
      return {
           then: function(){}
      }
   }