Future와 async/await

Coddy Dart 여정의 객체 지향 프로그래밍 섹션에 포함된 레슨 — 110개 중 76번째.

실제 애플리케이션에서 서버로부터 데이터를 가져오거나, 파일을 읽거나, 사용자 입력을 기다리는 것과 같은 많은 작업은 시간이 걸립니다. Dart는 미래의 어느 시점에 사용 가능해질 값을 나타내는 Future를 사용하여 이러한 작업을 처리합니다.

Future는 약속과 같습니다: "준비가 되면 결과를 드릴게요." Future.delayed()를 사용하여 시간이 걸리는 작업을 시뮬레이션할 수 있습니다:

Future<String> fetchUserName() {
  return Future.delayed(
    Duration(seconds: 1),
    () => 'Alice',
  );
}

Future의 결과를 작업하려면 async와 await를 사용하세요. 함수를 async로 표시한 다음, await를 사용하여 Future가 완료될 때까지 실행을 일시 중지합니다:

Future<void> main() async {
  print('Fetching user...');
  String name = await fetchUserName();
  print('Hello, $name!');
}

Future<String> fetchUserName() {
  return Future.delayed(
    Duration(seconds: 1),
    () => 'Alice',
  );
}

await가 없으면 실제 문자열 대신 Future<String>을 얻게 됩니다. await 키워드는 Future를 해제하고 그 안의 값을 제공합니다. await를 사용하는 모든 함수는 async로 표시되어야 하며, 자동으로 Future를 반환한다는 점에 유의하세요.

async 함수에서 직접 값을 반환할 수도 있습니다. Dart는 이를 자동으로 Future로 감쌉니다:

Future<int> calculateTotal() async {
  var a = await fetchNumber();
  var b = await fetchNumber();
  return a + b;  // 자동으로 Future<int>로 감싸집니다
}

챌린지

쉬움

여러 도시의 날씨 데이터를 가져오는 것을 시뮬레이션하는 날씨 서비스를 만들어 봅시다! 완료하는 데 시간이 걸리는 작업을 처리하기 위해 Future, async, await를 사용하는 연습을 하게 됩니다.

코드를 두 개의 파일로 구성합니다:

weather_service.dart: 날씨 정보 가져오기를 시뮬레이션하는 WeatherService 클래스를 생성합니다. 클래스에는 다음이 포함되어야 합니다:
- Future<int>를 반환하는 fetchTemperature(String city) 메서드. 네트워크 지연을 시뮬레이션하기 위해 100 밀리초의 기간으로 Future.delayed()를 사용하세요. 이 메서드는 도시 이름을 기반으로 온도를 반환해야 합니다: 도시 이름의 길이에 3을 곱한 값을 반환하세요.
- Future<String>를 반환하는 fetchCondition(String city) 메서드. 100 밀리초 지연과 함께 Future.delayed()를 사용하세요. 도시 이름의 글자 수가 짝수이면 'Sunny'를 반환하고, 그렇지 않으면 'Cloudy'를 반환하세요.
- Future<String>를 반환하는 비동기 메서드 getFullReport(String city). 이 메서드는 fetchTemperature와 fetchCondition을 모두 await한 다음, 형식화된 문자열 '[city]: [temperature]C, [condition]'을 반환해야 합니다.
main.dart: 날씨 서비스를 임포트하고 비동기 작업이 어떻게 작동하는지 보여줍니다. main 함수는 비동기여야 하며 다음을 수행해야 합니다:
- WeatherService 인스턴스 생성
- Fetching weather data... 출력
- 'Paris'에 대한 전체 보고서를 await하고 출력
- 'Tokyo'에 대한 전체 보고서를 await하고 출력
- 'London'에 대한 전체 보고서를 await하고 출력
- Done! 출력

getFullReport를 호출할 때마다 결합된 결과를 반환하기 전에 온도와 상태를 모두 가져올 때까지 기다리는 방식에 주목하세요. await 키워드는 각 Future가 완료될 때까지 실행을 일시 중지합니다!

예상 출력:

Fetching weather data...
Paris: 15C, Cloudy
Tokyo: 15C, Cloudy
London: 18C, Sunny
Done!

치트 시트

Future는 미래에 사용 가능해질 값을 나타냅니다. 데이터 가져오기나 파일 읽기와 같이 시간이 걸리는 작업에 사용됩니다.

Future.delayed()를 사용하여 Future를 생성합니다:

Future<String> fetchUserName() {
  return Future.delayed(
    Duration(seconds: 1),
    () => 'Alice',
  );
}

Future를 작업하려면 async와 await를 사용하세요. 함수를 async로 표시하고, await를 사용하여 Future가 완료될 때까지 실행을 일시 중지합니다:

Future<void> main() async {
  print('Fetching user...');
  String name = await fetchUserName();
  print('Hello, $name!');
}

await 키워드는 Future의 래핑을 해제하고 실제 값을 제공합니다. 이것이 없으면 문자열 대신 Future<String>을 얻게 됩니다.

await를 사용하는 모든 함수는 async로 표시되어야 하며 자동으로 Future를 반환합니다.

async 함수의 반환 값은 자동으로 Future로 래핑됩니다:

Future<int> calculateTotal() async {
  var a = await fetchNumber();
  var b = await fetchNumber();
  return a + b;  // 자동으로 Future<int>로 래핑됨
}

직접 해보기

import 'weather_service.dart';

Future<void> main() async {
  // TODO: WeatherService 인스턴스 생성하기
  
  // TODO: 'Fetching weather data...' 출력하기
  
  // TODO: 'Paris'의 전체 리포트를 await하고 출력하기
  
  // TODO: 'Tokyo'의 전체 리포트를 await하고 출력하기
  
  // TODO: 'London'의 전체 리포트를 await하고 출력하기
  
  // TODO: 'Done!' 출력하기
}