Promise对象

Promise对象

描述

所有Promise，就是一个对象， 用来传递异步操作的消息; 单词意思 ： 承诺； 承诺其拥有的状态不受外界影响

• 对象有三个状态[Pending, Resolved, Rejected], 不受外界影响

• 状态变化：Pending->Resolved, Pending->Rejected

• 一旦状态改变，就不会再变，任何时候都能得到这个结果

• 缺点

• 无法中途取消

• 如果不设置回调，内部抛出的异常不会反应到外部

• 当处于pending时，无法得知具体的进度

基本用法

var promise = new Promise(function(resolve, reject){
	//... some code
	if(/* 异步操作成功 */) {
		resolve(value);
	}else{
		reject(value);
	}
});

promise.then(function success(){}, function error(){});

示例实现ajax

test.json
{
	"name":"张三",
	"age": 12
}

function ajax({
	url,
	success,
	error
}) {
	var promise = new Promise(function(resolve, reject) {
		_sendXHR(resolve, reject);
	});

	function _sendXHR(resolve, reject) {
		var xhr = new XMLHttpRequest();
		xhr.onreadystatechange = _handle;

		function _handle() {
			if (xhr.readyState != 4) {
				return;
			}
			alert(xhr.status)
			if (xhr.status == 200 || xhr.status == 206) {
				resolve(xhr.responseText);
				return;
			}
			reject("请求错误");
		}

		xhr.open("get", url, true);
		xhr.send(null);
	}
	promise.then(success, error);
}

ajax({
	url: './test.json',
	success: function(message) {
		console.info('ok:' + message);
	},
	error: function(err) {
		console.info('err:' + err);
	}
});
console.info('异步');

then()

Promise.prototype.then(resovled, reject)
用于添加处理的回调函数

• then 返回的是一个新的Promise对象 可以链式调用回调函数
• then().then()

catch()

• catch() = then(null , reject), 用于捕捉错误的回调函数

all() race()

• all() 包装多个promise成一个promise; 所有都变化了总的才会变
• race() 包装多个promise成一个promise; 只要有一个变化了，总的就会变

Promise.resolve() Promise.reject()

• 将现有对象转换成一个promise对象
• reject与resolve同理

var helloPromise = Promise.resolve('hello');
helloPromise.then((name)=>console.info(name)); // hello

done

以done结尾可以防止链式调用时出错的地方有事件处理

Promise.prototype.done = function(onresolve, onreject) {
	this.then(onresolve, onreject)
		.catch(null, function onreject(err) {
		setTimeout(function(){
			throw err;
		}, 0);
	})
}