📖ES6的promise用法

基础用法

let p = new Promise(function(resolve, reject){
//做一些异步操作,例如AJAX请求,定时器
 setTimeout(function(){
  console.log('执行完成Promise');
  resolve('要返回的数据可以任何数据例如接口返回数据');
 }, 2000);
});

//过两秒后打印console

调用 promise 方法

//Promise 构造函数有两个参数,且这两个参数都是函数形式
//resolve 译为:决定,即成功返回值
//reject  译为:拒绝,即错误返回值
let p = new Promise(function(resolve, reject){
	var num = Math.ceil(Math.random()*10); //生成1-10的随机数
	console.log(num)
	if(num >= 5){
		resolve()
	}else{
		reject()
	}
});

//.then()接收两个回调函数一个是resolve(),另外一个是reject()
p.then(()=>{
 console.log('大于5')
},()=>{
 console.log('小于5')
})

resolve与reject携带参数返回

//Promise 中resolve与reject也可携带参数返回
let p = new Promise(function(resolve, reject){
	var num = Math.ceil(Math.random()*10); //生成1-10的随机数
	if(num >= 5){
		resolve(num)
	}else{
		reject(num)
	}
});


p.then(value => {
 console.log('大于5值为:'+value)
},reason => {
 console.log('小于5值为:'+reason)
})

.then方法解决回调地狱

let p = new Promise(function(resolve, reject){
	setTimeout(function(){
		var num = Math.ceil(Math.random()*10);
		resolve(num)//假如num为5
	},)
});

//在这里你会发现每次 then 调用都会以之前的 then 调用的返回值为参数
p.then(value => {//打印5,并返回5+5
 console.log(value);
 return value + value;
})
.then(value => {//打印出10,并返回10+10
 console.log(value);
 return value + value;
}).then(value => {//打印出20
 console.log(value);
})

标签

🧐发表评论

您必须启用javascript才能在此处查看验证码