async와 await 이해: onDismissed 예제

pharmDev·2024년 12월 19일

asyncawait를 사용하는 이유

asyncawait비동기 프로그래밍을 지원하기 위한 Dart의 키워드입니다. onDismissed에서 비동기 작업(예: 데이터베이스에서 일정 삭제)을 처리하기 위해 사용됩니다.


onDismissedasync/await 사용 부분

onDismissed: (DismissDirection direction) async {
  await GetIt.I<AppDatabase>().removeSchedule(
    schedule.id,
  );
  setState(() {
    // UI를 업데이트
  });
},

async를 사용하나요?

  • 비동기 작업 처리: removeSchedule(schedule.id) 메서드는 데이터베이스에서 데이터를 삭제하는 작업을 수행하며, 이는 시간이 걸리는 작업(비동기 작업)입니다.
  • async를 붙이면 이 함수가 비동기 작업을 처리할 준비가 되었다는 것을 Dart에 알려줍니다.

await를 사용하나요?

  • 결과를 기다리기: await는 비동기 작업이 완료될 때까지 기다립니다.
    즉, GetIt.I<AppDatabase>().removeSchedule(schedule.id)가 완료될 때까지 다음 줄(setState())로 넘어가지 않습니다.

코드 실행 순서

  1. onDismissed가 호출됨:
    사용자가 특정 스케줄을 스와이프하여 삭제하면, onDismissed가 실행됩니다.

  2. 비동기 작업 시작:

    await GetIt.I<AppDatabase>().removeSchedule(schedule.id);
    • 이 코드는 비동기로 데이터베이스에서 해당 스케줄을 삭제합니다.
    • 삭제 작업이 완료될 때까지 이 줄에서 대기(await).
  3. UI 업데이트:

    setState(() {
      // UI를 다시 그려 삭제된 상태 반영
    });
    • 삭제 작업이 완료된 후에 UI를 다시 렌더링합니다.
    • setState는 Flutter에서 화면을 다시 그리는 데 사용됩니다.

asyncawait 없이 코드를 작성하면?

onDismissed: (DismissDirection direction) {
  GetIt.I<AppDatabase>().removeSchedule(schedule.id); // 비동기 호출
  setState(() {
    // UI 업데이트
  });
},

문제점:

  1. 비동기 작업이 완료되기 전에 setState() 실행:

    • 데이터 삭제 작업이 완료되지 않았는데 UI를 업데이트하려고 시도할 수 있습니다.
    • 이로 인해 삭제되지 않은 항목이 화면에서 사라지는 등 비정상적인 동작이 발생할 수 있습니다.
  2. 결과를 기다리지 않음:

    • 삭제 작업의 성공/실패 여부를 확인하지 않고 다음 코드로 넘어갑니다.

비동기 프로그래밍의 필요성

비동기 작업은 시간이 오래 걸릴 수 있는 작업(예: 네트워크 요청, 파일 I/O, 데이터베이스 작업 등)을 처리하기 위해 필요합니다. 이 작업들을 동기적으로 처리하면 UI가 멈추는 문제(앱이 "프리징"되는 현상)가 발생할 수 있습니다.


정리

  • async: 비동기 작업을 수행하는 함수임을 Dart에 알립니다.
  • await: 비동기 작업이 완료될 때까지 기다립니다.
  • 이 코드는 데이터베이스 작업이 완료된 후 UI를 업데이트하여, 삭제 작업이 안전하게 처리되도록 보장합니다.

async/await코드 가독성비동기 흐름 관리를 동시에 제공하므로, Flutter 앱 개발에서 매우 유용합니다!

profile
코딩을 배우는 초보

0개의 댓글