大型门户网站是这样炼成的源代码,加强文明网站内容建设,好的网站设计制作,公司建设网站费用这里写目录标题 一、概念二、示例基本使用使用 Promise 对象封装Ajaxthen() 方法catch() 方法 一、概念
简单说就是一个容器#xff0c;里面保存着某个未来才会结束的事件#xff08;通常是一个异步操作#xff09;的结果。Promise 是一个对象#xff0c;Promise 提供统一… 这里写目录标题 一、概念二、示例基本使用使用 Promise 对象封装Ajaxthen() 方法catch() 方法 一、概念
简单说就是一个容器里面保存着某个未来才会结束的事件通常是一个异步操作的结果。Promise 是一个对象Promise 提供统一的 API各种异步操作都可以用同样的方法进行处理。axios 的内部实现原理就是通过 Promise 实现的。Promise对象有以下两个特点 对象的状态不受外界影响。有三种状态pending进行中、fulfilled成功和rejected失败。只有异步操作的结果可以决定当前是哪一种状态任何其他操作都无法改变这个状态。一旦状态改变就不会再变任何时候都可以得到这个结果。Promise对象的状态改变只有两种可能从pending变为resolved和从pending变为rejected。只要这两种情况发生状态就凝固了不会再变了会一直保持这个结果。 Promise对象是一个构造函数用来生成Promise实例带有一个回调函数回调函数的两个参数是 resolve成功 和 reject失败,这两个参数他们也是函数。
二、示例
基本使用 function timeOut(ms) {// Promise对象是一个构造函数用来生成Promise实例// 闭包函数一个函数里面返回一个函数return new Promise((resolve, reject) {// ... 模拟执行异步操作,后端返回的数据let res {code: 200,//code:201data: {name: ES6学习},error: 失败了}setTimeout(() {// 异步执行成功if (res.code 200) {resolve(res.data);// 异步执行失败} else {reject(res.error);}},ms);});}// then方法的第一个参数是resolved状态的回调函数// 第二个参数是rejected状态的回调函数它们都是可选的。timeOut(4000).then((val){console.log(val); //这里的值接收的是 resolved() 的值},(err){console.log(err);//这里的值接收的是 rejected() 的值输出 失败了});Promise构造函数接受一个函数作为参数该函数的两个参数分别是resolve和reject。它们是两个函数由JavaScript引擎提供不用自己部署。 resolve函数的作用是将Promise对象的状态从“未完成”变成“成功”即从pending变为resolved,在异步操作成功时调用并将异步操作的结果作为参数传递。 reject函数的作用是将Promise对象的状态从“未完成”变为“失败”即从pending变为rejected,在异步操作失败时嗲用并将异步操作报出的错位u传递出去。 Promise 实例生成以后可以用 then方法分别指定resolved状态和 rejected状态的回调函数。
使用 Promise 对象封装Ajax const getJson function (url) {return new Promise((resolve, reject) {const xhr new XMLHttpRequest();xhr.open(GET, url);xhr.resposeType json;xhr.setRequestHeader(Accept, application/json);xhr.send();xhr.onreadystatechange function() {//console.log(READYSTATE xhr.readyState);if (xhr.readyState 4) { console.log(READYSTATE xhr.status); if (xhr.status 200) { resolve(this.responseText);} else {reject(new Error(xhr.statusText))}}}})}getJson(http://timor.tech/api/holiday/year/2024).then((data) {console.log(data);}, (error) {console.log(error);})then() 方法
如果一个promise执行完后 返回的还是一个promise 实例注意不是原来那个Promise实例会把这个promise 的执行结果传递给下一次then中。因此可以采用链式写法即then方法后面再调用另一个then方法。
catch() 方法
catch(err{})方法等价于then(null,err{})用于指定发生错误时的回调函数
