약속 대기!== 코루틴

네 이것은 의 자매 게시물입니다. 그 게시물에서 나는 async/await에 의해 구현된 코루틴(뒤집힌 제어를 다시 뒤집음)의 아이디어를 설명했습니다. 그러나 여기에서 자세히 조사하고 async/await 구문이 엄격하게 코루틴이 아니라는 결론을 내리고 싶습니다.

예를 보겠습니다.






잉바르 스테판얀


@리버서






이전:(function animate() { ... requestAnimationFrame(animate);})();요즘:const nextFrame = () => new Promise(resolve => requestAnimationFrame(resolve));(async function animate() { while (참) { ... nextFrame()을 기다립니다; }})();


오전 10:56 - 2021년 7월 21일









코드:

const nextFrame = () => 
new Promise(resolve => requestAnimationFrame(resolve));

(async function animate() {
  while (true) {
    // ... maybe we should add an exit/break condition
    // lovely in-control-render-loop
    await nextFrame();
  }
})();

그러나 문제가 있습니다. 코드는 rAF 콜백에서 동 기적으로 실행되지 않고 마이크로 태스크 콜백입니다. 따라서 직관적으로 rAF를 사용하면 이점이 전혀 없습니다.

Ironically you might never notice this as some implementations do cover the case. See Timing of microtask triggered from requestAnimationFrame

Promise: always trigger a micro-task의 사양 때문입니다. 그러나 실제 코루틴에서는 제어가 특정 지점에서 동기적으로 재개될 것으로 예상됩니다. rAF가 그러한 예이며 일부 라이브러리/프레임워크는 흑마술 부작용 같은 전역 변수를 사용하여 동기식 프로시저에 컨텍스트 정보를 저장합니다. (다행히 JavaScript는 단일 스레드입니다. 그렇지 않으면 ...). 어쨌든 우리는 마이크로 작업에 의해 위임되는 것이 아니라 즉시 제어가 필요합니다.

누군가 질문할 수 있습니다: Promise는 왜 비동기식이어야 합니까? 동기 약속을 가질 수 없습니까? (주제에서 벗어난: Promise 생성자의 실행자 함수는 동기식으로 실행됩니다.) 대답은 다음과 같습니다. 그럴 수 있지만 그렇게 해서는 안 됩니다. Promise는 비동기 작업의 최종 결과를 나타내므로 비동기 모델을 사용하면 설계가 간소화됩니다. Promise의 경우 값(및/또는 값이 없는 이유)에만 관심이 있습니다. 따라서 Promise는 "결국 당신에게 가치를 줄 것이지만 그것이 언제 이용 가능한지 확신할 수 없습니다(그리고 반드시 마이크로 태스크에 있을 필요는 없습니다.)"라고 말합니다. 이행/거부된 Promise도 값을 비동기적으로 통지하여 디자인의 일관성을 유지합니다. 따라서 .then의 콜백이 항상 지연된다는 것을 알고 있습니다. 그렇지 않으면,

// not runnable code, for illustration purpose
aMaybeSyncPromise.then((x)=>{
  // assume an error is thrown in callback
  throw 'Oops!!';
  // or access a closure variable
  doSomething(y); // 'y' is undefined if sync
});
// ... original flow of control
let y;
// ...

동기화 및 비동기 콜백은 서로 다른 동작을 제공합니다.

그럼 코루틴으로 돌아가 봅시다. JavaScript에서 적절한 코루틴을 가질 수 있습니까? 물론 제너레이터로. 자신만의 스케줄러를 구현하고 컨트롤을 다시 반환할 시기를 결정할 수 있습니다. (하지만 설명대로 쉽지는 않은 것 같습니다 😅. 여기에 몇 가지 구현을 나열하려고 계획했지만 그 중 어느 것도 Promise-free가 아닙니다). 이 주제에 대해 계속하겠습니다.