JS PromiseLike的判定与使用详解

setTimeout(async () => {

    const response = $.ajax({
        url: "https://api.github.com/users/fengyehong123",
        type: 'GET',
    });
    console.log(response);
    console.log(response.responseJSON);  // undefined

    const result = await response;
    console.log(result);

}, 1000);

// 判断是否为 Promise Like
 function isPromiseLike(value) {

    if(value === null) {
        return false;
    }
    
    if ((typeof value === 'object' || typeof value === 'function') && (typeof value.then === 'function')){
        return true;
    }

    return false;
}

const promise_obj = new Promise((resolve, reject) => {
    resolve('枫叶红');
});
console.log(isPromiseLike(promise_obj) ? "promise_obj是PromiseLike对象" : "promise_obj非PromiseLike对象");

const then_response = {
    then: function(resolve, reject) {
        setTimeout(() => {
            resolve('贾飞天');
        }, 1000)
    }
}
console.log(
	isPromiseLike(then_response) 
	? "then_response是PromiseLike对象" : "then_response非PromiseLike对象"
);
// then_response是PromiseLike对象

(async (response) => {
    /*
        此处的response实际上是then_response
        因为 then_response 是一个 Promise Like 对象
        要想await的话,必须包裹在 函数中
        因此此处定义了一个立即执行函数,还可以避免给函数取名的麻烦
    */
    const result = await response;
    console.log(result);
})(then_response);

// ⏹两秒之后发送ajax请求
setTimeout(async () => {

    const response = $.ajax({
        url: "https://api.github.com/users/fengyehong123",
        type: 'GET',
    });
    
    // 是一个PromiseLike对象
    console.log(
		isPromiseLike(response) ? "response是PromiseLike对象" : "response非PromiseLike对象"
	);
    // response是PromiseLike对象

    // 正因为是 PromiseLike对象 ,所以才可以进行await
    const result = await response;
    console.log(result);
}, 2000);

// ajax的请求对象
const jqRequest = $.ajax({
    url,
    method: 'GET'
});

// doneCallBack,failCallBack,alwaysCallback 是从外部传入的回调函数
jqRequest.done(function(data, textStatus, jqXHR) {
    doneCallBack && doneCallBack(data);
}).fail(function(jqXHR, textStatus, errorThrown) {
    failCallBack && failCallBack();
}).always(function() {
    alwaysCallback && alwaysCallback();
});

document.querySelector('#btn').addEventListener('click', async function() {

    const url = "https://api.github.com/users/fengyehong123";
    // 后端的返回值
    let result = null;

    try {
        result = await $.ajax({
            url,
            type: 'GET',
        });
    } catch (error) {

        const {responseJSON} = error;
        console.log(`请求失败!原因是: ${responseJSON}`);
    } finally {
        console.log("请求完成!");
    }

    if(!result) {
    	// 进行相应的业务处理
        return;
    }
   
    console.log("返回的最终值为:");
    console.log(result);
});