Dart 중급 비동기

Dart 비동기 함수 정의

Dart 비동기 함수 정의 — 중급

비동기 함수 정의

1. 도입 (왜 배워야 하는가)

비동기 프로그래밍은 현대 애플리케이션 개발에서 필수적인 개념입니다. 특히, 사용자 인터페이스가 있는 앱에서는 사용자가 버튼을 클릭했을 때 즉각적인 반응을 원합니다. 비동기 함수를 사용하지 않으면, 긴 작업(예: 네트워크 요청)이 실행되는 동안 앱이 멈추게 되어 사용자 경험이 나빠집니다. 즉, 비동기 프로그래밍을 모르면 사용자에게 불편함을 주는 애플리케이션을 만들게 되는 것입니다.

2. 핵심 개념 설명

비동기 함수는 작업이 완료될 때까지 기다리지 않고, 다른 작업을 계속 수행할 수 있도록 해주는 함수입니다. 비유하자면, 요리를 할 때 한 가지 요리에 집중하지 않고 여러 요리를 동시에 준비하는 것과 같습니다. 요리를 하면서 동시에 밥을 지을 수 있는 것처럼, 비동기 함수는 여러 작업을 동시에 처리할 수 있게 해줍니다.

용어	설명
async	비동기 함수로 정의할 때 사용하는 키워드
await	비동기 작업이 완료될 때까지 기다리기 위해 사용하는 키워드
Future	비동기 작업의 결과를 나타내는 객체

3. 기본 코드 예제

다음은 비동기 함수를 정의하고 사용하는 간단한 예제입니다.

Future<String> fetchData() async {
  // 2초 후에 데이터를 반환하는 비동기 함수
  await Future.delayed(Duration(seconds: 2));
  return '데이터 수신 완료';
}

void main() async {
  print('데이터 요청 중...');
  String result = await fetchData(); // fetchData 함수의 결과를 기다림
  print(result); // '데이터 수신 완료'가 출력됨
}

실행 결과

데이터 요청 중...
데이터 수신 완료

코드 한 줄씩 동작 설명

Future<String> fetchData() - 비동기 함수 선언, 문자열 결과를 반환하는 함수임.
await Future.delayed(Duration(seconds: 2)); - 2초 동안 대기 후 다음 줄로 이동.
return '데이터 수신 완료'; - 대기 후 데이터를 반환.
void main() async - 비동기 메인 함수 선언.
print('데이터 요청 중...'); - 데이터 요청 시작 메시지 출력.
String result = await fetchData(); - fetchData 함수 실행, 결과를 기다림.
print(result); - 결과를 출력.

4. 실전 활용 예제

쇼핑몰에서 장바구니를 구현할 때

사용자가 장바구니에 상품을 추가하는 버튼을 클릭했을 때, 서버에 해당 상품 정보를 비동기적으로 요청하고 추가하는 패턴입니다.

Future<void> addToCart(String productId) async {
  print('장바구니에 상품 추가 중...');
  await Future.delayed(Duration(seconds: 1)); // 서버 요청 대기
  print('$productId 상품이 장바구니에 추가되었습니다.');
}

void main() async {
  await addToCart('상품123');
}

데이터베이스에서 사용자 정보 가져오기

비동기 함수를 사용하여 데이터베이스에서 사용자 정보를 가져오는 방법입니다.

Future<Map<String, String>> getUserInfo(String userId) async {
  await Future.delayed(Duration(seconds: 1)); // DB 요청 대기
  return {'name': '홍길동', 'age': '30'};
}

void main() async {
  Map<String, String> user = await getUserInfo('user123');
  print('${user['name']}님의 나이는 ${user['age']}세입니다.');
}

5. 흔한 실수와 주의사항

실수 1: await를 빠뜨리는 경우

// 잘못된 코드
void main() {
  fetchData(); // await가 없어서 결과를 기다리지 않음
}

이 경우, '데이터 수신 완료' 메시지가 출력되지 않거나, 실행 순서가 예측과 다르게 될 수 있습니다.

실수 2: async가 없는 함수에서 await 사용

void fetchData() async {
  await Future.delayed(Duration(seconds: 2)); // async가 없으면 에러 발생
}

이 경우 컴파일 에러가 발생합니다. async 키워드를 반드시 붙여야 합니다.

6. 정리

비동기 함수는 긴 작업을 수행할 때 앱을 멈추지 않게 해줍니다.
async와 await 키워드를 사용하여 비동기 작업을 쉽게 처리할 수 있습니다.
여러 작업을 동시에 처리할 수 있어 사용자 경험을 향상시킵니다.

다음에 학습하면 좋은 주제는 '프로미스(Promise)와 비동기 처리의 에러 핸들링'입니다.

학습