1.ajax是什么？有什么用？

ajax:Asynchronous Javascript +XML，作用是向服務器請求數(shù)據(jù)而不用刷新頁面
優(yōu)點：

1. 它能在不刷新整個頁面的前提下與服務器通信維護數(shù)據(jù)，更新數(shù)據(jù)而不需要刷新頁面
2. 因為可以選擇異步通信，它與服務器使用異步的方式通信，不會打斷用戶的操作（卡死頁面）
3. 可以將后端服務器的一些工作轉(zhuǎn)移給客戶端，利用客戶端限制的能力來處理，減輕了服務器的負擔。

2.前后端開發(fā)聯(lián)調(diào)需要注意哪些事情？后端接口完成前如何mock數(shù)據(jù)？

前后端開發(fā)聯(lián)調(diào)注意事項：

1. 約定數(shù)據(jù)：需要傳輸哪些數(shù)據(jù)，數(shù)據(jù)類型是什么
2. 約定接口：確定接口名稱，請求格式以及響應格式
3. 根據(jù)這些約定整理成接口文檔

mock數(shù)據(jù)：

1. 可以根據(jù)接口文檔，使用假數(shù)據(jù)來驗證我們制作的頁面響應和接口是否正常
2. 可以用xampp進行模擬
3. 也可以使用server-mock

3.點擊按鈕，使用ajax獲取數(shù)據(jù)，如何在數(shù)據(jù)到來之前防止重復點擊？

設置一個狀態(tài)鎖

 var newsBox = document.querySelector("#news-box")
  var btn = document.querySelector("#btn")
  var newsIndex = 0
  var canIclick = true

  btn.addEventListener("click",function(){
    if(!canIclick){
        return
    }

    var xhr = new XMLHttpRequest()
    xhr.onreadystatechange = function(){
      if(xhr.readyState === 4){
        if(xhr.status === 200 || xhr.status === 304){
            var results = JSON.parse(xhr.responseText)
            var fragment = document.createDocumentFragment()
            for(var i = 0; i < results.length; i++){
                var node = document.createElement("li")
                node.innerText = results[i]
                fragment.appendChild(node)
            }
            newsBox.appendChild(fragment)
            newsIndex += 5  
        }else{
            alert('出錯了')
        }
        canIclick = true
      }
    }
    xhr.open('get','/getMore?index='+newsIndex+'&length=5',true)
    xhr.send()
    canIclick = false
  })

4.實現(xiàn)加載更多的功能，后端在本地使用sever-mock模擬數(shù)據(jù)

在3中貼出了前端的代碼，一下是后端的代碼

router.get('/getMore', function(req,res){

    var curIndex = req.query.index
    var len = req.query.length
    var data = []

    for(var i = 0; i < len; i++){
        data.push('新聞'+(parseInt(curIndex) + i))
    }
    setTimeout(function(){
        res.send(data);
    },3000)  //此處的setTimeout是模擬網(wǎng)速很慢時，服務器傳回數(shù)據(jù)較慢時的場景，驗證防止多次點擊是否生效
})

ajax.png