对应代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script type="text/javascript">
new Promise(function(Resolved,reject){
//Resolved();
reject();
}).then(function(){alert("成功");},function(){alert("失败");})
</script>
</head>
<body>
</body>
</html>
new Promise(function(Resolved,reject){
//Resolved();
reject();
}).then(function(){alert("成功");}).catch(function(){alert("来自catch的失败信息")})
写成函数并带参数:
function showPromise(res){
new Promise((Resolved,reject)=>{
// Resolved(res);
reject(res);
}).then((x)=>{alert(x);}).catch((x)=>{alert(x+" 来自catch的失败信息")})
}
showPromise("hello promise");
感觉有点想那个VBA里面的 isError 那个method。
// 【4】回调函数
new Promise(function(Resolved,reject){
Resolved("Resolved");
reject();
}).then(function(x){alert(x);return "第一次then的return"})
.then(function(x){alert(x);return "第二次then的return"})
.then(function(x){alert(x);return "第三次then的return"})
.then(function(x){alert(x);return "第四次then的return"})
.then(function(x){alert(x);return "第五次then的return"})
.then(function(x){alert(x);return "第六次then的return"})
promise的厉害之处,在于可以无限回调。
为什么没有第六次then呢,因为他return的没有后面的then去alert他了。
catch的无限回调函数。
// 【5】catch 的无限回调
new Promise(function(Resolved,reject){
// Resolved("Resolved");
reject();
}).then(function(x){alert(x);return "第一次then的return"})
.catch(()=>{alert(" 失败了 ");return "失败了,第二次then的return";})
.then(function(x){alert(x);return "第二次then的return"})
表示 or 不表示 的promise的 小demo
<body>
<button id="button1" value="click" >Click</button>
<div id="div1">111111</div>
<script type="text/javascript">
// 【6】小demo的练习
let index = 0;
button1.onclick = ()=>{
index++;
new Promise((succ,error)=>{
index%2==1?succ():error();
}).then(()=>{
div1.style.display = "none";
},
()=>{
div1.style.display = "block";
})
}
</script>
</body>
race 竞速 与 all
// // 【7】race 竞速
// pro1 = new Promise((succ,err)=>{
// setTimeout(succ,1300,'1');
// }).then((x)=>{alert(x);return "1OK";}).catch((e)=>{alert(e+"======失败了")})
// pro2 = new Promise((succ,err)=>{
// setTimeout(succ,1000,'2');
// }).then((x)=>{alert(x);return "2OK";}).catch((e)=>{alert(e+"======失败了")})
// pro3 = new Promise((succ,err)=>{
// setTimeout(succ,1600,'3');
// }).then((x)=>{alert(x);return "3OK";}).catch((e)=>{alert(e+"======失败了")})
// Promise.race([pro1,pro2,pro3])
// .then((x)=>{alert(x);}).catch((e)=>{alert(e+"==真的失败了!")})
// 【8】all 竞速
pro1 = new Promise((succ,err)=>{
setTimeout(succ,1300,'1');
}).then((x)=>{alert(x);return "1OK";}).catch((e)=>{alert(e+"======失败了")})
pro2 = new Promise((succ,err)=>{
setTimeout(succ,1000,'2');
}).then((x)=>{alert(x);return "2OK";}).catch((e)=>{alert(e+"======失败了")})
pro3 = new Promise((succ,err)=>{
setTimeout(succ,1600,'3');
}).then((x)=>{alert(x);return "3OK";}).catch((e)=>{alert(e+"======失败了")})
Promise.all([pro1,pro2,pro3])
.then((x)=>{alert(x);}).catch((e)=>{alert(e+"==真的失败了!")})
all的这个运行结果比较有意思,打印出来是1ok2ok3ok。不知道为啥???~~~~~~
复数参数化,不支持不定参数化,需要的话,只能传单个参数,但是是数组形式。
// 【9】函数 複數参数化
function showPromise(res){
new Promise((Resolved,reject)=>{
Resolved([res,"others"]);
//reject(res);
}).then((x)=>{alert(x[0] + "===" + x[1]);}).catch((x)=>{alert(x+" 来自catch的失败信息")})
}
showPromise("111111");