1
0
mirror of https://github.com/ruanyf/es6tutorial.git synced 2025-05-25 19:22:21 +00:00

edit promise

This commit is contained in:
ruanyf 2015-10-24 20:14:33 +08:00
parent 5c76160bc0
commit 990f2106be

View File

@ -36,9 +36,9 @@ var promise = new Promise(function(resolve, reject) {
});
```
Promise构造函数接受一个函数作为参数该函数的两个参数分别是resolve和reject。它们是两个函数由JavaScript引擎提供不用自己部署。
Promise构造函数接受一个函数作为参数该函数的两个参数分别是`resolve``reject`。它们是两个函数由JavaScript引擎提供不用自己部署。
resolve函数的作用是将Promise对象的状态从“未完成”变为“成功”即从Pending变为Resolved在异步操作成功时调用并将异步操作的结果作为参数传递出去reject函数的作用是将Promise对象的状态从“未完成”变为“失败”即从Pending变为Rejected在异步操作失败时调用并将异步操作报出的错误作为参数传递出去。
`resolve`函数的作用是将Promise对象的状态从“未完成”变为“成功”即从Pending变为Resolved在异步操作成功时调用并将异步操作的结果作为参数传递出去`reject`函数的作用是将Promise对象的状态从“未完成”变为“失败”即从Pending变为Rejected在异步操作失败时调用并将异步操作报出的错误作为参数传递出去。
Promise实例生成以后可以用then方法分别指定Resolved状态和Reject状态的回调函数。
@ -50,7 +50,7 @@ promise.then(function(value) {
});
```
then方法可以接受两个回调函数作为参数。第一个回调函数是Promise对象的状态变为Resolved时调用第二个回调函数是Promise对象的状态变为Reject时调用。其中第二个函数是可选的不一定要提供。这两个函数都接受Promise对象传出的值作为参数。
`then`方法可以接受两个回调函数作为参数。第一个回调函数是Promise对象的状态变为Resolved时调用第二个回调函数是Promise对象的状态变为Reject时调用。其中第二个函数是可选的不一定要提供。这两个函数都接受Promise对象传出的值作为参数。
下面是一个Promise对象的简单例子。
@ -66,7 +66,7 @@ timeout(100).then((value) => {
});
```
上面代码中timeout方法返回一个Promise实例表示一段时间以后才会发生的结果。过了指定的时间ms参数以后Promise实例的状态变为Resolved就会触发then方法绑定的回调函数。
上面代码中,`timeout`方法返回一个Promise实例表示一段时间以后才会发生的结果。过了指定的时间`ms`参数以后Promise实例的状态变为Resolved就会触发`then`方法绑定的回调函数。
下面是异步加载图片的例子。
@ -119,9 +119,9 @@ getJSON("/posts.json").then(function(json) {
});
```
上面代码中getJSON是对XMLHttpRequest对象的封装用于发出一个针对JSON数据的HTTP请求并且返回一个Promise对象。需要注意的是在getJSON内部resolve函数和reject函数调用时都带有参数。
上面代码中,`getJSON`是对XMLHttpRequest对象的封装用于发出一个针对JSON数据的HTTP请求并且返回一个Promise对象。需要注意的是`getJSON`内部,`resolve`函数和`reject`函数调用时,都带有参数。
如果调用resolve函数和reject函数时带有参数那么它们的参数会被传递给回调函数。reject函数的参数通常是Error对象的实例表示抛出的错误resolve函数的参数除了正常的值以外还可能是另一个Promise实例表示异步操作的结果有可能是一个值也有可能是另一个异步操作比如像下面这样。
如果调用`resolve`函数和`reject`函数时带有参数,那么它们的参数会被传递给回调函数。`reject`函数的参数通常是Error对象的实例表示抛出的错误`resolve`函数的参数除了正常的值以外还可能是另一个Promise实例表示异步操作的结果有可能是一个值也有可能是另一个异步操作比如像下面这样。
```javascript
var p1 = new Promise(function(resolve, reject){
@ -154,9 +154,9 @@ p2.catch(error => console.log(error))
## Promise.prototype.then()
Promise实例具有then方法也就是说then方法是定义在原型对象Promise.prototype上的。它的作用是为Promise实例添加状态改变时的回调函数。前面说过then方法的第一个参数是Resolved状态的回调函数第二个参数可选是Rejected状态的回调函数。
Promise实例具有`then`方法,也就是说,`then`方法是定义在原型对象Promise.prototype上的。它的作用是为Promise实例添加状态改变时的回调函数。前面说过`then`方法的第一个参数是Resolved状态的回调函数第二个参数可选是Rejected状态的回调函数。
then方法返回的是一个新的Promise实例注意不是原来那个Promise实例。因此可以采用链式写法即then方法后面再调用另一个then方法。
`then`方法返回的是一个新的Promise实例注意不是原来那个Promise实例。因此可以采用链式写法`then`方法后面再调用另一个`then`方法。
```javascript
getJSON("/posts.json").then(function(json) {
@ -166,9 +166,9 @@ getJSON("/posts.json").then(function(json) {
});
```
上面的代码使用then方法依次指定了两个回调函数。第一个回调函数完成以后会将返回结果作为参数传入第二个回调函数。
上面的代码使用`then`方法,依次指定了两个回调函数。第一个回调函数完成以后,会将返回结果作为参数,传入第二个回调函数。
采用链式的then可以指定一组按照次序调用的回调函数。这时前一个回调函数有可能返回的还是一个Promise对象即有异步操作这时后一个回调函数就会等待该Promise对象的状态发生变化才会被调用。
采用链式的`then`可以指定一组按照次序调用的回调函数。这时前一个回调函数有可能返回的还是一个Promise对象即有异步操作这时后一个回调函数就会等待该Promise对象的状态发生变化才会被调用。
```javascript
getJSON("/post/1.json").then(function(post) {
@ -180,7 +180,7 @@ getJSON("/post/1.json").then(function(post) {
});
```
上面代码中第一个then方法指定的回调函数返回的是另一个Promise对象。这时第二个then方法指定的回调函数就会等待这个新的Promise对象状态发生变化。如果变为Resolved就调用funcA如果状态变为Rejected就调用funcB。
上面代码中,第一个`then`方法指定的回调函数返回的是另一个Promise对象。这时第二个`then`方法指定的回调函数就会等待这个新的Promise对象状态发生变化。如果变为Resolved就调用`funcA`如果状态变为Rejected就调用`funcB`
如果采用箭头函数,上面的代码可以写得更简洁。
@ -206,7 +206,7 @@ getJSON("/posts.json").then(function(posts) {
});
```
上面代码中getJSON方法返回一个Promise对象如果该对象状态变为Resolved则会调用then方法指定的回调函数如果异步操作抛出错误状态就会变为Rejected就会调用catch方法指定的回调函数处理这个错误。
上面代码中,`getJSON`方法返回一个Promise对象如果该对象状态变为Resolved则会调用`then`方法指定的回调函数如果异步操作抛出错误状态就会变为Rejected就会调用`catch`方法指定的回调函数,处理这个错误。
```javascript
p.then((val) => console.log("fulfilled:", val))
@ -228,7 +228,7 @@ promise.catch(function(error) { console.log(error) });
// Error: test
```
上面代码中Promise抛出一个错误就被catch方法指定的回调函数捕获。
上面代码中Promise抛出一个错误就被`catch`方法指定的回调函数捕获。
如果Promise状态已经变成resolved再抛出错误是无效的。
@ -243,9 +243,9 @@ promise
// ok
```
上面代码中Promise在resolve语句后面再抛出错误不会被捕获等于没有抛出。
上面代码中Promise在`resolve`语句后面,再抛出错误,不会被捕获,等于没有抛出。
Promise对象的错误具有“冒泡”性质会一直向后传递直到被捕获为止。也就是说错误总是会被下一个catch语句捕获。
Promise对象的错误具有“冒泡”性质会一直向后传递直到被捕获为止。也就是说错误总是会被下一个`catch`语句捕获。
```javascript
getJSON("/post/1.json").then(function(post) {
@ -257,9 +257,32 @@ getJSON("/post/1.json").then(function(post) {
});
```
上面代码中一共有三个Promise对象一个由getJSON产生两个由then产生。它们之中任何一个抛出的错误都会被最后一个catch捕获。
上面代码中一共有三个Promise对象一个由`getJSON`产生,两个由`then`产生。它们之中任何一个抛出的错误,都会被最后一个`catch`捕获。
跟传统的try/catch代码块不同的是如果没有使用catch方法指定错误处理的回调函数Promise对象抛出的错误不会传递到外层代码即不会有任何反应。
一般来说,不要在`then`方法里面定义Rejection状态的回调函数`then`的第二个参数),总是使用`catch`方法。
```javascript
// bad
promise
.then(function(data) {
// success
}, function(err) {
// error
});
// good
promise
.then(function(data) { //cb
// success
})
.catch(function(err) {
// error
});
```
上面代码中第二种写法要好于第一种写法理由是前者更接近同步的写法try/catch
跟传统的try/catch代码块不同的是如果没有使用`catch`方法指定错误处理的回调函数Promise对象抛出的错误不会传递到外层代码即不会有任何反应。
```javascript
var someAsyncThing = function() {
@ -274,7 +297,7 @@ someAsyncThing().then(function() {
});
```
上面代码中someAsyncThing函数产生的Promise对象会报错但是由于没有指定catch方法这个错误不会被捕获也不会传递到外层代码导致运行后没有任何输出。
上面代码中,`someAsyncThing`函数产生的Promise对象会报错但是由于没有指定`catch`方法,这个错误不会被捕获,也不会传递到外层代码,导致运行后没有任何输出。
```javascript
var promise = new Promise(function(resolve, reject) {
@ -288,7 +311,7 @@ promise.then(function(value) { console.log(value) });
上面代码中Promise指定在下一轮“事件循环”再抛出错误结果由于没有指定使用try...catch语句就冒泡到最外层成了未捕获的错误。因为此时Promise的函数体已经运行结束了所以这个错误是在Promise函数体外抛出的。
Node.js有一个unhandledRejection事件专门监听未捕获的reject错误。
Node.js有一个`unhandledRejection`事件,专门监听未捕获的`reject`错误。
```javascript
process.on('unhandledRejection', function (err, p) {
@ -296,7 +319,7 @@ process.on('unhandledRejection', function (err, p) {
});
```
上面代码中unhandledRejection事件的监听函数有两个参数第一个是错误对象第二个是报错的Promise实例它可以用来了解发生错误的环境信息。。
上面代码中,`unhandledRejection`事件的监听函数有两个参数第一个是错误对象第二个是报错的Promise实例它可以用来了解发生错误的环境信息。。
需要注意的是catch方法返回的还是一个Promise对象因此后面还可以接着调用then方法。
@ -319,9 +342,9 @@ someAsyncThing().then(function() {
// carry on
```
上面代码运行完catch方法指定的回调函数会接着运行后面那个then方法指定的回调函数。
上面代码运行完`catch`方法指定的回调函数,会接着运行后面那个`then`方法指定的回调函数。
catch方法之中还能再抛出错误。
`catch`方法之中,还能再抛出错误。
```javascript
var someAsyncThing = function() {
@ -343,7 +366,7 @@ someAsyncThing().then(function() {
// oh no [ReferenceError: x is not defined]
```
上面代码中catch方法抛出一个错误因为后面没有别的catch方法了导致这个错误不会被捕获也不会传递到外层。如果改写一下结果就不一样了。
上面代码中,`catch`方法抛出一个错误,因为后面没有别的`catch`方法了,导致这个错误不会被捕获,也不会传递到外层。如果改写一下,结果就不一样了。
```javascript
someAsyncThing().then(function() {
@ -359,7 +382,7 @@ someAsyncThing().then(function() {
// carry on [ReferenceError: y is not defined]
```
上面代码中第二个catch方法用来捕获前一个catch方法抛出的错误。
上面代码中,第二个`catch`方法用来捕获,前一个`catch`方法抛出的错误。
## Promise.all()