비동기 작업 이해 및 JavaScript에서 async/await 사용

이미 아시다시피 JavaScript는 단일 스레드 언어이며 한 번에 하나의 작업을 수행할 수 있습니다. 그러나 서버에서 데이터를 가져오거나 디스크에서 파일을 읽는 등 웹 개발의 많은 작업을 수행하는 데 시간이 걸릴 수 있습니다. 이러한 작업을 동기식으로 수행하는 경우, 즉 JavaScript는 다음 코드 줄로 이동하기 전에 작업이 완료될 때까지 기다려야 하며, 그러면 애플리케이션의 응답 속도가 느려집니다. 이러한 작업을 보다 효율적으로 완료하기 위해 JavaScript는 비동기 프로그래밍 기술을 사용합니다.

비동기 작업이란 무엇입니까?

비동기 작업은 현재 시간에 시작되지만 프로그램이 다른 코드 줄을 계속 사용하는 동안 다른 시간에 완료될 수 있는 작업입니다. JavaScript에서는 콜백, 약속, 그리고 나중에는 async/await 구문을 사용하여 비동기 동작을 처리합니다. 이 접근 방식을 사용하면 JavaScript가 백그라운드에서 작업을 수행하여 웹 앱의 전반적인 성능이 향상됩니다.
예를 들어, 사용자에 대한 정보를 데이터베이스에서 검색해야 하는 웹 애플리케이션의 경우를 생각해 보세요. 이 프로세스는 네트워크 속도나 서버에 대한 높은 트래픽에 따라 몇 초 정도 걸릴 수 있습니다. JavaScript는 데이터 수신을 기다리는 동안 애플리케이션을 중단하는 대신 나머지 코드를 계속 사용할 수 있습니다. 이러한 종류의 비차단 동작은 비동기 프로그래밍의 기본 아이디어입니다.

비동기/대기 소개

ES2017(ES8)의 일부인 async/await 구문은 틀림없이 비동기 코드를 처리하는 가장 우아하고 이해하기 쉬운 수단입니다. 이는 Promise를 기반으로 하며 이해하고 유지 관리하기 쉽게 비동기 코드를 동기 코드처럼 보이게 하는 방법을 제공합니다.
비동기 함수는 Promise를 반환 유형으로 갖는 함수입니다. 함수에 async 키워드를 추가하면 Promise가 실제로 반환되는지 여부에 관계없이 함수가 항상 Promise를 반환할 것임을 프로그램에 알려줍니다. Await는 약속이 완료되거나 거부될 때까지 함수가 기다릴 수 있도록 비동기 함수 내에서 사용됩니다.

async/await는 어떻게 작동하나요?

이제 async/await를 사용하는 방법을 예를 들어 설명하겠습니다. 사용자의 장바구니를 검색하여 표시하는 다음 코드 조각을 고려해 보세요.

이 예에서 getCart 함수는 async로 선언되었으므로 그 안에서 비동기 작업을 처리하기 위해 wait 키워드를 사용할 수 있습니다.

1. const cart = wait req.user.getCart();: 사용자 개체에서 getCart 메서드를 호출하고 사용자의 현재 카트 인스턴스를 검색합니다. wait 키워드는 JavaScript가 getCart()에서 반환한 Promise가 완료될 때까지 기다리도록 합니다. 그런 다음 확인된 값(사용자의 장바구니)이 장바구니 변수에 할당됩니다.
2. const products = wait cart.getProducts();: 마찬가지로 이 줄은 getProducts 메서드가 완료될 때까지 코드 실행을 일시 중지하여 제품을 사용자 장바구니에 담습니다. wait 키워드는 제품 데이터가 준비될 때까지 다음 코드 줄이 실행되지 않아야 함을 CLR에 알려줍니다.
3. 응답 렌더링: 두 비동기 작업이 모두 완료되면 res.render() 변수가 실행되어 제품과 함께 장바구니 페이지를 렌더링합니다.
4. try...catch를 사용한 오류 처리: try...Finally, catch 블록은 비동기 작업으로 인해 발생할 수 있는 모든 예외를 처리하는 데 사용됩니다. Wait 문에 오류가 있으면 catch 블록이 오류를 처리하고 콘솔에 기록합니다.

async/await 사용의 이점

async/await 구문은 기존 약속 기반 코드에 비해 몇 가지 장점을 제공합니다. async/await 구문은 기존 약속 기반 코드에 비해 몇 가지 장점을 제공합니다.
• 가독성 향상: 비동기 작업을 처리할 수 있음에도 불구하고 코드가 일반 동기 코드처럼 보이기 때문에 따라하고 이해하기 쉽습니다.
• 오류 처리: try...Async/await를 사용하면 오류 처리가 sync/async를 사용하여 오류를 포착하는 것만큼 간단하고 균일해집니다.
• 복잡한 작업 단순화: 코드 작성, 테스트 및 디버깅이 더 쉽기 때문에 여러 비동기 작업이 있는 코드에는 async/await를 사용해야 합니다.

결론

비동기 프로그래밍은 JavaScript에서 메인 스레드를 중단하지 않고 계산 집약적인 작업을 실행하는 데 특히 중요합니다. async/await 구문은 이러한 작업을 처리하는 좀 더 정교한 방법을 제공하며 생성된 코드는 더 읽기 쉽고 깨끗하며 디버그하기 쉽습니다. Async/await는 개발자가 비동기 코드를 작성하여 애플리케이션을 더욱 예측 가능하고 빠르게 만드는 데 도움이 됩니다.

위 내용은 비동기 작업 이해 및 JavaScript에서 async/await 사용의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!