Post

Promise 使用方法

Posted
By Jo Cruise 2 min read

Promise的基本使用

Promise是一个构造函数，通过new关键字实例化对象

语法

1

new Promise((resolve, reject) => {})
  • 接受一个函数作为参数
  • 在参数函数中接受两个参数
    • resolve
    • reject

Promise实例

Promise实例有两个属性

  • state
  • result

Promise的状态

  • pending
  • fulfilled
  • rejected

Promise状态的改变

通过调用resolve()和reject()改变当前Promise对象的状态

1
2
3
4
5

const p = new Promise((resolve, reject) => {
  // resolve(); 调用函数，使当前Promise对象的状态改为fulfilled
  // reject(); 调用函数，使当前Promise对象的状态改为rejected
})
console.dir(p); //fulfilled

Promise状态的改变是一次性的

Promise的结果

1
2
3
4
5
6

const p = new Promise((resolve, reject) => {
  // 调用函数，传递参数，改变丹铅Promise对象的结果
	// resolve('success result');
  // reject('fail result');
})
console.dir(p);

Promise的方法

then方法

返回值是一个Promise对象

1
2
3
4
5
6
7
8
9
10

const p = new Promise((resolve, reject) => {
  resolve('success');
})

p.then((value) => {
  console.log('成功时调用', value);
}), (reason) => {
  console.log('失败时调用', reason);
}
console.dir(p);

Promise状态不改变不会执行then方法

使用return可以将实例的状态改为fulfilled，return的值会作为下一个then的参数。在前一个实例中出错则状态改为rejected

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

const p = new Promise((resolve, reject) => {
  resolve('success');
})

p.then((value) => {
  console.log('成功时调用', value);
  return 1;
}), (reason) => {
  console.log('失败时调用', reason);
  return -1;
}.then((value) => {
  console.log('成功时调用', value);
}), (reason) => {
  console.log('失败时调用', reason);
}

catch方法

1
2
3
4
5

const p = new Promise((resolve, reject) => {
  throw new Error('Error occured');
}).catch ((reason) => {
  console.log('Failed', reason)
})

当Promise的状态改为rejected或Promise执行体中出现代码错误时，catch方法被执行

Notes, Front-end
promise function
This post is licensed under CC BY 4.0 by the author.