JavaScript 异步编程解决方案-中篇

这篇具有很好参考价值的文章主要介绍了JavaScript 异步编程解决方案-中篇。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

天下事有难易乎? 为之,则难者亦易矣;不为, 则易者亦难矣。人之为学有难易乎? 学之,则难者亦易矣;不学,则易者亦难矣。

async 函数 和promise then的规则一样

	async function fun() {
				//1.如果返回一个非promise,返回的是一个成功的promise值 
				// return 1
				//2.如果返回一个promise,返回的状态值就是promise值 
				return new Promise((reslove, rejcet) => {
					// reslove('ok')
					// rejcet('error')

					throw '错误'
				})
			}
			console.log(fun());
		//await  表达式  右边一般是promise 对象也可以是其他值
		//必须写在async  函数 。async函数里面没有await 
		//如果await  promise 异常可以用try  cath 捕获
	async function func() {
				let a = await 100
				console.log(a);
				let p = new Promise((reslove, reject) => {
					// reslove('helloWorld')
					reject('err')
				})
				try {
					await p
				} catch (e) {
					console.log(e);
				}
			}
			func()

1,如何使用promise

JavaScript 异步编程解决方案-中篇,js,javascript,开发语言,ecmascript

1.Promise 构造函数:new Promise(executor)

Promise() 只能通过 new 运算符来构造。如果尝试在没有使用 new 的情况下调用它,会抛出 TypeError 异常。

1.executor 执行器函数:(resolve,reject)=>{}
2.resolve 函数:内部定义成功时候调用values=>{}
3.reject 函数:内部定义失败时候调用error=>{}

备注:executor 会在Promise内部同步调用,异步调用在回调函数里面

let p = new Promise((resolve, reject) => {
				//同步调用
				console.log('调用了额');
			})
			console.log('外部');
		</script>
2.Promise.prototype.then()

Promise 实例的 then() 方法最多接受两个参数:用于 Promise 兑现和拒绝情况的回调函数。它立即返回一个等效的 Promise 对象,允许你链接到其他 Promise 方法,从而实现链式调用。
then(onFulfilled) onFulfilled 成功回调
then(onFulfilled, onRejected) onRejected失败回调

以下: Promise 对象(称之为 p)

1.返回一个值:p 以该返回值作为其兑现值。
let p = new Promise((resolve, reject) => {
				//同步调用

				resolve(1)

			})
			console.log(p);

JavaScript 异步编程解决方案-中篇,js,javascript,开发语言,ecmascript
JavaScript 异步编程解决方案-中篇,js,javascript,开发语言,ecmascript

2.没有返回任何值:p 以 undefined 作为其兑现值。

JavaScript 异步编程解决方案-中篇,js,javascript,开发语言,ecmascript

3.抛出一个错误:p 抛出的错误作为其拒绝值。
let p = new Promise((resolve, reject) => {
				//同步调用

				throw new Error('错误了')

			})
			console.log(p);

JavaScript 异步编程解决方案-中篇,js,javascript,开发语言,ecmascript

4.返回一个已兑现的 Promise 对象:p 以该 Promise 的值作为其兑现值。
5.返回一个已拒绝的 Promise 对象:p 以该 Promise 的值作为其拒绝值。
6.返回另一个待定的 Promise 对象:p 保持待定状态,并在该 Promise 对象被兑现/拒绝后立即以该 Promise 的值作为其兑现/拒绝值。
3.Promise.prototype.catch() 失败的回调

Promise 实例的 catch() 方法用于注册一个在 promise 被拒绝时调用的函数。它会立即返回一个等效的 Promise 对象,这可以允许你链式调用其他 promise 的方法。此方法是 Promise.prototype.then(undefined, onRejected) 的一种简写形式。
catch 方法用于在 Promise 链进行错误处理

	let p = new Promise((resolve, reject) => {
				//同步调用

				reject('错误')

			})
			p.catch(err => {
				console.log(err);
			})
4.Promise.reject()

Promise.reject() 静态方法返回一个已拒绝(rejected)的 Promise 对象,拒绝原因为给定的参数

let p2 = Promise.reject('1')

			let p3 = Promise.reject(new Promise((resolve, reject) => {
				resolve('ok')
			}))

			//无论传什么类型都返回失败的结果
