1949啦网--小小 痛苦,是因为能力和欲望不匹配造成的

promise 异步编程解决方案

1、同步和异步

<!--promise 异步编程解决方案-->

<!--异步:几件事可以同时做的就叫异步-->

<!--同步编程-->

<!--同步:一件事没干完后面的事就得等着-->

<script type="text/javascript">

console.log(1);

// 定时器是异步特性

setTimeout(()=>{

console.log(3);

},3000)

console.log(2);

</script>

2、Promise对象

		<script type="text/javascript">  //			console.log('脱衣服');  //			console.log('洗衣服');  			  			let p = new Promise((resolve,reject)=>{  //				resolve表示将状态变成成功完成  //				reject 表示将状态变成失败完成  				setTimeout(()=>{  					console.log('脱完衣服啦!');  //					执行resolve()方法    表示完成  					resolve();  				},3000)  			});  //			3秒钟之后再执行p.then这个方法,因为上面的resolve();方法3秒完成  			p.then(()=>{  				console.log('promise异步操作完成了');  			})  		</script>

3、Promise传参

		<script type="text/javascript">  //			创建一个promise对象  			let p = new Promise((dd,tt)=>{  				setTimeout(()=>{  					console.log('脱完衣服啦');  //					一定要有这个状态的结束dd(),  //					(2)dd()里面传个参数3,传参用去  //					dd();  					dd(3);  				},2000)  //				p.then监控一下这个状态的结束  				  			})  //			p.then(d)接收这个参数3  			p.then((d)=>{  					console.log('去洗' +d+ '件衣服');  				})  		</script>

4、 Promise错误处理

		<script type="text/javascript">  //			创建一个promise对象  			let p = new Promise((dd,tt)=>{  				setTimeout(()=>{  //					if (顺利完成) {  //						dd(3);  //					} else{  //						tt();  //					}  					  					tt('读写失败');  					  				},2000)  //				p.then监控一下这个状态的结束  				  			})  //			p.then(d)接收这个参数3  			p.then((d)=>{  					console.log('去洗' +d+ '件衣服');  //					t这里接收第二个参数,执行的是第二个方法,不会去执行第一个方法的  				},(t)=>{  //					输出结果:遇到错误了 读写失败  					console.log('遇到错误了',t);  				})  		</script>

5、Promise.all()

		<script type="text/javascript">  			let p1 = new Promise((t,y)=>{  //				ss随机一个时间出来  				let ss = Math.floor(Math.random()*4000+1000);  				setTimeout(()=>{  					console.log('p1完成');  					t();  				},ss)  			})  			  			  			let p2 = new Promise((t,y)=>{  //				ss随机一个时间出来  				let ss = Math.floor(Math.random()*4000+1000);  				setTimeout(()=>{  					console.log('p2完成');  					t();  				},ss)  			})  			  			  			let p3 = new Promise((t,y)=>{  //				ss随机一个时间出来  				let ss = Math.floor(Math.random()*4000+1000);  				setTimeout(()=>{  					console.log('p3完成');  					t();  				},ss)  			})  			  			let p4 = new Promise((t,y)=>{  //				ss随机一个时间出来  				let ss = Math.floor(Math.random()*4000+1000);  				setTimeout(()=>{  					console.log('p4完成');  					t();  				},ss)  			})  //			Promise.all()方法,也是返回一个promise对象,只不过传进来的四个p1,p2,p3,p4对象4个都完成之后,p.then()方法才会被执行			  //			let p = new Promise.all([p1,p2,p3,p4]);  //			这里不需要加new,它不是构造函数,这是直接调用all()方法  //			监控多个promise对象执行完成  			let p = Promise.all([p1,p2,p3,p4]);  			p.then(()=>{  				console.log('全部执行完毕!');  			})  		</script>

6、async await异步函数

		<script type="text/javascript">  //			async和await是异步函数ES7的语法  //			张 三   买鸡蛋和酉红柿  			  //			李四  //			    刷锅  //			   	 准备佐料  //			   	 切菜  //			   	 炒菜  //看到上面的知道,下面李四要执行流程的话,刷锅和准备佐料可以事先做完成,但是切菜和炒菜要张三先买好菜((完成这个步骤)买鸡蛋和酉红柿)	才能执行	   	   //			先来一个函数x,这个函数x返回一个promise对象  			let x = ()=>{  				console.log('去买菜啦!');  				let p = new Promise((a,b)=>{  					setTimeout(()=>{  						console.log('买菜完毕!');  						a();  					},3000)  				})  				return p;  			}  //			async await是成对出现的  			let y = async ()=>{  				console.log('刷锅');  				console.log('准备佐料');  //				调用上面的x() 遇到await程序会等待当前函数(x)执行完毕,再继续执行(阻塞)  				await x();  				console.log('切菜');  				console.log('炒菜');  			}  			y();  		</script>

原文链接:https://www.qiquanji.com/post/7691.html

本站声明:网站内容来源于网络,如有侵权,请联系我们,我们将及时处理。

微信扫码关注

更新实时通知

作者:xialibing 分类:网页教程 浏览: