ES6(Promise)

简介: Promise(异步编程的一种解决方案)1.什么是异步函数A,A去执行一个步骤,A执行再完执行B,这种执行方式实现有两种方式:  1.回调 2.事件触发。

Promise(异步编程的一种解决方案)

1.什么是异步

函数A,A去执行一个步骤,A执行再完执行B,这种执行方式实现有两种方式:

  1.回调 2.事件触发。Promise 区别于这两种方式

2.Promise 的作用

解决异步操作问题

3.Promise 的基本用法

见代码

 

一.ES5中的回调(问题复杂时将难以解决,后期难以维护)

(Ajax 过程)

(先执行“执行”,1秒后执行 timeout1)

 ES6(Promise)写法

先执行“执行2”,然后执行“timeout1”,最后执行“promise timeout2”

 ajax 返回 Promise 事例,执行下一步即 then 的函数体,resolve 执行,reject 停止

 then 表示 下一步

 二.串行过程(若中间出错,如何捕获错误)

 

无错误,继续向下执行,故输出6

 

catch 用来捕获错误,有错误,捕获到错误

三.Promise 高级用法

1.Promise.all(3张图片都加载完成再一起显示)

 1.添加图片

2.显示图片

3.遍历图片

Promise.all 将多个 Promise 事例当做 一个 Promise 事例,当三个图片都触发后才会触发 Promise.all 对象,调用 then 方法

4.结果

只有当都加载完成才会显示

2.(3个图片加载出一个就行,先到先得)

1.添加图片

2.显示图片

3.遍历图片

在多个状态中, 有一个事例率先改变,Promise.race的事例也会跟着改变,其他的都不能响应了

4.结果

只显示一个即可

目录
相关文章
|
28天前
|
前端开发
理解 ES6 中的 Promise
【10月更文挑战第24天】ES6 中的 Promise 是一种用于处理异步操作的机制,它提供了一种更优雅、更可控的方式来处理异步任务的结果。Promise 可以看作是对异步操作结果的一种承诺,它可以处于三种不同的状态:Pending(等待中)、Fulfilled(已完成,即成功)和 Rejected(已拒绝,即失败)。
|
2月前
|
前端开发 JavaScript 小程序
JavaScript的ES6中Promise的使用以及个人理解
JavaScript的ES6中Promise的使用以及个人理解
18 1
|
2月前
|
前端开发 Java
说说你对es6中promise的理解?
说说你对es6中promise的理解?
15 1
|
2月前
|
前端开发 Java
说说你对es6中promise的理解?
说说你对es6中promise的理解?
|
3月前
|
前端开发 JavaScript
ES6新标准下JS异步编程Promise解读
ES6新标准下JS异步编程Promise解读
36 3
|
4月前
|
前端开发
手写实现ES6的Promise.all()和Promise.race()函数
这篇文章介绍了如何手写实现ES6的`Promise.all()`和`Promise.race()`函数,提供了实现这两个Promise聚合函数的详细代码示例,并展示了如何使用它们。
手写实现ES6的Promise.all()和Promise.race()函数
|
2月前
|
存储 前端开发 JavaScript
关于 ES6 中 Promise 的面试题
关于 ES6 中 Promise 的面试题
17 0
|
5月前
|
前端开发 JavaScript
ES6 中 Promise对象使用学习
ES6 中 Promise对象使用学习
42 1
|
4月前
|
前端开发 JavaScript
ES6新特性(五):Promise优雅地处理异步
ES6新特性(五):Promise优雅地处理异步
|
6月前
|
JSON 前端开发 JavaScript
ES6引入Promise和async/await解决异步问题
【6月更文挑战第12天】ES6引入Promise和async/await解决异步问题。Promise处理异步操作,有pending、fulfilled、rejected三种状态,支持链式调用和并行处理。async/await是基于Promise的语法糖,使异步代码更同步化,提高可读性。两者都是处理回调地狱的有效工具,开发者应根据需求选择合适的方式。
55 3