promise是es6的吗

青灯夜游
Lepaskan: 2022-11-03 19:20:55
asal
1773 orang telah melayarinya

是的。promise是ECMAScript 6新增的引用类型,表示一个异步操作的最终完成或者失败。promise是解决异步编程调用代码逻辑编写过于复杂的问题的,当网络请求非常复杂时,就会出现回调地狱,这样如果将这些代码写在一起就会看起来很复杂,且不利于阅读,如果用promise的话就会让代码看起来更加美观优雅。

promise是es6的吗

本教程操作环境:windows7系统、ECMAScript 6版、Dell G3电脑。

ECMAScript 6 增加了对 Promises/A+ 规范的完善支持,即 Promise 类型。一经推出,Promise 就大受欢迎,成为了主导性的异步编程机制。所有现代浏览器都支持 ES6 期约,很多其他浏览器 API 也以期约为基础。

Promise 是 ECMAScript 6 新增的引用类型,表示一个异步操作的最终完成或者失败。

一、promise函数是干什么的

promise函数是解决异步编程调用代码逻辑编写过于复杂的问题的,当网络请求非常复杂时,就会出现回调地狱,这样如果将这些代码写在一起就会看起来很复杂,且不利于阅读,如果用promise的话就会让代码看起来更加美观优雅

二、Promise三种状态

首先, 当我们开发中有异步操作时, 就可以给异步操作包装一个Promise
异步操作之后会有三种状态

pending:等待状态,比如正在进行网络请求,或者定时器没有到时间。 fulfill:满足状态,当我们主动回调了resolve时,就处于该状态,并且会回调.then() reject:拒绝状态,当我们主动回调了reject时,就处于该状态,并且会回调.catch()
Salin selepas log masuk

三、实现

1,then和catch

1.出于未决状态的函数是同步的 会立即执行
2.then和catch是异步的 就算promise对象里面没有异步操作 让then方法或者catch立即执行 那么 这里两个方法或被加入到事件队列中等待执行

//参数 函数(resolve,reject) new Promise((resolve, reject) => { setTimeout(() => { //请求成功的时候调用resolve resolve('22222') //请求失败的时候调用reject reject('error message') }, 1000) }).then((data) => { //请求成功处理函数 console.log(data) }).catch((err) => { //请求失败处理函数 console.log(err) })
Salin selepas log masuk

2.确定状态

1、在未决状态的处理函数中 如果发生未捕获的错误呀 那么状态就会有pending 直接变成 rejected状态 并且可以被catach捕获

var pro = new Promise((resolve, reject) => { throw new Error("123"); // try{ // throw new Error("123"); // } catch(e) {} resolve(12); reject(34); }) // pro.then(data => { // console.log(data); // }, err => { // console.log(err); // }) console.log(pro); pro.then(data => { console.log(data); }) pro.catch(data => { console.log(data); })
Salin selepas log masuk

3.async和await

1.使用Promise:

const makeRequest = () => getJSON().then(data => { console.log(data) return "done" }) makeRequest()
Salin selepas log masuk

2.使用Async:

async和await 是ES7提出来的
async作用:简化函数返回值中promise对象的创建
一般情况下, async写在函数的最前面,被修饰的函数的返回值 ,一定是promise对象。只有在某些特殊情况下 才会手动返回一个promise对象。

作用:和promise一样 解决异步问题 但是他的好处在于 让异步代码和同步的一样!!
注意点 : 同步方法我们拿到结果 是通过返回值,异步方法拿到结果,是靠回调函数。

async 和await使用的基本语法:

  • 就是在普通函数前面加一个async 调用跟普通函数一样

  • async出现使用 一般都要和await配合使用

  • await后面接的就是一个promise对象 await一定是在异步函数中使用的

const makeRequest = async () => { // await getJSON()表示console.log会等到getJSON的promise成功reosolve之后再执行。 console.log(await getJSON) return "done" } makeRequest()
Salin selepas log masuk

3.区别

1.函数前面多了一个aync关键字。await关键字只能用在aync定义的函数内。async函数会隐式地返回一个promise,该promise的reosolve值就是函数return的值。(示例中reosolve值就是字符串”done”)
2.我们不能在最外层代码中使用await,因为不在async函数内。

四.promise方法

var r1 = new Promise((resolve,reject) => { setTimeout(function(){ resolve("我是第一个请求"); },1000) }) var r2 = new Promise((resolve,reject) => { setTimeout(function(){ resolve("我是第二个请求"); },3000) }) var r3 = new Promise((resolve,reject) => { setTimeout(function(){ resolve("我是第三个请求"); },4000) }) var r4 = new Promise((resolve,reject) => { setTimeout(function(){ resolve("我是第四个请求"); },500) })
Salin selepas log masuk

1.all方法

有时候我们需要等待两个或者多个请求都成功返回了再进行下一步操作,promise 的all方法是等所有的异步请求完成之后在进行下一步回调

Promise.all([r1,r2,r3,r4]).then(data => { console.log(data); })
Salin selepas log masuk

2.race方法

请求同时发送出去 谁先回来 就是用谁的数据。

Promise.race([r1,r2,r3,r4]).then(data => { console.log(data); })
Salin selepas log masuk

五.promise封装ajax案例

Salin selepas log masuk

【相关推荐:javascript视频教程web前端

Atas ialah kandungan terperinci promise是es6的吗. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:csdn.net
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan
Tentang kita Penafian Sitemap
Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!