欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

Promise用法

程序员文章站 2022-07-02 22:55:44
...

promise是一个构造函数 ,自己身上有all,reject,resolve这几个方法,原型上有then,catch方法

function runAsync(){
let p = new Promise(function(resolve,reject){
setTimeout(function(){
console.log('执行完成');
resolve('随便')
},2000)
})
return p;
}	

//包装来的promise对象有then和catch方法。接下来 看下面的例子

runAnsy().then(function(data){
//在runAnsy()的返回上直接调用then方法,then接受一个参数,是函数,并且会拿到我们在runansy中调用resolve时传递的参数。
console.log(data+'qqqq') //在两秒之后会输出 执行完成,紧接着输出 随便
})

//从便面看promise能简化层层回调的写法。但是实质上	promise的精髓是状态用维护状态、传递状态的方式来使得回调函数能够及时调用,它比传递callback函数要简单、灵活的多。所以使用Promise的正确场景是这样的
//链式操作的用法
			runAsync1().then(function (data) {
				console.log(data);
				return runAsync2();
			})
				.then(function (data) {
					console.log(data);
					return runAsync3();
				})
				.then(function (data) {
					console.log(data);
					return runAsync()
				})
//reject的用法
//我们前面的例子都是只有“执行成功”的回调,还没有“失败”的情况,reject的作用就是把Promise的状态置为rejected,这样我们在then中就能捕捉到,然后执行“失败”情况的回调。

function getNumber(){
var w=new promise(function(resolve,reject){
setTimeout({
let num = Math.cail(Math.random()*10);
num <=5? resolve(num) : reject('数字太大'+num);
})
})
}

getNumber()
	.then(
	(data) => {
	console.log('resolved' + data)
	console.log(somedata);
	},
	(reason, data) => { console.log('rejected' + reason) })
	.catch((reason) => {
	//效果和写在then的第二个参数里面一样。不过它还有另外一个作用:在执行resolve的回调(也就是上面then中的第一个参数)时,
	//如果抛出异常了(代码出错了),那么并不会报错卡死js,而是会进到这个catch方法中。
	console.log('rejected---------' + reason);
	})
//all的用法

//Promise的all方法提供了并行执行异步操作的能力,并且在所有异步操作执行完后才执行回调。我们仍旧使用上面定义好的runAsync1、runAsync2、runAsync3这三个函数,看下面的例子:
			Promise.all([runAsync1(), runAsync2(), runAsync3()])
			.then(function (results) { console.log(results); });
	//有了all,你就可以并行执行多个异步操作,并且在一个回调中处理所有的返回数据,是不是很酷?有一个场景是很适合用这个的,一些游戏类的素材比较多的应用,打开网页时,
	//预先加载需要用到的各种资源如图片、flash以及各种静态文件。所有的都加载完后,我们再进行页面的初始化。