JavaScript 비동기 호출 방법 정보

Question

다음 aa() 함수를 수정할 수 있습니다. 목적은 console.log()를 사용하여 원하는 값을 출력하는 것입니다. 1초 후 aa() 函数，目的是在一秒后用 console.log() 输出 want-value

function aa() {
    setTimeout(function() {
        return "want-value";
    }, 1000);
}

但是，有额外要求：

1. aa() 函数可以随意修改，但是不能有 console.log()

2. 执行 console.log() 语句里不能有 setTimeout 包裹

解答

也许这是个面试题，管它呢。问题的主要目的是考察对异步调用执行结果的处理，既然是异步调用，那么不可能同步等待异步结果，结果一定是异步的

setTimeout() 经常用来模拟异步操作。最早，异步是通过回调来通知（调用）处理程序处理结果的

function aa(callback) {
    setTimeout(function() {
        if (typeof callback === "function") {
            callback("want-value");
        }
    }, 1000);
}

aa(function(v) {
    console.log(v);
});

不过回调在用于稍大型一点的异步应用时，容易出现多层嵌套，所以之后提出了一些对其进行“扁平”化，这一部分可以参考闲谈异步调用“扁平”化。当然 Promise 是非常流行的一种方法，并最终被 ES6 采纳。用 Promise 实现如下：

function aa() {
    return new Promise(resolve => {
        setTimeout(function() {
            resolve("want-value");
        }, 1000);
    });
}

aa().then(v => console.log(v));

就这个例子来说，它和前面回调的例子大同小异。不过它会引出目前更推荐的一种方法——async/await，从 ES2017 开始支持：

function aa() {
    return new Promise(resolve => {
        setTimeout(function() {
            resolve("want-value");
        }, 1000);
    });
}

async function main() {
    const v = await aa();
    console.log(v);
}

main();

aa() 的定义与 Promise 方法中的定义是一样的，但是在调用的时候，使用了 await，异步等待，等待到异步的结果之后，再使用 console.log() 对其进行处理。

这里需要注意的是 await 只能在 async 方法中使用，所以为了使用 await 必须定义一个 async 的 main 方法，并在全局作用域中调用。由于 main 方法是异步的（申明为 async)，所以如果 main() 调用之后还有其它语句，比如 console.log("hello")，那么这一句话会先执行。

async/await 语法让异步调用写起来像写同步代码，在编写代码的时候，可以避免逻辑跳跃，写起来会更轻松。（参考：从地狱到天堂，Node 回调向 async/await 转变）

当然，定义 main() 再调用 main()

(async () => {
    const v = await aa();
    console.log(v);
})();

그러나 추가 요구 사항이 있습니다:

1. 
   aa() 함수는 마음대로 수정할 수 있지만 거기에 console.log()일 수 없습니다

2. console.log() 실행에는 setTimeout 패키지가 포함될 수 없습니다.

Answer

이건 면접 질문일 수도 있지만 신경쓰지 마세요. 질문의 주요 목적은 비동기 호출이므로 비동기 결과를 동기적으로 기다리는 것이 불가능합니다

🎜<. code>setTimeout() 비동기 작업을 시뮬레이션하는 데 자주 사용됩니다. 처음에는 비동기 알림(호출) 핸들러 처리 결과가 콜백을 통해 이루어졌습니다🎜rrreee🎜그러나 대규모 비동기 애플리케이션에서 콜백을 사용하면 다층 중첩이 발생하기 쉽기 때문에 나중에 이를 "평탄화"하는 일부 방법이 제안되었습니다. 이 부분은 채팅 비동기 호출의 "평탄화"를 참조하세요. 물론 Promise는 매우 인기 있는 방법이며 결국 ES6에 채택되었습니다. Promise를 사용하여 다음과 같이 구현합니다. 🎜rrreee🎜이 예제에 관한 한 이전 콜백 예제와 유사합니다. 그러나 현재 더 권장되는 방법인 async/await가 ES2017부터 지원됩니다. 🎜rrreee🎜aa() 정의는 Promise 메서드의 정의와 동일하지만 호출 시 await를 사용하는 경우 비동기적으로 대기한 후 console.log()를 사용하여 처리합니다. 🎜🎜여기서 await는 async 메서드에서만 사용할 수 있으므로 await를 사용하려면 async code>의 기본 메소드를 호출하고 전역 범위에서 호출합니다. 기본 메서드는 비동기식(async로 선언됨)이므로 main()이 호출된 후에 console.log("hello")와 같은 다른 문이 있는 경우 이 한 문장이 먼저 실행됩니다. 🎜🎜async/await 구문을 사용하면 동기 코드 작성과 같은 비동기 호출을 작성할 수 있습니다. 코드를 작성할 때 논리적 점프를 방지하고 더 쉽게 작성할 수 있습니다. (참고: 지옥에서 천국으로 Node 콜백이 async/await로 변경됩니다.) 🎜🎜물론 main()을 정의한 후 main()을 호출하는 부분도 가능합니다. IIFE로 캡슐화됨 ,🎜rrreee🎜🎜🎜🎜🎜🎜🎜🎜🎜

위 내용은 JavaScript 비동기 호출 방법 정보의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!