promise解决异步操作的见解
发布于 4 个月前 作者 yongningfu 559 次浏览 来自 分享

promise解决异步操作的见解

异步中 最基本的异步接口总是 functioin (args, callback)

args 是传递给这个函数的参数执行所需要的参数，callback是提供给用户的回调(其实函数的定义里面自动帮我们执行)

callback函数约定的接口是 callback(err, data) —函数定义里面一般就是直接这么执行的 callback(err, data)

可以看到 callback 的作用有三个

  1. 判断函数执行是否出错
  2. 获取函数执行完后的数据
  3. 用户获取数据后要做什么操作

这样的原生的接口会带来的嵌套问题我就不多说了 如何解决呢 promise方案(promise语法自己查看…)

下面举例子来说

第三方提供的异步接口—回调函数为参数

/**
*link 为访问服务器地址
*callback为获取数据后的回调
*/
function GET_data_from_server(link, callback);

//内部实现为
function GET_data_from_server(link, callback) {
	setTimeout(function() {
		console.log(link, 'server data');
		callback(null, 'server data');
	}, 1000);
}

下面和prommise结合

promise 一般的语法为 new promise().then().then() 为何promise能解决嵌套问题呢?

首先要用promise的话 必须先自己定义写一个库函数，是对原生的异步api的封装(为啥？ 因为你总不能修改别人的源代码吧), 所以我们要先对function GET_data_from_server(link, callback); 这个api进行一层promise封装

注意获取数据这个关键词

//这个函数为对原生api的封装 里面调用的就是原生的函数
function GET_data_from_server_promise_lib(link) {
	var promise = new Promise(function(resolve, reject) {
		//调用原生的函数--这个promise状态的确定是回调函数后才确定 而且会传递函数执行完后获取的参数
  		GET_data_from_server(link, function(err, data) {
			if (err) {
				reject(err);
			} else {
        //注意: 这里是获取数据
				resolve(data);
			}
		});
    });
    return promise;
}

上面已经利用promise对原生的api封装好了 下面就是执行了

注意获取用户自定义操作这个关键词

GET_data_from_server_promise_lib('https:www')
	//then里面的两个函数其实都是异步的 他们的执行条件为前面的promise对象状态确定
	.then(function(data) {
		//这个是用户获取数据后自定义的操作逻辑
		console.log('现在获取数据了 可以实行用户自定义操作了', data);
	}, function(err) {
		//出错处理
		console.log(err)
	});

那么我们先用promise对象,在原异步函数回调上获取数据,把数据通过promise对象传递,然后用户的自定义操作再放入then中完成,说了这么多 就想说一句话

promise的解决异步方案的思想本质就是 把获取函数执行完后的数据操作 和 用户获取数据后的自定义操作分开

从而实现了流程的控制

为何能分开（因为callback的接口是约定的 所以第三方promise库可以直接对原生的异步api封装 利用callback获取数据）

回到顶部