博客
关于我
Promise的api使用方法
阅读量:284 次
发布时间:2019-03-01

本文共 5285 字,大约阅读时间需要 17 分钟。

  •  Promise构造函数

    Promise构造函数: Promise (excutor) {}

    excutor函数: 同步执行  (resolve, reject) => {}
    resolve函数: 内部定义成功时我们调用的函数 value => {}
    reject函数: 内部定义失败时我们调用的函数 reason => {}
    说明: excutor会在Promise内部立即同步回调,异步操作在执行器中执行
         (executor 函数在Promise构造函数返回所建promise实例对象前被调用)
          resolve 和 reject 函数被调用时,分别将promise的状态改为fulfilled(完成)或rejected(失败)。
          executor 内部通常会执行一些异步操作,一旦异步操作执行完毕(可能成功/失败),
          要么调用resolve函数来将promise状态改成fulfilled,
          要么调用reject 函数将promise的状态改为rejected。
          如果在executor函数中抛出一个错误,那么该promise 状态为rejected。
          executor函数的返回值被忽略。 

new Promise((resolve, reject) => {    setTimeout(() => {        // resolve('成功的数据')        reject('失败的数据')    }, 1000)}).then(    value => {        console.log('onResolved()1', value)    }).catch(    reason => {        console.log('onRejected()1', reason)    })
  •  Promise.prototype.then()

    var p1 = new Promise((resolve, reject) => {  resolve('成功!');  // or  // reject(new Error("出错了!"));});p1.then(value => {  console.log(value); // 成功!}, reason => {  console.error(reason); // 出错了!});

    then() 方法返回一个 Promise。它最多需要有两个参数:Promise 的成功和失败情况的回调函数。

  • 返回值:当一个 Promise 完成(fulfilled)或者失败(rejected)时,返回函数将被异步调用(由当前的线程循环来调度完成)。具体的返回值依据以下规则返回。如果 then 中的回调函数:

  • 返回了一个值,那么 then 返回的 Promise 将会成为接受状态,并且将返回的值作为接受状态的回调函数的参数值。
  • 没有返回任何值,那么 then 返回的 Promise 将会成为接受状态,并且该接受状态的回调函数的参数值为 undefined
  • 抛出一个错误,那么 then 返回的 Promise 将会成为拒绝状态,并且将抛出的错误作为拒绝状态的回调函数的参数值。
  • 返回一个已经是接受状态的 Promise,那么 then 返回的 Promise 也会成为接受状态,并且将那个 Promise 的接受状态的回调函数的参数值作为该被返回的Promise的接受状态回调函数的参数值。
  • 返回一个已经是拒绝状态的 Promise,那么 then 返回的 Promise 也会成为拒绝状态,并且将那个 Promise 的拒绝状态的回调函数的参数值作为该被返回的Promise的拒绝状态回调函数的参数值。
  • 返回一个未定状态(pending)的 Promise,那么 then 返回 Promise 的状态也是未定的,并且它的终态与那个 Promise 的终态相同;同时,它变为终态时调用的回调函数参数与那个 Promise 变为终态时的回调函数的参数是相同的。

 

  • Promise.prototype.catch()

    var p1 = new Promise(function(resolve, reject) {  resolve('Success');});p1.then(function(value) {  console.log(value); // "Success!"  throw 'oh, no!';}).catch(function(e) {  console.log(e); // "oh, no!"})==== 等价于p1.then(function(value) {  console.log(value); // "Success!"  return Promise.reject('oh, no!');}).catch(function(e) {  console.log(e); // "oh, no!"})

    catch() 方法返回一个Promise,并且处理拒绝的情况。它的行为与调用Promise.prototype.then(undefined, onRejected) 相同

  • 在异步函数中抛出的错误不会被catch捕获到

  • var p2 = new Promise(function(resolve, reject) {  setTimeout(function() {    throw 'Uncaught Exception!';  }, 1000);});p2.catch(function(e) {  console.log(e); // 不会执行});

    在resolve()后面抛出的错误会被忽略

  • var p3 = new Promise(function(resolve, reject) {  resolve();  throw 'Silenced Exception!';});p3.catch(function(e) {   console.log(e); // 不会执行});

     

  • Promise.resolve()

    Promise.resolve("Success").then(function(value) {  console.log(value); // "Success"}, function(value) {  // 不会被调用});

    resolve一个数组

    var p = Promise.resolve([1,2,3]);p.then(function(v) {  console.log(v[0]); // 1});

    Resolve另一个promise

    var original = Promise.resolve(33);var cast = Promise.resolve(original);cast.then(function(value) {  console.log('value: ' + value);});console.log('original === cast ? ' + (original === cast));/**  打印顺序如下,这里有一个同步异步先后执行的区别*  original === cast ? true*  value: 33*/

     

  • Promise.reject()

  • // Promise.reject(reason)方法返回一个带有拒绝原因reason参数的Promise对象。Promise.reject("Testing static reject").then(function(reason) {  // 未被调用}, function(reason) {  console.log(reason); // "Testing static reject"});Promise.reject(new Error("fail")).then(function(result) {  // 未被调用}, function(error) {  console.log(error); // stacktrace});

     

  • Promise.all()

  • 返回一个新的promise, 只有所有的promise都成功才成功, 只要有一个失败了就直接失败

  • var p1 = Promise.resolve(3);var p2 = 1337;var p3 = new Promise((resolve, reject) => {  setTimeout(resolve, 100, 'foo');}); Promise.all([p1, p2, p3]).then(values => {   console.log(values); // [3, 1337, "foo"] });
    var p1 = new Promise((resolve, reject) => {   setTimeout(resolve, 1000, 'one'); }); var p2 = new Promise((resolve, reject) => {   setTimeout(resolve, 2000, 'two'); });var p3 = new Promise((resolve, reject) => {  setTimeout(resolve, 3000, 'three');});var p4 = new Promise((resolve, reject) => {  setTimeout(resolve, 4000, 'four');});var p5 = new Promise((resolve, reject) => {  reject('reject');});Promise.all([p1, p2, p3, p4, p5]).then(values => {   console.log(values);}).catch(reason => {   console.log(reason)});//From console: //"reject"

     

  • Promise.race()

Promise.race(iterable) 方法返回一个 promise,一旦迭代器中的某个promise解决或拒绝,返回的 promise就会解决或拒             绝。 

  • var promise1 = new Promise(function(resolve, reject) {    setTimeout(resolve, 500, 'one');});var promise2 = new Promise(function(resolve, reject) {    setTimeout(resolve, 100, 'two');});Promise.race([promise1, promise2]).then(function(value) {  console.log(value);  // Both resolve, but promise2 is faster});

Promise对象实现的 Ajax 操作的例子。

const getJSON = function(url) {  const promise = new Promise(function(resolve, reject){    const handler = function() {      if (this.readyState !== 4) {        return;      }      if (this.status === 200) {        resolve(this.response);      } else {        reject(new Error(this.statusText));      }    };    const client = new XMLHttpRequest();    client.open("GET", url);    client.onreadystatechange = handler;    client.responseType = "json";    client.setRequestHeader("Accept", "application/json");    client.send();  });  return promise;};getJSON("/posts.json").then(function(json) {  console.log('Contents: ' + json);}, function(error) {  console.error('出错了', error);});

 

 

转载地址:http://zhko.baihongyu.com/

你可能感兴趣的文章
mysql丢失更新问题
查看>>
MySQL两千万数据优化&迁移
查看>>
MySql中 delimiter 详解
查看>>
MYSQL中 find_in_set() 函数用法详解
查看>>
MySQL中auto_increment有什么作用?(IT枫斗者)
查看>>
MySQL中B+Tree索引原理
查看>>
mysql中cast() 和convert()的用法讲解
查看>>
mysql中datetime与timestamp类型有什么区别
查看>>
MySQL中DQL语言的执行顺序
查看>>
mysql中floor函数的作用是什么?
查看>>
MySQL中group by 与 order by 一起使用排序问题
查看>>
mysql中having的用法
查看>>
MySQL中interactive_timeout和wait_timeout的区别
查看>>
mysql中int、bigint、smallint 和 tinyint的区别、char和varchar的区别详细介绍
查看>>
mysql中json_extract的使用方法
查看>>
mysql中json_extract的使用方法
查看>>
mysql中kill掉所有锁表的进程
查看>>
mysql中like % %模糊查询
查看>>
MySql中mvcc学习记录
查看>>
mysql中null和空字符串的区别与问题!
查看>>