5、Promise.resolve() 接受一个参数,返回成功或者失败的promise,

备注 :传入的是非promise值,结果一直是成功、传入的是promise对象,promise参数结果的值,决定其最终结果值:

	let p = Promise.resolve('1')
			console.log(p);
			let p2 = Promise.resolve(new Promise((reslove, reject) => {
				// reslove('ok')
				reject('no')

			}))
5、Promise.all()

Promise.all() 静态方法接受一个 Promise 可迭代对象作为输入,并返回一个 Promise。当所有输入的 Promise 都被兑现时,返回的 Promise 也将被兑现(即使传入的是一个空的可迭代对象),并返回一个包含所有兑现值的数组。如果输入的任何 Promise 被拒绝,则返回的 Promise 将被拒绝,并带有第一个被拒绝的原因。

备注:都是成为未成功,有一个失败为失败类似&&运算

let p1 = new Promise((reslove, reject) => {
				reslove('ok')
			})

			let p2 = Promise.resolve('2')

			let p3 = Promise.resolve('3')
			let p = Promise.all([p1, p2, p3])
			console.log(p);

JavaScript 异步编程解决方案-中篇,js,javascript,开发语言,ecmascript

let p1 = new Promise((reslove, reject) => {
				reslove('ok')
			})

			let p2 = Promise.reject('2')

			let p3 = Promise.reject('3')
			let p = Promise.all([p1, p2, p3])

返回第一个失败的结果作为结果
JavaScript 异步编程解决方案-中篇,js,javascript,开发语言,ecmascript

6、Promise.race()

Promise.race() 静态方法接受一个 promise 可迭代对象作为输入,并返回一个 Promise。这个返回的 promise 会随着第一个 promise 的敲定而敲定。

备注:第一个 promise 的敲定而敲定。

let p1 = new Promise((reslove, reject) => {
				reslove('ok')
			})

			let p2 = Promise.reject('2')

			let p3 = Promise.reject('3')
			let p = Promise.race([p1, p2, p3])
			console.log(p);

JavaScript 异步编程解决方案-中篇,js,javascript,开发语言,ecmascript

let p1 = new Promise((reslove, reject) => {
				reslove('ok')
			})

			let p2 = Promise.reject('2')

			let p3 = Promise.reject('3')
			let p = Promise.race([p2, p1, p3])
			console.log(p);

JavaScript 异步编程解决方案-中篇,js,javascript,开发语言,ecmascript
天下事有难易乎?
为之,则难者亦易矣;不为,
则易者亦难矣。人之为学有难易乎?
学之,则难者亦易矣;不学,则易者亦难矣。

promise 关键问题

1.如何改变promise 的状态?

1.resolve
2.reject
3.抛出异常错误

2.promise 多个成功回调和失败的函数都会回调吗。
如果promise状态改变了,都会执行

3.promise then的结果由什么决定

有then里面回调函数决定
1.返回非Promise 成功 2.返回Promise有Promise决定最后值 3.抛出异常返回失败

let p2 = p.then(res => {
				// console.log('1=>' + res);
				// return Promise.resolve(9)
				throw '错误哈~'
				// return 1
			})
			console.log(p2);

4、promise 串联多个任务

p.then(res => {
				return new Promise((reslove, reject) => {
					reslove('ok')
				})
			}).then(v => {
				console.log(v);
			}).then(x => {
				console.log(x);
			})

5、异常穿透catch文章来源地址https://www.toymoban.com/news/detail-816870.html

p.then(res => {
				return new Promise((reslove, reject) => {
					reslove('ok')
					// reject('err')
				})
			}).then(v => {
				console.log(v);

				throw '错误'
			}).then(x => {
				console.log(x);
			}).catch(err => {
				console.log('catch ' + err);
			})
6、中断promise 链有且只有个方法,返回一个pending 状态的promise		
p.then(res => {
				return new Promise((reslove, reject) => {
					reslove('ok')
					// reject('err')
				})
			}).then(v => {
				console.log(v);
				return new Promise(() => {})
				// throw '错误'
			}).then(x => {
				console.log(x);
			}).catch(err => {
				console.log('catch ' + err);
			})

