promise请求数据实战

function getJSON(url){
    return new Promise((resolve,reject)=>{
        const request = new XMLHttpRequest();
        request.open("GET",url);
        request.onload = function(){
            try{
                if(this.status===200){
                    resolve(JSON.parse(this.response));
                }else{
                    reject(this.status+" "+this.statusText);
                }
            }catch(e){
                reject(e.message);
            }
            request.onerror = function(){
                reject(this.status+" "+this.statusText);
            };
            request.send();
        }
    })
};
	getJSON("data/api.json").then(data=>{
		console.log(data)
		}).catch(e=>{
		console.log(e)
	});

链式调用promise，多重调用回调函数，再也没有‘金字塔噩梦’。

getJSON("data/api.json")
.then(data=>getJSON(data[0].getValueUrl))
.then(data=>getJSON(data[1].getValueUrl))
.then(data=>getJSON(data[2].getValueUrl))
.catch(error=>{console.log("发生错误！")});

这段代码会创建一系列的promise，一个接一个的被执行。
如果我们使用传统的回调函数，将会出现难以维护和理解的棘手代码！