14-Promise

 

1、Promise是什么？

答：一种解决异步的方案。本身是个对象。

 

2、Promise的特点？

答：（1） 共有3个状态。进行中pending、已成功fulfilled和已失败rejected。

（2）状态一旦改变就不会再发生变化。

（3）新建后立即执行。

 

3、语法？

答：

var promise = new Promise((resolve,reject)=>{
    if(success){
        resolve(value)
    } else {
        reject(reject)
    }
})

 

 

4、Promise两个参数的类型？

答：这个参数都是函数。

 

5、Promise的回调？

答：then。Promise实例生成后，可以用then方法分别制定Resolved状态和Rejected状态的回调。

 

5.1、实例

promise新建后就会立即执行。

这个实例中可以看出来，promise创建是通过new 一个Promise，new了之后会立即执行。通过resolve函数往then里面携带数据。

但是不是执行完promise后会立即执行then。

function test(){
    console.log("timeHere")
    setTimeout(()=>{
        console.log("doTimeOut")
    }, 2000)
}
let promise = new Promise((resolve, reject)=>{
    let a = 1
    console.log(a)
    resolve(a)
})

promise.then((value)=>{    
    console.log("resolved-->>", value)
})
test()
console.log("Hi")

//输出的顺序是: 1 timeHere Hi resolved-->>1 doTimeOut

 

 

6、异步加载图片的方法？

答：

function loadImgAsync(url){
    return new Promise((resolve,reject)=>{
        var image = new Image();
        image.onload = function (){
            resolve(image)
        };
        image.onerror = function (){
            reject(new Error('img is wrong of ' + url));
        };

        image.src = url;
    });
}

 

 

7、Promise实现Ajax？

答：

var getJson = function(url) {
    var promise = new Promise((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.status !== 4){
                return
            }
            if (this.status == 200){
                resolve(this.response);
            } else {
                reject (new Error (this.statusText));
            }
        };
    });
    return promise;
};

getJson("/post.json").then((json)=>{
    console.log(json)
},()=>{
    console.error(error)
})

 

 7.1、两个Promise可以实现什么？

如果让一个Promise的resolve参数为另一个Promise，会发生什么？

 

 

8、then的参数是什么？

第一个是成功的回调，第二个是失败的回调。

 

9、写几个使用promise的例子。

 

timeout(ms) {
    return new Promise((resolve, reject) =>{
      setTimeout(resolve, ms, 'done');
    })
  }
    this.timeout(1000).then((value)=>{
      console.log(value)
    })