您的位置：首页 > Web前端 > JavaScript

js 开篇

2017-07-17 15:18 316 查看 
5月中旬开始学习接触RN，并要求自己在半年之内能独立开发RN
后面发现RN需要React基础，所以开始学习一下React，后又发现React只是JS众多框架中的一种，所以先打算学习一下JS基础，所以就这么一层嵌套这一层的，到这里来了。上面是题外话，今天要记录的是JS概念Promise，直接上例子如下：
var getJSON = function(url) {
var promise = new Promise(function(resolve, reject){
var client = new XMLHttpRequest();
client.open("GET", url);
client.onreadystatechange = handler;
client.responseType = "json";
client.setRequestHeader("Accept", "application/json");
client.send();

function handler() {
if (this.readyState !== 4) {
return;
}
if (this.status === 200) {
resolve(this.response);
} else {
reject(new Error(this.statusText));
}
};
});

return promise;
};

getJSON("/posts.json").then(function(json) {
console.log('Contents: ' + json);
}, function(error) {
console.error('出错了', error);
});
上面代码中，
getJSON
是对XMLHttpRequest 对象的封装，用于发出一个针对 JSON 数据的 HTTP 请求，并且返回一个
Promise
对象。需要注意的是，在
getJSON
内部，
resolve
函数和
reject
函数调用时，都带有参数。如果调用
resolve
函数和
reject
函数时带有参数，那么它们的参数会被传递给回调函数。代码中25行的json对象就是从15行中传递过来的，27行中的error对象就是从17行传递过来的。采用链式的
then
then
方法返回的是一个新的
Promise
实例（注意，不是原来那个
Promise
实例）。因此可以采用链式写法，即
then
方法后面再调用另一个
then
方法。
getJSON("/post/1.json").then(function(post) {
return getJSON(post.commentURL);
}).then(function funcA(comments) {
console.log("Resolved: ", comments);
}, function funcB(err){
console.log("Rejected: ", err);
});
上面代码中，第一个
then
方法指定的回调函数，返回的是另一个
Promise
对象。这时，第二个
then
方法指定的回调函数，就会等待这个新的
Promise
对象状态发生变化。如果变为
Resolved
，就调用
funcA
，如果状态变为
Rejected
，就调用
funcB
。
如果采用箭头函数，上面的代码可以写得更简洁。
getJSON("/post/1.json").then(
post => getJSON(post.commentURL)
).then(
comments => console.log("Resolved: ", comments),
err => console.log("Rejected: ", err)
);
更多详细请见：http://es6.ruanyifeng.com/#docs/promise
                                            

                                        

                        
                        内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息 
                    

                    

                    

                        

                         标签： 
                                                

                        

                    


                

            


            

                
相关文章推荐

                

                
            

        

        

            

            
            

                

                    
新的分享

                    

                        
                    

                

            


            

                

                    
章节导航