Promise 了解一下

1.概念

Promise是异步编程的一种解决方案.它现被ES6收录原生提供了其对象

2.特点

(1)状态不受外界影响.Promise对象代表一个异步操作,有三种状态:pending(进行中),fulfilled(已成功)和rejected(已失败).只有异步操作的结果可以决定当前是哪一种状态,任何其他操作都无法改变状态

(2)一旦改变就不会再变,任何时候都可以得到这个结果.Promise对象状态的的改变为:pending到fulfilled ,pending到rejected.只要这两种情况发生了,状态就凝固了,不会再变了.这时就称为resolved(已定型)

3.缺点

(1)取法取消Promise,一旦创建它就会立即执行,无法中途取消

(2)如果不设置回调函数,Promise内部抛出的错误不会反应到外部 

(3)当处于pending状态时,无法得知目前进展到哪一个阶段

(4)基本用法

ES6 中,Promise对象是一个构造函数

实例:

let promise = new Promise(
	function(resolve,reject){
		console.log('Promise');
		resolve();
		console.log('wacheng')
	}
);
promise.then(function() {
	console.log('resolved');
	})
console.log('hi!')
// 结果
// Promise
// wacheng
//以上结果是因为Promise一旦创建就立即执行
// Hi!			
// resolved
// 由上面的结果得出的结论是:Promise对象一旦创建就会立即执行,then指定的函数是在当前作用域内的所有脚本执行完成之后才会执行

利用Promise封装一个ajax

var getJson = function (url) {
					var promise = new Promise(function(resolve, reject){				
						var handler = function () {
							if (this.readyState !==4) {
								return;
							}
							if (this.status ===200) {
								//带有的参数会传递给回调函数
								resolve(this.response)
							}
							else {
								//reject的参数通常是Error对象的实例,表示抛出错误
								reject(new Error(this.statusText))
							}
						};
						var client = new XMLHttpRequest();
						client.open('GET',url);
						client.onreadystatechange = handler;
						client.responseType = 'json';
						client.setRequestHeader('Accept', 'application/json');
						client.send();
					});					
					return promise;
				}
				getJson('/test/data/oftenGoods.json').then(function(json){					
					console.log('Content:'+JSON.stringify(json));
				},function(error){
					console.error('出错了',error);
				});	

//Promise实例作为参数
			const p1 = new Promise(function(resolve,reject){
				setTimeout(()=>{
					reject(new Error('fail'))
				},3000)
			})
			const p2 = new Promise(function(resolve,reject){
				setTimeout(() => {
					resolve(p1)
				}, 1000);
			})
			
			p2.then(result => console.log(result)).catch(error => console.log(error))
			// 输出的结果为: Error: test
			// 结论:当Promise作为参数时,则调用p2时,p2自身的状态失效其全部由p1决定

猜你喜欢

转载自blog.csdn.net/weixin_42011096/article/details/80927358