Promise 的基础用法

admin50条评论 8,074 次浏览

Promise 的含义

Promise 是异步编程的一种解决方案,比传统的解决方案–回调函数和事件--更合理和更强大。它由社区最早提出和实现,ES6将其写进了语言标准,统一了语法,原生提供了Promise

所谓Promise ,简单说就是一个容器,里面保存着某个未来才回结束的事件(通常是一个异步操作)的结果。从语法上说,Promise是一个对象,从它可以获取异步操作的消息。
Promise 对象的状态不受外界影响

三种状态:

  • pending:进行中
  • fulfilled :已经成功
  • rejected 已经失败

状态改变:
Promise对象的状态改变,只有两种可能:

  • 从pending变为fulfilled
  • 从pending变为rejected。

这两种情况只要发生,状态就凝固了,不会再变了,这时就称为resolved(已定型)

基本用法

ES6规定,Promise对象是一个构造函数,用来生成Promise实例

const promist = new Promise(function(resolve,reject){
    if(/*异步操作成功*/){
        resolve(value);
    }else{
        reject(error);
    }
})

resolve函数的作用是,将Promise对象的状态从“未完成”变为“成功”(即从 pending 变为 resolved),在异步操作成功时调用,并将异步操作的结果,作为参数传递出去;
reject函数的作用是,将Promise对象的状态从“未完成”变为“失败”(即从 pending 变为 rejected),在异步操作失败时调用,并将异步操作报出的错误,作为参数传递出去。

Promise 实例生成以后,可以用then 方法分别指定resolved状态和rejected状态的回调函数。

promise.then(function(value){
//success
},function(error){
//failure
});

例子:

function timeout(ms){
    return new Promise((resolve,reject)=>{
        setTimeout(resolve,ms,'done');
    });
}
timeout(100).then((value)=>{
    console.log(value);
});
let promise = new Promise(function(resolve,reject){
    console.log('Promise');
    resolve();
});
promise.then(function(){
    console.log('resolved');
});
console.log('Hi!');

//Promise
//Hi!
//resolved
//异步加载图片
function loadImageAsync(url){
    return new Promise(function(resolve,reject){
        const image = new Image();
        image.onload = function(){
            resolve(image);
        };
        image.onerror = function(){
            reject(new Error('error');
        };
        image.src = url;
    });
}

下面是一个用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);
});

50 thoughts on “ Promise 的基础用法 ”

  1. female viagra

    female viagra

    female viagra

  2. sildenafil tablets

    sildenafil tablets

    sildenafil tablets

  3. viagra 100mg

    viagra 100mg

    viagra 100mg

  4. viagra generic

    viagra generic

    viagra generic

  5. viagra tablet

    viagra tablet

    viagra tablet

  6. viagra tablets

    viagra tablets

    viagra tablets

  7. buy viagra

    buy viagra

    buy viagra

  8. buy cialis

    buy cialis

    buy cialis

  9. prednisone 20 mg

    prednisone 20 mg

    prednisone 20 mg

  10. buy sildenafil

    buy sildenafil

    buy sildenafil

  11. cialis generic

    cialis generic

    cialis generic

  12. sildenafil

    sildenafil

    sildenafil

  13. cialis 20mg

    cialis 20mg

    cialis 20mg

  14. sildenafil citrate

    sildenafil citrate

    sildenafil citrate

  15. cialis prices

    cialis prices

    cialis prices

  16. viagra online

    viagra online

    viagra online

  17. sildenafil 20 mg

    sildenafil 20 mg

    sildenafil 20 mg

  18. viagra coupons

    viagra coupons

    viagra coupons

  19. sildenafil generic

    sildenafil generic

    sildenafil generic

  20. cialis online

    cialis online

    cialis online

  21. viagra doctor prescription

    viagra doctor prescription

    viagra doctor prescription

  22. sildenafil 50 mg

    sildenafil 50 mg

    sildenafil 50 mg

  23. cialis tablets

    cialis tablets

    cialis tablets

  24. sildenafil 100mg

    sildenafil 100mg

    sildenafil 100mg

  25. tadalafil 20mg

    tadalafil 20mg

    tadalafil 20mg

  26. sildenafil 100

    sildenafil 100

    sildenafil 100

  27. cialis pills

    cialis pills

    cialis pills

  28. sildenafil coupons

    sildenafil coupons

    sildenafil coupons

  29. sildenafil 100 mg

    sildenafil 100 mg

    sildenafil 100 mg

  30. cheap cialis

    cheap cialis

    cheap cialis

  31. sildenafil citrate 100mg

    sildenafil citrate 100mg

    sildenafil citrate 100mg

  32. buy cialis online

    buy cialis online

    buy cialis online

  33. cialis tadalafil

    cialis tadalafil

    cialis tadalafil

  34. sildenafil citrate tablets

    sildenafil citrate tablets

    sildenafil citrate tablets

  35. tadalafil generic

    tadalafil generic

    tadalafil generic

  36. sildenafil citrate pricing

    sildenafil citrate pricing

    sildenafil citrate pricing

  37. prozac generic

    prozac generic

    prozac generic

  38. bactrim ds

    bactrim ds

    bactrim ds

  39. biaxin antibiotic

    biaxin antibiotic

    biaxin antibiotic

  40. ceftin antibiotic

    ceftin antibiotic

    ceftin antibiotic

  41. cephalexin 500mg

    cephalexin 500mg

    cephalexin 500mg

  42. ciprofloxacin 500mg

    ciprofloxacin 500mg

    ciprofloxacin 500mg

  43. fluconazole 150 mg

    fluconazole 150 mg

    fluconazole 150 mg

  44. levofloxacin 500 mg

    levofloxacin 500 mg

    levofloxacin 500 mg

  45. levitra

    levitra

    levitra

  46. generic cialis

    generic cialis

    generic cialis

  47. cefdinir 300 mg

    cefdinir 300 mg

    cefdinir 300 mg

  48. fluoxetine 20 mg

    fluoxetine 20 mg

    fluoxetine 20 mg

  49. bactrim antibiotic

    bactrim antibiotic

    bactrim antibiotic

  50. azithromycin 250 mg

    azithromycin 250 mg

    azithromycin 250 mg

评论被PO主关闭了