es6-fetch初探

发表于 | 分类于

前言

fetch() 函数是ES8中提出的新特性
主要由以下三个特点：

  • 1）能够天生发生Ajax请求，并且请求机理不是xhr而是新的机制。
  • 2）天生可以跨域，但是需要设置报文头部的信息。服务器可以写脚本识别这个头部判断是否应该拒绝它。
  • 3）Fetch()返回Promise对象。所以可以用then来跟着，then里面的第一个函数就是resolve，这个resolve的返回值将自动被await等号左边的变量接收。

例如：

1
2
3
4
5
6
7
8
9
async function main(){
      var data1 = await fetch("txt/1.json").then(data=>data.json());
      var data2 = await fetch("txt/2.json").then(data=>data.json());
      var data3 = await fetch("txt/3.json").then(data=>data.json());
      console.log(data1);
      console.log(data2);
      console.log(data3);
    }
    main();

好处

  • 可以跨域
  • 可以和async/await结合，写起来更加优雅。

    参考

    使用 Fetch