概念

Ajax 即“Asynchronous Javascript And XML”（异步 JavaScript 和 XML），是指一种创建交互式、快速动态网页应用的网页开发技术，无需重新加载整个网页的情况下，能够更新部分网页的技术。

作用

通过在后台与服务器进行少量数据交换，Ajax 可以使网页实现异步更新，从而在不重新加载整个网页的情况下，对网页的某部分进行更新。

使用方法

  1. const request = new XMLHttpResquest   //创建XMLHttpRequest对象
  2. request.open(method,url)    //请求方式和目标url
  • const request = new XMLHttpResquest //创建XMLHttpRequest对象
  • request.open(method,url) //请求方式和目标url
  • onreadystatechange 函数
    • requset.readyState //XMLHttpRequest 状态代码
      • 0：请求未初始化
      • 1：服务器连接已建立
      • 2：请求已接收
      • 3： 请求处理中
      • 4： 请求已完成，且响应已就绪
    • request.status //Http 响应状态代码
      • 200：请求成功
      • 300：重定向
      • 404：未找到页面
      • 503：服务器无响应
  • request.send() //发送请求

    JSON

    概念

    JSON(JavaScript Object Notation, JS 对象标记)，一种轻量级的数据交换格式。

六种类型

  • 数字（整数或浮点数）
  • 字符串（必须双引号）
  • 逻辑值（true 或 false）
  • 数组
  • 对象

  • null

    API：

  • JSON.parse() //将字符串转换为JSON对象

  • JSON.stringify() //将JSON对象转换为字符串

    错误处理

    try{}catch(error){}

    1. try{
    2.   JSON.parse({'name':'frank'})
    3. }catch(error){
    4. console.log(error)        //SyntaxError: Unexpected token o in JSON at position 1
    5.                           at JSON.parse (<anonymous>)
    6.                           at <anonymous>:2:7
    7. }
    8. console.log('123')    //报错后会捕获错误并执行后续代码

    同步

    不可以同时进行，能直接得到结果，会阻塞后续页面加载

    异步

    可以同时进行，不能直接得到结果，不阻塞页面加载，需要回调或者轮询

    回调

    在将来某个特定情况下，被其他对象调用，而不是自身调用。

    异步任务与回调

  • 异步任务不能直接拿到结果，因此需要传一个回调函数给任务，任务完成时调用回调函数，并把结果作为参数传进去。

  • 函数((x)=>{consolo.log(x)}) 参数个数相同时，可以简化为函数(console.log)

    Promise

  • 为什么要使用 Promise

    • 不规范 命名五花八门
    • 容易出现回调地狱，代码难以阅读
    • 很难进行错误处理

  • 使用方法

    • return new Promise((resolve,reject)=>{})
    • 成功会调用 resolve(result)
    • 失败会调用 reject(request)
    • resove,reject 会再调用成功或失败函数
    • 用 Promise.then(seccess,fail) 传入成功和失败的函数

      Axios

  • 基于 Promise 的 HTTP 库