How does Promise.race () know which request to return first?

compare the speed of reading data from the local cache and the request interface. It doesn"t matter if the local cache returns first, but if the request interface returns first, it will cause the old result of the local cache to replace the new data of the request interface. How can this be avoided?

related codes

//  
function getLocal(storageKey) {
    return new Promise((resolve, reject) => {
        wx.getStorage({
            key: storageKey,
            success(res) {
                resolve(res.data);
            },
            fail(error) {
                reject(error);
            },
        });
    });
}
//  
function getRequestApi(options) {
    return request({
        url: "",
        data: {
            ...options,
        }
    });
}

// 
Promise.race([getLocal("storageKey"), getRequestApi(options)]).then(//);

the above code is that I intend to use Promise.race to make a comparison, but I find that I can only get the data returned first, but I"m not sure which request completed it first. How to solve it?

Mini-Program Asynchronous-Task-queue

Nov.30,2021

put getHandPickShop in getLocalStorage and then execute
if there is no localStorage, execute getHandPickShop , otherwise you don't need to use race

if you don't have localStorage.

promise.race returns the promise result of the initial execution, regardless of whether the request operation is resolve or rejected,. In your above scenario, you can inject tags into the return result of each operation, such as the following operation:

test</div>
</body>

function setData(data) {
    document.getElementById('testId').innerHTML = data;
}

var mainFun = async function () {
    try {
        var getRequest = function(dealy){
            console.log('--' + dealy);
            return new Promise(function(resolve) {
                setTimeout(function () {
                    resolve(dealy)
                }, dealy);
            })
        }
        var getLocal = getRequest(2000).then((res) => res)
        var getRequestApi = getRequest(3000).then((res) => res)
        /**
        * 1local  request : local
        * 2local  request : "local"
        * 3request  local : "request"
        * 4request  local : local
        * 5request  local : "local"
        */
        Promise.race([getLocal, getRequestApi.then(
            () => Promise.reject(new Error('request ')),   // 3
            () => getLocal        // 4
        )]).then(
            (data) => {    // 14
                setData(data);
                console.log(data);
            },
            (error) => {    // 25
                console.log(error.message)
            },
        )
        setData(await getRequestApi)    // getRequestApi
    } catch(error) {
        console.log(error.message);
    }
}
mainFun()

Previous: Does vue gain focus or lose focus does not work?

Next: What should I do with the picture resources of npm sent by the vue plug-in?