Home  >  Article  >  Web Front-end  >  Simple usage of promise objects

Simple usage of promise objects

一个新手
一个新手Original
2017-09-23 10:41:542024browse

The promise object is a solution proposed in es6 to solve asynchronous callbacks. As a newbie, I have just figured out this thing recently. I am writing this article, hoping to get some advice from experts. At the same time, I also think it will be helpful to novice friends who don’t understand promises.

No more nonsense, I won’t say much about introducing promises. If you don’t understand, you can search it yourself. This article only writes a simple example of promise. I believe I have seen some promises. I am a friend, but I am quite afraid of him (because when I didn’t understand this thing before, I thought it was very high-end). After seeing the examples, I can have a new understanding of him. Next, I directly attach a simple ajax request I wrote:

function get(url) {
        return new Promise((resolve, reject) => {
            var ajax = new XMLHttpRequest();
            ajax.open('GET', url);
            ajax.onreadystatechange = function() {
                if (ajax.readyState == 4) { 
                    if(ajax.status == 200){
                        resolve(ajax);
                    }else{
                        alert(2);
                        reject();
                    }   
                }
            }
            ajax.send();
        });
    }

    document.getElementById('btn').onclick = function() {
        get('b.json').then(function(res) {
            
            console.log(res.responseText);
            document.getElementById('p1').innerHTML = res.responseText;
        });
    }


Because it introduces es6 objects, this article uses some es6 syntax. If any students don’t understand it, you can do it by yourself Baidu, the promise object receives two parameters, resolve and reject. My personal understanding is success and failure (if my understanding is wrong, I hope someone can correct me, after all, I just learned it). I don’t know many steps of ajax. Having said that, we return the promise object directly in the get function, connect our ajax method to this promise object, and finally the ajax request is successful. At this time, resolve comes in handy, resolve(ajax); and then it is over. If it is unsuccessful, just reject() directly (equivalent to request failure).

Finally, this simple case of promise is completed. You can test it in your own environment

The above is the detailed content of Simple usage of promise objects. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn