Promise补全
This commit is contained in:
sookie
parent
0b9bfa8685
commit
ecfe262458
@ -19,7 +19,7 @@ Jenkins是一款由Java编写的开源的**持续集成**工具
|
||||
```bash
|
||||
java -jar jenkins.war
|
||||
```
|
||||
默认在8080端口运行
|
||||
默认在8080端口运行, 修改运行端口可以加参数`--httpPort=8081`
|
||||
运行之后访问可以进行初始化操作
|
||||
输入首次运行时生成的初始化密码
|
||||
|
||||
|
||||
@ -13,7 +13,7 @@ categories:
|
||||
例如 : 使用定时器去执行一个回调函数
|
||||
```javascript
|
||||
function callback(){
|
||||
console.debug("Time Out!");
|
||||
console.debug("Time Out!");
|
||||
}
|
||||
console.log("before");
|
||||
setTimeout(callback,1000);
|
||||
@ -32,11 +32,11 @@ Ajax的异步请求也是一种异步操作
|
||||
```javascript
|
||||
var status = true;
|
||||
function test(resolve, reject) {
|
||||
if (status) {
|
||||
resolve('success');
|
||||
} else {
|
||||
reject('failed');
|
||||
}
|
||||
if (status) {
|
||||
resolve('success');
|
||||
} else {
|
||||
reject('failed');
|
||||
}
|
||||
}
|
||||
var p1 = new Promise(test);
|
||||
//then传入的是resolve的实现
|
||||
@ -44,10 +44,11 @@ var p1 = new Promise(test);
|
||||
p1.then(console.log).catch(console.error);
|
||||
/*
|
||||
也可以用如下的方式, 实际效果同上
|
||||
p1.then(console.log, console.log);
|
||||
p1.then(console.log, console.error);
|
||||
*/
|
||||
```
|
||||
Promise对象在创建的时候 , 传入的这个函数当中并不关心成功与失败具体的回调是什么 , 而只是关心何时去执行该回调函数
|
||||
Promise对象在创建的时候 , 接收一个函数(这个函数是同步执行的)
|
||||
传入的这个函数当中并不关心成功与失败具体的回调是什么 , 而只是关心何时去执行该回调函数
|
||||
|
||||
Promise对象有3种状态
|
||||
1. `Fulfilled` 成功的状态
|
||||
@ -64,22 +65,24 @@ Promise对象有3种状态
|
||||
```javascript
|
||||
var status = true;
|
||||
function test(resolve, reject) {
|
||||
if (status) {
|
||||
resolve('success');
|
||||
} else {
|
||||
reject('failed');
|
||||
}
|
||||
//这里的代码是同步执行的
|
||||
console.log('立即执行')
|
||||
if (status) {
|
||||
resolve('success')
|
||||
} else {
|
||||
reject('failed')
|
||||
}
|
||||
}
|
||||
var p1 = new Promise(test);
|
||||
p1
|
||||
.then(function(msg){
|
||||
console.log("我是第一个回调函数:" + msg);
|
||||
return msg;
|
||||
p1.then(function(msg){
|
||||
// 这里的代码是异步执行的
|
||||
console.log("我是第一个回调函数:" + msg)
|
||||
return msg
|
||||
})
|
||||
.then(function(msg){
|
||||
console.log("我是第二个回调函数:" + msg);
|
||||
console.log("我是第二个回调函数:" + msg)
|
||||
})
|
||||
.catch(console.error);
|
||||
.catch(console.error)
|
||||
```
|
||||
当然上面这种方式只能适用于多重回调函数中只有一个参数的情况
|
||||
如果要传多个参数
|
||||
|
||||
@ -13,54 +13,108 @@ categories:
|
||||
Promise的主要意义是在于解决多重回调的多层嵌套问题
|
||||
如果回调的嵌套层级太多 , 会造成代码可读性很差 , 难以维护
|
||||
<!-- more -->
|
||||
例如
|
||||
如果我们要使用setTimeout来构造一个顺序异步执行的过程
|
||||
需要这样做
|
||||
```javascript
|
||||
var test = function(num, func) {
|
||||
console.log(num);
|
||||
func(num);
|
||||
};
|
||||
function test(num, func) {
|
||||
setTimeout(function(){
|
||||
console.log(num)
|
||||
func(num)
|
||||
}, 0)
|
||||
}
|
||||
test(1, function(a){
|
||||
test(2, function(b){
|
||||
test(3, function(c){
|
||||
console.log("回调成功");
|
||||
});
|
||||
});
|
||||
});
|
||||
console.log("回调成功")
|
||||
})
|
||||
})
|
||||
})
|
||||
```
|
||||
使用Promise可以将上述的代码改造成线性的模式 , 可读性增强 , 同时也更便于调试
|
||||
```javascript
|
||||
var pro = new Promise(function(resolve, reject){
|
||||
resolve(1);
|
||||
new Promise(function(resolve, reject){
|
||||
resolve(1)
|
||||
}).then(function(val){
|
||||
console.log(val);
|
||||
console.log(val)
|
||||
return new Promise(function(resolve, reject){
|
||||
resolve(2);
|
||||
});
|
||||
resolve(2)
|
||||
})
|
||||
}).then(function(val){
|
||||
console.log(val);
|
||||
console.log(val)
|
||||
return new Promise(function(resolve, reject){
|
||||
resolve(3);
|
||||
});
|
||||
resolve(3)
|
||||
})
|
||||
}).then(function(val){
|
||||
console.log(val);
|
||||
});
|
||||
console.log(val)
|
||||
})
|
||||
```
|
||||
让then方法的函数每次都是返回不同的Promise实例 , 再去指定这个实例的回调函数即可
|
||||
|
||||
并且对于Promise对象 , 它的回调执行是异步的
|
||||
并且对于Promise对象 , 它对于resolve和reject的执行是异步的
|
||||
例如 :
|
||||
```javascript
|
||||
new Promise(function(resolve, reject){
|
||||
resolve("AA");
|
||||
console.log("AA");
|
||||
resolve("BB");
|
||||
}).then(function(msg){
|
||||
console.log(msg);
|
||||
});
|
||||
console.log("BB");
|
||||
console.log("CC");
|
||||
/* output:
|
||||
BB
|
||||
AA
|
||||
CC
|
||||
BB
|
||||
*/
|
||||
```
|
||||
对于异步操作实现的原理 , 可以参考JS的事件驱动模型
|
||||
JS引擎会将回调函数的执行加入到事件队列当中
|
||||
从而实现在单线程的条件下 , 代码的异步执行
|
||||
|
||||
---
|
||||
#### Promise.resolve 和 Promise.reject
|
||||
`Promise.resolve`方法会返回一个Promise实例
|
||||
分为下面几种情况
|
||||
1. 参数是一个Promise实例
|
||||
将不做任何修改, 直接返回这个Promise实例
|
||||
|
||||
2. 参数是一个thenable对象
|
||||
thenable对象意思是这个对象当中带有then属性, 值是一个函数, 接收参数resolve和reject两个函数
|
||||
```javascript
|
||||
const p1 = Promise.resolve({
|
||||
then: (resolve, reject) => {
|
||||
resolve('异步回调执行')
|
||||
}
|
||||
})
|
||||
// 等价于如下写法
|
||||
const p2 = new Promise((resolve, reject) => {
|
||||
resolve('异步回调执行')
|
||||
})
|
||||
```
|
||||
|
||||
3. 参数是不具有then方法的对象
|
||||
```javascript
|
||||
const p1 = Promise.resolve('Hello')
|
||||
// 等价于如下写法
|
||||
new Promise((resolve, reject) => {
|
||||
resolve('Hello')
|
||||
})
|
||||
```
|
||||
|
||||
4. 没有任何参数
|
||||
```javascript
|
||||
const p1 = Promise.resolve()
|
||||
// 等价于如下写法
|
||||
new Promise((resolve, reject) => {
|
||||
resolve()
|
||||
})
|
||||
```
|
||||
其实实际效果可以归为到第三类
|
||||
|
||||
---
|
||||
`Promise.reject`方法就相对比较简单了
|
||||
只有这一种情况
|
||||
```javascript
|
||||
Promise.reject('Error')
|
||||
// 等价于如下写法
|
||||
new Promise((resolve, reject) => {
|
||||
reject('Error')
|
||||
})
|
||||
```
|
||||
不论传入什么参数, 都会传递给reject
|
||||
Loading…
x
Reference in New Issue
Block a user