JavaScript 答应麻烦

Question

函数如下：

    function load_img(url) {
        return new Promise((resolve, rejected) => {

            const img = new Image();
            img.height = 250;
            img.src = url;
            document.body.append(img);
            img.addEventListener("load", () => {
                resolve("LOL");
            });
            img.addEventListener("error", () => {
                rejected();
            });

        });
    }

函数调用如下：

        load_img(url1)
        .then((mes) => {
            console.log(mes);
            return load_img(url2);
        })
        .then((mes) => {
            load_img(url3);
            console.log(mes);
        })
        .catch(() => console.log("Some error"))

我不明白为什么要用在第一个thenreturn函数之前，函数已经return promise 在它的主体中，但是当我们在 then 中使用它而没有 return 时，第二个 then 不会得到resolve() 中规定的任何值。

请帮帮我！:)

Answer 1

第二个 .then() 中的 mes 参数来自第一个 .then() 处理程序的 return 值。如果你没有从第一个 .then() 处理程序中 return 任何东西，那么你就不会在第二个 .then() 处理程序中得到任何已解析的值，并且 mes 将是 undefined.

此外，第二个 .then() 处理程序只会“等待” load_img(url2) 解析，如果你 return 它来自第一个 .then() 处理程序的承诺。这就是您正确链接承诺的方式。

也许您只是使用此代码进行测试，但您不必按顺序加载两个图像，因为第二个图像不依赖于第一个图像。您可以并行加载它们并使用 Promise.all() 知道它们何时完成。

JavaScript 答应麻烦

JavaScript promise trouble

javascript

function

resolve

promise