지난 글에서 컬렉션을 다뤘으니, 이번엔 Dart 언어 기초의 마지막, 비동기다. 서버에서 사용자 이름을 받아오는 함수를 만들고, 받아온 값을 바로 출력해보자. 처음엔 이렇게 짜게 된다.

String fetchName() {
  // 서버에서 받아오는 데 2초 걸린다고 가정
  Future.delayed(Duration(seconds: 2), () => '홍길동');
  return '???'; // 여기서 막힘: 값을 어떻게 돌려주지?
}

void main() {
  final name = fetchName();
  print('이름: $name'); // 이름: ???
}

2초 뒤에 '홍길동'이 만들어지지만, 함수는 기다리지 않고 바로 다음 줄로 넘어가서 '???'를 돌려준다. 서버 요청은 시간이 걸리는데, 그동안 앱 전체를 멈춰 세울 수는 없으니 Dart는 기다리는 작업을 뒤로 미뤄두고 다음 코드를 먼저 실행한다. 그래서 "값이 아직 없는 상태"를 표현할 방법이 필요하다.

해결: Future - "나중에 값이 도착할 것"이라는 약속

Future<String> fetchName() {
  return Future.delayed(Duration(seconds: 2), () => '홍길동');
}

void main() {
  final name = fetchName();
  print(name); // Instance of 'Future<String>'
}

Future<String>은 "지금은 값이 없지만, 나중에 String이 도착한다"는 약속이다. 지난 글에서 본 상자 비유로 하면, 이름표만 붙은 빈 상자가 먼저 오고, 값은 나중에 채워지는 상자다. 그래서 print(name)을 하면 글자가 아니라 Instance of 'Future<String>'이 찍힌다. 아직 상자가 안 열린 상태다.

상자를 열려면: await

Future<String> fetchName() {
  return Future.delayed(Duration(seconds: 2), () => '홍길동');
}

Future<void> main() async {
  print('요청 시작');
  final name = await fetchName(); // 여기서 값이 도착할 때까지 기다림
  print('이름: $name');
}

요청 시작
(2초 뒤)
이름: 홍길동

await는 "이 Future의 값이 도착할 때까지 이 줄에서 기다려라"는 뜻이다. 그리고 await를 쓰는 함수에는 두 가지가 필요하다.

• 함수 몸통 앞에 **async**를 붙인다
• 반환 타입을 **Future<...>**로 감싼다 (void면 Future<void>)

async를 빼먹고 await만 쓰면 The 'await' expression can only be used in an 'async' function. 에러가 난다.

"기다린다"의 진짜 의미: 앱이 멈추는 게 아니다

await에서 기다린다고 해서 앱 전체가 멈추는 게 아니다. 순서를 보면 알 수 있다.

Future<void> loadData() async {
  print('2. 요청 보냄');
  await Future.delayed(Duration(seconds: 2));
  print('4. 응답 도착');
}

Future<void> main() async {
  print('1. 시작');
  final future = loadData(); // await 없이 호출
  print('3. 기다리는 동안 다른 일');
  await future;
}

1. 시작
2. 요청 보냄
3. 기다리는 동안 다른 일
4. 응답 도착

loadData()가 기다리는 2초 동안, 호출한 쪽은 3. 기다리는 동안 다른 일을 먼저 실행했다. await는 그 함수 안에서만 기다리고, 그동안 다른 코드가 돌아갈 수 있게 해준다. Flutter에서 서버 응답을 기다리는 중에도 화면이 멈추지 않고 스크롤이 되는 이유가 이거다.

에러 처리: try / catch

Future<String> fetchName() async {
  await Future.delayed(Duration(seconds: 1));
  throw Exception('서버 오류');
}

Future<void> main() async {
  try {
    final name = await fetchName();
    print(name);
  } catch (e) {
    print('실패: $e'); // 실패: Exception: 서버 오류
  }
}

await를 쓰면 일반 코드처럼 try/catch로 에러를 잡을 수 있다. 네트워크 요청은 실패할 수 있으니 실무에서는 거의 항상 이 형태로 쓴다.

Stream - 값이 여러 번 도착하는 경우

Future는 값이 딱 한 번 도착한다. 값이 여러 번 계속 도착해야 하면 Stream을 쓴다. 채팅 메시지, 실시간 위치처럼 이어서 오는 데이터다.

Stream<int> countDown() async* {
  for (var i = 3; i >= 1; i--) {
    await Future.delayed(Duration(seconds: 1));
    yield i; // 값을 하나씩 내보냄
  }
}

Future<void> main() async {
  await for (final n in countDown()) {
    print(n); // 3, 2, 1 이 1초 간격으로 출력
  }
}

async*와 yield로 값을 하나씩 내보내고, await for로 하나씩 받는다. 지금은 "Future는 한 번, Stream은 여러 번"이라는 차이만 기억하면 된다. Stream은 Flutter의 StreamBuilder에서 다시 만난다.

Kotlin과 비교하면

// Kotlin 코루틴
suspend fun fetchName(): String {
    delay(2000)
    return "홍길동"
}

fun main() = runBlocking {
    val name = fetchName()
    println("이름: $name")
}

가장 큰 차이는 호출하는 모양이다. Kotlin의 suspend 함수는 그냥 호출하면 알아서 기다리지만, Dart는 Future를 돌려주는 함수를 await 없이 호출하면 상자만 받고 넘어간다. 그래서 Dart에서는 await를 빼먹는 실수가 흔하다. Swift의 async/await와는 키워드까지 거의 같다.

정리

• Dart는 시간이 걸리는 작업을 기다리느라 멈추지 않고, "나중에 값이 도착한다"는 약속인 Future<T>를 먼저 돌려준다
• Future의 값을 꺼내려면 await를 쓰고, 그 함수에는 async를 붙이고 반환 타입을 Future<...>로 감싼다
• await는 그 함수 안에서만 기다리고, 앱 전체를 멈추지 않는다
• 실패할 수 있는 요청은 try/catch로 감싸서 에러를 처리한다
• 값이 한 번이면 Future, 여러 번 이어서 오면 Stream이다

다음 글부터는 Dart 문법을 넘어 2단계, 위젯과 레이아웃을 다뤄보겠다.