es6的promiss

  1. promise是什么?
    promise表示一个异步操作结果的占位符,表示未来的一个结果。

  2. promise的生命周期

    1. pending 进行中,此时操作尚未完成,完成后会进入Fulfilled(成功完成)或者Rejected(程序错误)。成功完成之后,会进入settled状态。promise的then方法可以对完成的结果进行处理。
      	let promise = new Promise((resolve,reject)=>{
             setTimeout(()=>resolve(10),2000)
         });
          promise.then(data=>console.log(data),err=>console.log(err)) // 2s后输出10
      
  3. 创建一个已完成的promise。

     let resolvedPromise = Promise.resolve('resolved promise');
     resolvedPromise.then(data=>console.log(data),err=>console.log(err)); //立即输出 resolved promise
     let rejectedPromise = Promise.reject('err');
     rejectedPromise.then(data=>console.log(data),err=>console.log(err));// 立即输出err
    
  4. 通过thenable创建promise

    let thenablePromise = Promise.resolve({then:(resolve,reject)=>resolve('thenable resolve')});
    thenablePromise.then(data=>console.log(data)) // 立即输出then...
    
  5. catch

    	     let promiseExc = new Promise((resolve,reject)=>{
                setTimeout(()=>{try{throw new Error('some error')}catch(e){reject(e)}},2000)
            });
            promiseExc.catch(e=>console.log(e)) // Error: some error
    
  6. Promise.all(promises) ;响应多个promise

  7. Promise.race();监听多个promise,当其中一个完成时就相应。

  8. 用promise封装一个简单的ajax。

    function HttpClient() {
    
        this.get = function (url) {
            return new Promise((resolve, reject) => {
                    var request = new XMLHttpRequest();
                    request.open('get', url);
                    request.send();
                    request.onreadystatechange = function () {
                        request.readyState == 4 &&(request.status == '200' ? resolve(request.response) : reject(request.response));
                    }
                }
            )
        }
    }
    
    var http = new HttpClient();
    
    http.get("http://t.weather.sojson.com/api/weather/city/101030100").then(it => {
        console.log(it);
        http.get("http://t.weather.sojson.com/api/weather/city/101030100").then(it => {
            console.log(it)
        }).catch(err=>console.log(err))
    }).catch(err=>console.log(err))
    
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章