<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>数组新增方法</title>
<script>
'use strict';
new Promise(function () {});
// 直接运行测试:
console.log('支持Promise!');
/*----------Promise (承诺,许诺)-----------*/
// 作用:解决异步回调问题
/* 传统方式, 大部分用回调函数,事件*/
{
// ajax(url,()=>{
// ajax(url,()=>{
//
// })
// })
}
/* ES6.0 Promise*/
{
let a = 10;
let promise = new Promise(function (resolve, reject) {
//resolve 成功调用 reject 失败调用
if(a == 11){
resolve('成功');
}else {
reject('失败辽');
}
})
// promise.then(success:function(){},fail:function(){});
// promise.then(res=>{
// console.log(res)
// },err=>{
// console.log(err)
// })
/* 增加了catch 捕获异常*/
promise.then(res =>{
console.log(res)
}).catch(err=>{
console.log(err)
})
let p1 = Promise.resolve('aa'); //创建一个resolve状态的promise对象
// 等同于上面的
/*let p1 = new Promise(resolve =>{ // resolve 是形参 == new Promise((resolve) =>{
resolve('成功');
})*/
let p2 = Promise.reject('bb');
p1.then(res=>{
console.log(res)
})
p2.catch(err=>{
console.log(err)
})
}
/*----------Promise.all (成功的时候返回的是一个结果数组,而失败的时候则返回最先被reject失败状态的值。)-----------*/
{
let p1 = Promise.resolve('aa');
let p2 = Promise.resolve('bb');
let p3 = Promise.resolve('cc');
Promise.all([p1,p2,p3]).then(res=>{
let [p1, p2, p3] = res;
console.log(p1, p2, p3) //aa bb cc 个人信息 头像 内容
}).catch(err=>{
console.log(err)
})
}
/*----------Promise.race (哪个结果获得的快,就返回那个结果跳入then中)-----------*/
{
let p1 = Promise.reject('aa');
let p2 = Promise.reject('bb');
let p3 = Promise.resolve('cc');
Promise.race([p1,p2,p3]).then(res=>{
let [p1, p2, p3] = res;
console.log(p1, p2, p3) //aa bb cc 个人信息 头像 内容
}).catch(err=>{
console.log(err+1)
})
}
/*----------Promise.race (哪个结果获得的快,就返回那个结果跳入then中)-----------*/
{
let a = 1;
let userLogin = (resolve, reject)=>{
setTimeout(()=>{
if(a = 1){
let data = {data:'登录成功',code:200,length:1}; // ajax 请求数据返回结果
resolve(data);
}else {
reject('失败了');
}
},2000)
};
let getList = (resolve, reject)=>{
setTimeout(()=>{
if(a = 1){
let data = {data:'获取列表成功',code:200,length:1}; // ajax 请求数据返回结果
resolve(data);
}else {
reject('失败了');
}
},2000)
};
new Promise(userLogin).then(res=>{
console.log(res); //登录成功
return new Promise(getList);
}).then(res=>{
console.log(res); //获取列表成功
})
}
</script>
</head>
<body>
</body>
</html>
网友评论