JavaScript promise confusion

2019-06-23 22:24发布

问题:

I'm trying to grasp the concept of javascript promise. But I'm getting some problems. I set up a very small web service locally(don't get angry, the web service does not conform to conventions). Here some details about it

/login/<username>/<password> ==> login into the system, the correct username and password is both noor

if user is login, a call can be made on /car/<brand>/<color>/<plate_number>,

I'm not performing any validation on the type of color,brand,platenumber

This one works perfectly fine, I'm logging and adding a car

$.ajax({type: "GET",url: url+"/login/noor/noor"})
                .then(function( data, textStatus, jqXHR ) {console.log("login success");},function(){console.log("login error");})
                .then($.ajax({type: "GET",url: url+"/car/1/1/1"}))
                .then(function(){console.log("car added");},function(){console.log("car not added");});

This one perfectly shows an error because an invalid url is used:

$.ajax({type: "GET",url: url+"/carasdsad/1/1/1"})
                .then(function(){console.log("car added");},function(){console.log("car not added");});

"/carasdsad/1/1/1" is an invalid url and car not added is returned

I'm getting a problem with this one. The code below uses the code just above. I was expecting car not added to be shown but its showing car added

$.ajax({type: "GET",url: url+"/login/noor/noor"})
                .then(function( data, textStatus, jqXHR ) {console.log("login success");},function(){console.log("login error");})
                .then($.ajax({type: "GET",url: url+"/carasdsad/1/1/1"}))
                .then(function(){console.log("car added");},function(){console.log("car not added");});

The above code is returning car added although "/carasdsad/1/1/1" is an invalid url in the second call.

回答1:

According to spec, non-function argument is ignored in then method.

Your code reduced to minimal case looks like that:

Promise.resolve(true)
    .then(Promise.reject("some err"))
    .catch(console.log.bind(console, "fail"));

And one need to rewrite it this way in order to catch errors:

Promise.resolve(true)
    .then(function(){ return Promise.reject("some err") })
    .catch(console.log.bind(console, "fail"));


回答2:

a simple implement of Promise

(please use Chrome/Firefox)

function mPromise(executor) {
this.status = null;
this.result = null;
that=this;
executor(function(result) {
    that.status = "fullfiled";
    that.result = result;
}, function(result) {
    that.status = "rejected";
    that.result = result;
})};

mPromise.prototype.then = function(f, r) {
if (this.status == "fullfiled") {
    f(this.result);
} else {
    r(this.result);
}}

First,create a Promise object:

var a = new mPromise(function(fFlagFun, rFlagFun) {
setTimeout(function() { //using setTimeout mimic remote request
    fFlagFun("yes"); //here you can try rFlagFun("no") by hand;
}, 3000);});

Then After 3s,perform these code snippet:

a.then(function(e) {console.log(e);}, function(e) {console.log(e);})

It may fails if you test it in other forms. I hope the code above will give you an overview of Promise concept.