最全面的Flutter（dart）中future使用教程和异步原理

前言

接触过flutter的开发同学都知道，flutter是一个单线程模型的跨端UI框架，可以说是非常强大，主流的客户端、桌面、前端应用都可以通过flutter来实现，但是既然是写UI就有一个绕不开的话题，数据获取和UI渲染是如何处理的呢？像安卓和iOS都有自己的线程机制：子线程获取数据，main线程用于UI刷新，那Flutter 这个单线程是如何做到的呢？关于Flutter的UI刷新这里先不谈，先看看flutter中的异步操作是如何处理

Flutter 如何的异步操作

Dart 是一个单线程模型的编程语言，这意味着所有的 Dart 代码在同一个线程上运行。然而，Dart 提供了事件循环和异步编程机制来处理耗时任务，以便不会阻塞 UI。

事件循环和微任务队列：
事件循环: Dart 的事件循环负责管理事件队列和微任务队列。它按顺序处理队列中的任务。
事件队列: 包含 I/O 操作、计时器等任务。
微任务队列: 包含高优先级的任务，通常用于 Future 的回调。
事件循环会优先处理微任务队列，然后处理事件队列中的任务，因此想要提高事件的优先级可以通过定义微任务队列来实现

异步编程模型

Dart 提供了丰富的API来支持异步编程，包括 Future、Stream 以及 async/await 关键字。

1、Future

future 提供了丰富的方法来满足我们异步编程的场景：

1. then()
then() 方法用于在 Future 完成后执行回调函数。它接收一个参数，即 Future 的结果。

Future<String> fetchData() async {
   
  return Future.delayed(Duration(seconds: 2), () => 'Data fetched');
}

void main() {
   
  fetchData().then((data) {
   
    print(data); // 输出: Data fetched
  });
}

2. catchError()
catchError() 用于捕获 Future 执行过程中抛出的错误。它可以与 then() 链式调用。

Future<String> fetchDataWithError() async {
   
  return Future.delayed(Duration(seconds: 2), () => throw Exception('Error'));
}

void main() {
   
  fetchDataWithError().then((data) {
   
    print(data);
  }).catchError((error) {
   
    print('Caught error: $error'); // 输出: Caught error: Exception: Error
  });
}

补充：关于Future中onError() 和catchError()：
catchError 和 onError 都是用于处理 Future 中的错误，但它们有一些区别：
catchError:

• catchError 是 Future 类的一个方法，用于捕获并处理 Future 中的错误
• 它可以接受一个 test 参数，用于指定捕获哪些类型的错误。
• catchError 会在 Future 链中捕获错误并处理，然后返回一个新的 Future。

Future<int> futureWithCatchError() {
   
  return Future<int>.error('An error occurred')
      .catchError((error) {
   
        print('Caught error: $error');
        return -1; // 捕获到异常返回一个默认值或者处理这个异常
      });
}

onError:

• onError 是 Future 类的一个方法，用于在 then 方法中处理错误。
• 它是 then 方法的第二个参数，用于处理 Future 中的错误。
• onError 只会在 then 方法中捕获错误，并不会返回一个新的 Future。

Future<int> futureWithOnError() {
   
  return Future<int>.error('An error occurred')
      .then((value) {
   
        print('Value: $value');
        return value;
      }, onError: (error) {
   
        print('Caught error: $error');
        return -1; 
      });
}

catchError 是 Future 类的一个方法，用于捕获并处理 Future 中的错误，并返回一个新的 Future。
onError 是 then 方法的第二个参数，用于在 then 方法中处理错误，并不会返回一个新的 Future。

3. whenComplete()
whenComplete() 在 Future 完成（无论成功或失败）时执行回调。它不接收 Future 的结果或错误。

Future<String> fetchData() async {
   
  return Future.delayed(Duration(seconds: 2), () => 'Data fetched');
}

void main() {
   
  fetchData().then((data) {
   
    print(data);