如何打破承诺的链条

Question

我试图通过将它们保存在一个简单的缓存中来限制我项目中的 api 获取数量，即 mongodb 中的密钥集合。有没有办法在不使用 async/await 的情况下停止 Promise 中 .then() 的传播？

export const getData = (url: string) => {
    return new Promise((resolve, reject) => {
        findInCache(url)
            .then((cached: string | null) => {
                if (cached) {
                    resolve(cached);
                }
            })
            .then(() => {
                axios
                    .get(url)
                    .then(({data}) => {
                        setCache(url, data, TTL);
                        resolve(data);
                    })
                    .catch(e => reject(e));
            });
    });
};

Answer 1

首先，让我们摆脱 Promise 构造函数的反模式 - 你在 Promise 执行器中的函数调用返回一个 Promise，因此，不需要新的 Promise

其次，如果第一个请求的结果为空，则只运行第二个请求

export const getData = (url) => findInCache(url)
// here we return haveResult and avoid axios.get(url) altogether
.then((haveResult) => haveResult || axios.get(url)
    // sometimes nested .then is useful like in this case
    .then(({data}) => {
        setCache(url, data, TTL);
        return data;
    })
);

Answer 2

你可以这样做而不是链接。如果它在缓存中，则从缓存中获取，否则从 url 获取

export const getData = (url: string) => {
    return new Promise((resolve, reject) => {
        findInCache(url)
            .then((cached: string | null) => {
                if (cached) {
                    resolve(cached);
                } else {
                  axios
                    .get(url)
                    .then(({data}) => {
                        setCache(url, data, TTL);
                        resolve(data);
                    })
                    .catch(e => reject(e));
                  }
            })

    });
};

Answer 3

当您在then 返回某些结果时，此结果将进入下一个then 函数。因此，您可以根据输入参数inCache 控制下一个then 中要执行的操作。所以你可以这样做：

export const getData = (url: string) => {
    return new Promise((resolve, reject) => {
        findInCache(url)
            .then((cached: string | null) => {
                if (cached) {
                    resolve(cached);
                    return true;
                }
                return false;
            })
            .then((inCache) => {
                if (!inCache) {
                  axios
                      .get(url)
                      .then(({data}) => {
                          setCache(url, data, TTL);
                          resolve(data);
                      })
                      .catch(e => reject(e));
               }
            });
    });
};