Flutter 学习之路 -- 异步任务

Flutter 学习之路 - 异步任务

实验 Flutter 的异步任务 --- 代码Github地址

Fultter 异步任务试验

Flutter 在很多地方需要用到异步的任务，例如，加载网络数据，任务延迟执行等，所以异步任务是不可避免的问题。本次试验主要试验了下面几种情况：

用 Future, then 实现任务延迟执行
用 async 和 await 实现任务延迟执行
测试调用 async 方法时，代码的执行顺序问题

代码地址

用 Future, then 实现任务延迟执行

Future 可以用来执行未来要执行的方法，例如下面代码，先输出 ”Started“, 调用 Future 以后过了一秒钟，再输出 ”Completed Task1“。

void thenCatch(){mytext="Started";setMyTextState(mytext);// then 用来说明 1 second 后做什么Future.delayed(Duration(seconds: 1)).then((_){// 当运行完成mytext = mytext + "\n" + "Completed Task1";setMyTextState(mytext);}).catchError((e){// 当运行失败mytext=mytext+"\n"+'failed: ${e.toString()}';setMyTextState(mytext);});
}

用 async 和 await 实现任务延迟执行

await 也是 Flutter 中很好的一种执行异步任务的方法。

但是要使用await，必须在有async标记的函数中运行，否则这个await会报错。

下面是一个加了 await 的方法，它的输出是怎么样呢?

Future<void> asyncAwait() async{mytext="Started";setMyTextState(mytext);try{// 这里没有 .then, 要加 await, await 是说在 await 完成前别往下执行await Future.delayed(Duration(seconds: 1));mytext=mytext+"\n"+"Completed Task1";setMyTextState(mytext);await Future.delayed(Duration(seconds: 1));mytext=mytext+"\n"+"Completed Task2";setMyTextState(mytext);}catch(e){print('failed: ${e.toString()}');}
}

答案是：

Started
--- 1 second ---
Completed Task1
--- 2 second ---
Completed Task2

先输出 ”Start“, 然后过一秒，输出 ”Completed Task1“ 再过一秒输出 ”Completed Task2“ 。

如果把方法里的 await 去掉，看看会发生什么呢，结果是，Task1 和 Task2不会等待Future.delayed 完成，会直接执行。

Started
Completed Task1
Completed Task2
--- 1 second ---

测试调用 async 方法时，代码的执行顺序问题

那如果说，代码依次是 Task1, Task2, Task3, Task4, Task2 是一个异步的方法，Task3 , Task4 需要等待 Task2 完成吗？

代码如下：

Future<void> asyncAwaitWithTask() async{mytext="Started";setMyTextState(mytext);try{// 这里没有 .then, 要加 await, await 是说在 await 完成前别往下执行await Future.delayed(Duration(seconds: 1));mytext=mytext+"\n"+"Completed Task1";setMyTextState(mytext);task2();mytext=mytext+"\n"+"Completed Task3";setMyTextState(mytext);mytext=mytext+"\n"+"Completed Task4";setMyTextState(mytext);}catch(e){print('failed: ${e.toString()}');}
}void task2() async{await Future.delayed(Duration(seconds: 1));mytext=mytext+"\n"+"Completed Task2";setMyTextState(mytext);
}

答案是, Task3, Task4 会先于 Task2 执行，最前面的 GIF 图就是在运行的这个场景。

Started
--- 1 second ---
Completed Task1
Completed Task3
Completed Task4
--- 2 second ---
Completed Task2

Flutter 学习之路 Github 地址

github.com/draftbk/flu…