为何Dart代码未按顺序执行？Flutter异步逻辑困惑

你碰到的问题其实是Dart异步编程里一个常见的坑——forEach不会等待内部的异步回调完成，再加上你混用了await和.then()，导致代码执行顺序完全和预期不符。咱们一步步拆解：

为什么原代码会出错？ #

1. forEach的异步回调是"火后即忘"：你在querySnapshot.docs.forEach((doc) async { ... })里写了异步逻辑，但forEach本身不会等待每个回调里的await完成，它会一口气把所有回调都触发，然后立刻继续执行外层代码（也就是print('print 2: ${quizzes.length}')）。
2. 混用await和.then()增加了逻辑混乱：虽然.then()确实会在Future完成后执行回调，但当回调内部又有异步操作时，外层代码并不会自动等待这些嵌套的异步逻辑完成。

从你的控制台输出就能看出来：print 2先输出了0，之后.then()里的添加操作才陆续执行，这就是因为forEach没等内部异步完成就走完了。

修正方案1：用for循环替代forEach（串行执行） #

for循环可以完美支持异步等待，每一次循环都会等待当前的异步操作完成后再进入下一次：

static Future<List<Quiz>> getUserQuizzes({FirebaseFirestore? firestore}) async {
  // 简化null判断
  firestore ??= FirebaseFirestore.instance;

  List<Quiz> quizzes = [];

  // 用await替代.then()，让逻辑更线性
  final querySnapshot = await firestore
      .collection('quizzes')
      .where('creatorID', isEqualTo: getCurrentUserID())
      .get();

  print('print 1: ${querySnapshot.docs.length}');

  // 用for循环遍历，等待每个异步操作完成
  for (final doc in querySnapshot.docs) {
    print('print inside loop');
    // 直接await获取quiz，不需要嵌套.then()
    final tempQuiz = await Quiz().retrieveQuizFromId(id: doc.id);
    if (tempQuiz != null) {
      quizzes.add(tempQuiz);
      print('print after add: ${quizzes.length}');
    }
  }

  print('print 2: ${quizzes.length}');
  return quizzes;
}

这个版本的执行顺序会变成：
print1 → 循环里逐个等待retrieveQuizFromId完成并添加元素 → print2输出正确的长度5。

修正方案2：用Future.wait并行执行（效率更高） #

如果你的retrieveQuizFromId是IO密集型操作（比如请求Firebase），可以用Future.wait让所有异步操作并行执行，大幅提升效率：

static Future<List<Quiz>> getUserQuizzes({FirebaseFirestore? firestore}) async {
  firestore ??= FirebaseFirestore.instance;

  final querySnapshot = await firestore
      .collection('quizzes')
      .where('creatorID', isEqualTo: getCurrentUserID())
      .get();

  print('print 1: ${querySnapshot.docs.length}');

  // 生成所有获取quiz的Future列表
  final quizFutures = querySnapshot.docs
      .map((doc) => Quiz().retrieveQuizFromId(id: doc.id))
      .toList();

  // 等待所有Future完成，然后过滤掉null值
  final quizzes = (await Future.wait(quizFutures)).whereType<Quiz>().toList();

  print('print 2: ${quizzes.length}');
  return quizzes;
}

这个版本会同时发起所有retrieveQuizFromId请求，等全部完成后再整理结果，比串行执行快很多。

核心总结 #

• 避免在forEach中使用async回调：forEach不会等待异步操作完成，会导致逻辑顺序混乱。
• 尽量统一使用await代替.then()：线性的await代码比嵌套的.then()更易读、更不容易出错。
• 并行处理多Future用Future.wait：适合IO密集型操作，能显著提升性能。

内容的提问来源于stack exchange，提问作者JAgüero