每天学点ES6 —— 了解 Promise

已发ES6文章:

1~14

15

注意注意注意

 有没有什么知识想分享给大家呢,可以发送给小编,小编帮你在这里发布(当然收益也归你,真心不多=。=)

 最好是技术文章且未曾发布在网络上,私信联系小编~

异步和回调函数

当我们做一个异步操作的时候(比如ajax请求),往往需要指定回调函数(success),并在特定的时候执行它。

//常见的ajax

$.ajax(

 url:'xx',

 success:functon(msg){

  ...

 }

)

es6 中的 Promise 让异步的回调可以通过then方法传,例如

var p=new Promise(function(resolve){

 $.ajax(

  url:'xx',

  success:resolve

 )

});

p.then(successCallback);

函数 successCallback 会在 ajax 请求成功后执行,虽然是异步操作,但是在代码上写法是同步的:

先执行异步请求 > 请求完成后(then)执行成功函数。

以上就是 Promise 的作用,当然还有其他的功能。

Promise作用

Promise 让异步操作可以以同步的形式写出来,避免了层层嵌套的尴尬。

比如 ajax 定时器 事件等。

Promise( fn(resolve,reject) ) 构造函数

用来创建Promise对象,参数是个函数,该函数可以介接收2个参数:resolve 和 reject。

- resolve(value)

函数,在你认为成功时调用它,value是你想传的值

- reject(value)

函数,在你认为失败时调用它

Promise 在实例化过程中会立马执行fn, 遇到resolve会等待回调被then方法传入后执行,遇到reject则会立即执行,此时没传入回调则报错 Uncaught (in promise)。

then(resolve, reject) 方法

将回调函数传给 Promise 对象,它和 fn(resolve,reject) 的参数对应,且回调函数传入到执行是异步的(没传入则不执行)。

  • resolve & reject 函数会在 Promise 内被调用后执行,或是在代码执行完/报错后执行。

// 形式

var promise=new Promise(function(resolve,reject){

 ...

});

promise.then(resolve,reject);

  • then是可链式调用的,也是按照顺序执行。

var p=new Promise(function(r){

 setTimeout(r,1000)

};

p.then(function(){

 console.log(1)

}).then(function(){

 console.log(2)

});

//1

//2

  • 实际上then方法必须返回新Promise对象,可以手动返回(return)也可默认返回(单纯执行resolve),因为返回了新Promise,所以可以链式调用

  • then方法的返回值会被传入下一个then方法的回调函数里

var p=new Promise(

 function(resolve,reject){

  resolve()

 }

);

p.then(function(){

 console.log(1);

 return 2;

}).then(function(x){

 console.log(x)

});

//1

//2

文章到这里结束,下篇 ☞ Promise下

关注一下不迷路~


每天学点ES6 —— 了解 Promise

【html】【css】【html】【css】【javascript】【html】【javascript】【css】【javascript】【css】


分享到:


相關文章: