JS——promise

最新推荐文章于 2024-07-28 21:06:01 发布

spfLinux

最新推荐文章于 2024-07-28 21:06:01 发布

阅读量249

点赞数

分类专栏： js ES6 文章标签： JS promise

js 同时被 2 个专栏收录

137 篇文章 3 订阅

订阅专栏

ES6

4 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<script>
		function conn(){
			return new Promise(function(resolve,reject){
				console.log("尝试建立连接...");
				setTimeout(()=>{
					var err=Math.random()<0.1?true:false;
					if(!err){
						console.log("连接成功!");
						resolve(); //会触发promise执行then中的回调函数
					}else{
						reject("连接出错");
					}
				},3000);
			})
		}
		function query(){
			return new Promise(function(resolve,reject){
				console.log("开始查询数据...");
				setTimeout(()=>{
					var err=Math.random()<0.1?true:false;
					if(!err){
						console.log("查询完成");
						resolve();
					}else{
						reject("查询出错");
					}
				},2000);
			})
		}
		function response(){
			return new Promise(function(resolve,reject){
				console.log("开始返回结果...");
				setTimeout(()=>{
					var err=Math.random()<0.1?true:false;
					if(!err){
						console.log("结果返回完成");
						resolve();
					}else
						reject("返回结果失败");
				},1000);
			})
		}
		function load(){
			console.log("开始加载数据...");
			setTimeout(()=>console.log("数据加载完成"),500);
		}
		conn()
		 .then(query)
		 .then(response)
		 .then(load)
		 .catch(function(err){
		 	document.write(`<h1 style="color:red">${err}</h1>`);
		 })
	</script>
</body>
</html>

---------------------------------------------

返回的是一个new Promise对象，所以可以调用对应的.then方法。

http://es6.ruanyifeng.com/#docs/promise