> 웹 프론트엔드 > JS 튜토리얼 > TypeScript에서 비동기 함수를 만드는 방법은 무엇입니까?

TypeScript에서 비동기 함수를 만드는 방법은 무엇입니까?

WBOY
풀어 주다: 2023-08-30 22:13:02
앞으로
1638명이 탐색했습니다.

如何在 TypeScript 中创建异步函数?

비동기 프로그래밍을 사용하면 여러 작업을 병렬로 수행할 수 있습니다. async/await 키워드를 사용하여 함수를 비동기식으로 만들 수 있습니다.

시작하기 전에 먼저 비동기 프로그래밍 및 기능의 요구 사항을 이해하겠습니다. API에서 데이터를 가져올 때 응답하는 데 약간의 시간이 걸립니다. 이제 API에서 얻은 결과를 애플리케이션에 사용해야 합니다.

TypeScript 및 JavaScript와 같은 단일 스레드 프로그래밍 언어는 코드 실행을 멈추지 않습니다. 따라서 API의 응답을 기다리는 대신 null 값에 대한 일부 작업을 수행하기 시작합니다.

함수를 비동기화하면 API로부터 응답을 받을 때까지 특정 코드 블록의 실행이 일시 중지됩니다. 따라서 null 값을 조작하는 대신 데이터를 조작할 수 있습니다.

문법

사용자는 다음 구문에 따라 TypeScript에서 함수를 비동기식으로 만들 수 있습니다.

으아악

위 구문에서는 함수 앞에 async 키워드를 사용하여 비동기화했습니다. 또한, promise에 대한 응답을 받을 때까지 함수 실행을 일시 중지하기 위해 wait 키워드도 사용합니다.

따라서 wait 키워드는 비동기 함수의 실행을 일시 중지하고 다른 코드는 계속 실행될 수 있습니다. 커밋이 해결되면 다시 실행이 시작됩니다.

이제 다양한 예를 통해 비동기 함수의 개념을 이해해 보겠습니다.

이 예에서는 async 키워드를 사용하여 비동기 테스트 함수를 만들었습니다. test() 함수에서는 wait 키워드를 사용하여 일정 기간 동안 함수를 일시 중지합니다.

출력에서 사용자는 함수의 데이터 변수 값을 인쇄하기 전에 "함수 실행 후"를 인쇄하는 것을 볼 수 있습니다. 따라서 wait 키워드가 함수 실행을 일시 중지하면 다른 코드를 실행하기 시작하여 애플리케이션 성능이 향상된다는 것을 이해할 수 있습니다.

으아악

컴파일되면 다음 JavaScript 코드가 생성됩니다. -

으아악

Output

위 코드는 다음과 같은 출력을 생성합니다. -

으아악

예 2

이 예에서 SamplePromise() 함수에는 약속이 포함되어 있습니다. Promise 생성자를 사용하여 Promise를 생성하고 해결합니다. 또한, 우리는 SamplePromise() 함수에서 Promise를 반환했습니다.

executeAsync() 함수는 wait 키워드를 사용하여 SamplePromise() 함수를 호출합니다. 사용자는 약속이 이행될 때까지 wait 키워드가 ExecutionAsync() 함수의 실행을 일시 중지하는 것을 출력에서 ​​관찰할 수 있습니다.

으아악

컴파일하면 동일한 JavaScript 코드가 생성됩니다. -

으아악

Output

다음과 같은 출력이 생성됩니다 –

으아악

이 튜토리얼에서 사용자는 비동기 함수를 만드는 방법을 배웠습니다. 또한 async/await 키워드를 사용하고 여기서 데이터를 가져오는 방법을 배웠습니다. 비동기 기능은 단일 스레드 애플리케이션의 성능을 향상시킵니다.

위 내용은 TypeScript에서 비동기 함수를 만드는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:tutorialspoint.com
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