美文网首页flutterFlutterflutter
Flutter 异步编程一(Future、async、await

Flutter 异步编程一(Future、async、await

作者: 面朝对象_春暖花开 | 来源:发表于2019-10-17 21:46 被阅读0次
    • 说明:flutter异步编程我打算分开两部分:
      一、Futureasyncawaitcompleter实现。
      二、Isolatecompute实现。

    三、借鉴文章地址

    这篇文章讲解Futureasyncawaitcompleter的使用。

    Future最简单用法展示:

      void getData<T>() async{
        Future zyn = Future(() => print('运行的Future'))
                      .then((_) => print('运行的Future第一个then'))
                      .then((_) => print('运行的Future第一个then'))
                      .whenComplete(()=>print('运行whenComplete'))
                      .catchError((_)=>print('运行catchError'));
        print(zyn);
      }
    

    写过react native的童鞋都知道,在rn中有个promise,目的是解决回调地狱(callBack无限嵌套)的出现,而且上面的代码和promise的使用相同。
    1、then的链式连接避免了回调地狱的出现
    2、whenCompletecatchError类似iOS中的trycatch

    Future的其他用法展示:

    用法一:直接后面加需要执行的代码
    Future(() => print('立刻在Event queue中运行'));
    
    用法二:Future.delayed
    Future.delayed(const Duration(seconds:1), () => print('1秒后在Event queue中运行'));
    
    用法三:Future. microtask
    Future.microtask(() => print('在Microtask queue里运行的Future'));
    

    前两个很好理解,第一个为立刻执行、第二个为delay一秒后执行。那么Future.microtask是什么用法呢?
    要理解这个,需要知道dart的Event Loop

    dart的Event Loop

    Dart的事件循环如下图所示。和JavaScript的基本一样。循环中有两个队列。一个是微任务队列(MicroTask queue),一个是事件队列(Event queue)。

    • 事件队列包含外部事件,例如I/O, Timer绘制事件等等。
    • 微任务队列则包含有Dart内部的微任务,主要是通过scheduleMicrotask来调度。
    image.png

    Dart的事件循环的运行遵循以下规则:

    • 首先处理所有微任务队列里的微任务。
    • 处理完所有微任务以后。从事件队列里取1个事件进行处理。
    • 回到微任务队列继续循环。

    注意第一步里的所有,也就是说在处理事件队列之前,Dart要先把所有的微任务处理完。如果某一时刻微任务队列里有8个微任务,事件队列有2个事件,Dart也会先把这8个微任务全部处理完再从事件队列中取出1个事件处理,之后又会回到微任务队列去看有没有未执行的微任务。

    总而言之,就是对微任务队列是一次性全部处理,对于事件队列是一次只处理一个。

    那么上面Future. microtask的使用也就明白了。

    Completer

    不多BB,用法直接上代码。

      void getData<T>() async{
        var completer = Completer();
        Future zyn = completer.future;
        zyn.then((_) => print('运行的Future第一个then'))
                      .then((_) => print('运行的Future第二个then'))
                      .whenComplete(()=>print('运行whenComplete'))
                      .catchError((_)=>print('运行catchError'));
        print('先干点别的');
        completer.complete();
      }
    

    打印结果如下:

    flutter: 先干点别的
    flutter: 运行的Future第一个then
    flutter: 运行的Future第二个then
    flutter: 运行whenComplete
    

    结论:CompleterFuture的控制权在我们自己手里,我们来控制Future的调用。

    虽然Future的出现解决了回调地狱的出现,但是依然会出现Future的嵌套,比如两个异步,第二个要依赖第一个结果,那是不是就要在第一个Futurethen或者whenComplete中再初始化一个Future
    async、await的出现就是为了解决这个问题,让你的异步代码,写出同步的感觉。

    async、await

    代码奉上,现行感受一下:

    foo() async {
      print('foo E');
      String value = await bar();
      print('foo X $value');
    }
    
    bar() async {
      print("bar E");
      return "hello";
    }
    
    main() {
      print('main E');
      foo();
      print("main X");
    }
    

    函数foo被关键字async修饰,其内部的有3行代码,看起来和普通的函数没什么两样。但是在第2行等号右侧有个await关键字,await的出现让看似会同步执行的代码裂变为两部分。如下图所示:

    image.png

    绿框里面的代码会在foo函数被调用的时候同步执行,在遇到await的时候,会马上返回一个Future,剩下的红框里面的代码以then的方式链入这个Future被异步调度执行。
    所以结果应该是:

    main E
    foo E
    bar E
    main X
    foo X Hello
    

    到这里就讲完啦,接下来留一个题目,请大家留言,写下自己的答案吧:

    Screen Shot 2019-09-09 at 20.33.49.png

    Flutter 异步编程二(isolate、compute)

    相关文章

      网友评论

        本文标题:Flutter 异步编程一(Future、async、await

        本文链接:https://www.haomeiwen.com/subject/vnnvmctx.html