Promise实现按照顺序调用

最新推荐文章于 2024-02-19 17:00:19 发布

经年未远

最新推荐文章于 2024-02-19 17:00:19 发布

阅读量697

点赞数

分类专栏：笔记文章标签： javascript 前端 typescript

本文链接：https://blog.csdn.net/qq_42628504/article/details/122444915

版权

笔记专栏收录该内容

30 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>Promise顺序调用</title>
	</head>
	<body>
		<button type="button" style="width:200px;height: 90px;" id="btn">按照顺序加载</button>
	</body>
  <script type="text/javascript">
	  
	  //实现按照 二 一 三  顺序调用
	  let btn =  document.getElementById("btn");
	  btn.onclick = function(){
			 getData2().then(data=>{
				 	console.log(data)
				    return getData1();
			 }).then(data=>{
				 console.log(data)
				 return getData3()
			 }).then(data=>{
				   console.log(data)
			 })
		
	  }
	  
  	  function getData1(){
		   return  new Promise(function(resolve,reject){
			        setTimeout(()=>{
						  resolve("我是一") ;
						  // console.log("我是一")
					},1000)
		   })
	  }



      function getData2(){
		   return  new Promise(function(resolve,reject){
			        setTimeout(()=>{
						  resolve("我是二");   
					},2000)
		   })
	  }
	  
	  function getData3(){
	  		   return  new Promise(function(resolve,reject){
	  			        setTimeout(()=>{
	  						  resolve("我是三");  
	  					},3000)
	  		   })
	   }
  </script>
</html>

在这里插入图片描述

经年未远

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
Promise实现按照顺序调用

<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>Promise顺序调用</title> </head> <body> <button type="button" style="width:200px;height: 90px;" id="btn">按照顺序加载</button> </body&
复制链接

扫一扫