"일꾼이 일을 잘하려면 먼저 도구를 갈고 닦아야 한다." - 공자, 『논어』.
첫 장 > 프로그램 작성 > 그렇게 어렵지 않아요! 자바스크립트의 `Promise`를 이해하려면

그렇게 어렵지 않아요! 자바스크립트의 `Promise`를 이해하려면

2024-11-01에 게시됨
검색:678

It’s not that hard! To understand `Promise` in javascript

이 글의 내용은 자바스크립트 초보자에게 매우 적합합니다. 간단하고 이해하기 쉬운 언어로 설명되어 있으니 이해하지 못할 걱정은 안하셔도 됩니다.

약속해, 너는 왜 존재하는 걸까?

Promise는 현대 Javascript 언어를 배울 때 없어서는 안 될 지식 포인트입니다. 많은 사람들이 이 책을 읽을 때 혼란스러워합니다. 주된 이유는 다음 한 문장으로 요약됩니다.

코드가 더 이상 위에서 아래로 실행되지 않습니다.

보통 우리가 작성하는 코드는 순차적으로 실행됩니다. 예를 들어 1부터 3까지 세는 코드를 작성합니다.

console.log(1)
console.log(2)
console.log(3)

F12를 눌러 브라우저의 콘솔을 열고 위의 코드를 복사한 후 Enter를 누르면 1부터 3까지의 숫자가 순서대로 출력되는 것을 확인할 수 있습니다.

1
2
3

이제, 코드 순서는 변경할 수 없지만 최종 인쇄 순서는 코드 순서와 독립적이어야 한다는 요구 사항이 있는 경우 이를 수행할 수 있습니까?

세 ​​사람이 각각 1, 2, 3을 인쇄한다고 가정하면 매우 간단합니다. 동시에 숫자를 인쇄하는 작업을 알려주면 인쇄 순서는 작업 실행 시간에만 관련됩니다.

약속, 마법의 효과

그렇다면 인쇄 작업을 세 사람에게 어떻게 할당할까요? 여기에서 Promise가 사용됩니다. 새로운 Promise 객체를 생성함으로써 현재 "프로세스"에서 코드를 실행하는 대신 새로운 "프로세스"에 코드 섹션을 할당할 수 있습니다. 여기서 "프로세스"는 우리가 자주 이야기하는 운영체제 프로세스와 동일하지 않으며, 코드를 순차적으로 실행하는 가상 단위를 나타내는 추상적인 개념일 뿐입니다.

약속, 조립 지침

방금 말했듯이 새로운 "프로세스"로 간주될 수 있다고 약속합니다. 따라서 코드를 실행하려면 이를 함수로 래핑하여 제공할 수 있습니다. 이런 식으로 코드가 즉시 실행되지는 않습니다.

Promise는 또한 두 가지 기능을 제공합니다. 하나는 해결이고 다른 하나는 거부입니다. 이는 작업이 완료되고 실패할 때 각각 호출할 수 있습니다. 이 두 함수는 Promise의 내부 매개변수로 전달됩니다. 따라서 다음과 같이 조립할 수 있습니다.

Promise(
  (resolve, _reject) => {
    setTimeout(() => {
      console.log(1)
      resolve()
    }, 300)
  }
)

여기에서는 setTimeout을 사용하여 시간이 많이 걸리는 작업을 시뮬레이션합니다. 실제 시나리오에서 이 작업은 파일 읽기, 네트워크 인터페이스 요청 또는 사용자 입력 대기 등일 수 있습니다. 작업이 완료되면 해결 함수를 호출하여 작업이 완료되었음을 나타냅니다.

완전한 코드

그런 다음 동일한 방법을 따르며 나머지 두 개를 조립할 때 서로 다른 인쇄 번호와 작업에 필요한 시간만 제공하면 된다고 약속합니다. 마지막으로 전체 코드는 다음과 같습니다. 콘솔에 복사하여 사용해 보세요.

Promise(
  (resolve, _reject) => {
    setTimeout(() => {
      console.log(1)
      resolve()
    }, 300)
  }
)
new Promise(
  (resolve, _reject) => {
    setTimeout(() => {
      console.log(2)
      resolve()
    }, 200)
  }
)
new Promise(
  (resolve, _reject) => {
    setTimeout(() => {
      console.log(3)
      resolve()
    }, 100)
  }
)

마지막으로 숫자가 인쇄되는 순서는 작업 실행 시간과 관련이 있습니다.

3
2
1

약속, 동시성 모델

동시 프로그래밍은 제한된 수의 CPU 코어에서 동시에 많은 수의 작업 실행을 시뮬레이션하는 방법에 관한 것입니다. Javascript의 Promise는 편리하고 빠른 동시 프로그래밍 방법은 물론 반환 값과 오류 값을 처리하기 위한 사양 세트를 제공합니다. 이 사양을 이해하고 익숙해지면 동시 작업 처리의 효율성을 크게 향상시킬 수 있습니다.

릴리스 선언문 이 기사는 https://dev.to/linjiezhang/its-not-that-hard-to-understand-promise-in-javascript-3kk3?1에 복제되어 있습니다. 침해가 있는 경우에는 [email protected]으로 문의하시기 바랍니다. 그것을 삭제하려면
최신 튜토리얼 더>

부인 성명: 제공된 모든 리소스는 부분적으로 인터넷에서 가져온 것입니다. 귀하의 저작권이나 기타 권리 및 이익이 침해된 경우 자세한 이유를 설명하고 저작권 또는 권리 및 이익에 대한 증거를 제공한 후 이메일([email protected])로 보내주십시오. 최대한 빨리 처리해 드리겠습니다.

Copyright© 2022 湘ICP备2022001581号-3