到了这里,关于JavaScript 异步编程解决方案-中篇的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 详解JS的四种异步解决方案!

    目录 同步异步的概念 js中异步的应用场景 实现异步的四种方法 1、 回调函数 2、Promise 3、Generator 4、 async/await         「异步编程」 是前端工程师日常开发中经常会用到的技术,也是校招面试过程中常考的一个知识点。         通过掌握 「异步编程」 的四种方式,可

    2024年01月18日
    浏览(31)
  • [javascript核心-09] 彻底解决js中的类型检测方案

    typeof 基于数据类型的值(二进制)进行检测 返回结果为字符串 typeof NaN 结果为 number typeof null 结果为 Object .对象存储以 000 开头,而 null 也是如此。 typeof 不能细分对象,结果都是 Object typeof function(){} 结果为 function instanceof 检测某个构造函数是否出现在某实例的原型链上 返回结

    2024年02月16日
    浏览(40)
  • JavaScript框架 Angular、React、Vue.js 的全栈解决方案比较

    在 Web 开发领域,JavaScript 提供大量技术栈可供选择。其中最典型的三套组合,分别是 MERN、MEAN 和 MEVN。前端框架(React、Angular 和 Vue)进行简化比较。 MERN 技术栈包含四大具体组件: MongoDB:一款强大的 NoSQL 数据库,以灵活的 JSON 格式存储数据。 Express.js:一套极简但强大的

    2024年02月03日
    浏览(42)
  • JS 异步编程方法:6种方案

        javascript语言的执行环境是\\\"单线程\\\"。也就是指一次只能完成一件任务。如果有多个任务,就必须排队,前面一个任务完成,在执行后面一个任务     这种模式虽然实现起来比较简单,执行环境相对单纯,但是只要一个任务耗时很长,后面的任务都必须排队等着,会拖延整

    2023年04月08日
    浏览(26)
  • @Async异步线程:Spring 自带的异步解决方案

            在项目应用中,使用MQ异步调用来实现系统性能优化,完成服务间数据同步是常用的技术手段。如果是在同一台服务器内部,不涉及到分布式系统,单纯的想实现部分业务的异步执行,这里介绍一个更简单的异步方法调用。         对于异步方法调用,从Spring3 开

    2023年04月24日
    浏览(46)
  • Go异步任务解决方案 Asynq

    今天为大家介绍一个Go处理异步任务的解决方案:Asynq,是一个 Go 库,用于排队任务并与 worker 异步处理它们。它由Redis提供支持,旨在实现可扩展且易于上手。 Asynq 是一个 Go 库,用于对任务进行排队并与工作人员异步处理它们。 Asynq 工作原理的高级概述: 客户端将任务放入

    2024年01月17日
    浏览(32)
  • 【go】异步任务解决方案Asynq实战

    Asynq 是一个 Go 库,一个高效的分布式任务队列。 Asynq 工作原理: 客户端(生产者)将任务放入队列 服务器(消费者)从队列中拉出任务并为每个任务启动一个工作 goroutine 多个工作人员同时处理任务 git库:https://github.com/hibiken/asynq Asynq 使用 Redis 作为消息代理。client 和 se

    2024年02月10日
    浏览(32)
  • Redux异步解决方案 1. Redux-Thunk中间件

    简单介绍一下 thunk ,这是一个中间件,是解决 redux 异步问题产生的。我们都知道,在使用 redux 的时候,通过 dispatch 一个 action 发生到 reducer 然后传递给 store 修改状态 一系列都是同步的,那如果说我 dispatch 一个 action 这个 action 帮我请求一下接口数据,你发现接口请求是异步

    2024年02月09日
    浏览(34)
  • 使用aiohttp异步调用API+request上传文件中文文档名乱码解决方案

    有时候在调用需要用异步调用API接口。在python中有很多框架,比如 asyncio , Celery , Quart 等。这里我选择了 asyncio 。Python 3.5以上版本内置了 asyncio 库,可以用来编写单线程的并发代码。可以使用此库与 aiohttp 结合来发送异步HTTP请求。 参数为JSON 需要同时上传文件和JSON参数

    2024年02月04日
    浏览(30)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包