ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

15_Generator应用

2021-04-24 09:05:09  阅读:200  来源: 互联网

标签:function 异步 15 函数 Generator readFile Thunk 应用


<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>

<body>
    <script>
        /*  Generator 函数的异步应用
    
            一、传统方法
            二、基本概念
            三、Generator函数
            四、Thunk函数
            五、co模块       
            
            异步编程对 Javascript 语言太重要。
            Javascrit语言的执行环境是“单线程”的,如果没有异步编程,根本没法用,非卡死不可。
    
            下面主要介绍 Generator 函数如何完成异步操作。
        */

        /*  一、传统方法:
    
                es6诞生之前,异步编程的方法,大概有下面四种:
                - 回调函数
                - 时间监听
                - 发布/订阅
                - Promise 对象      
                
                Generator 函数将 Javascript 异步编程带入了一个全新的阶段。
        */

        /*  二、基本概念
    
                所谓“异步”,简单来说就是一个任务不是连续完成的,可以理解成该任务被人为分成两段,
                先执行第一段,然后转而执行其他任务,等做好了准备,再回过头执行第二段。
    
                比如,有一个任务是读取文件进行处理,任务的第一段是向操作系统发出请求,要求读取文件。
                然后,程序执行其他任务,等到操作系统返回文件,再接着执行任务的第二段(处理文件)。
                这种不连续的执行,就叫做异步。
    
                相应地,连续的执行就叫做同步。
                由于是连续执行,不能插入其他任务,所以操作系统从硬盘读取文件的这段时间,程序只能干等着。        
        */

        /* 回调函数
    
            Javascript 语言对异步编程的实现,就是回调函数。
            所谓回调函数,就是把任务的第二段单独写在一个函数里面,等到重新执行这个任务的时候,就直接调用这个函数。
            回调函数的英语名字是 callback,直译过来就是“重新调用”。
        */

        // 读取文件进行处理,是这样写的:
        fs.readFile('/etc/passwd', 'utf-8', function (err, data) {
            if (err) throw err;
            console.log(data)
        })

        // 上面代码中,readFile 函数的第三个函数,就是回调函数,也就是任务的第二段。
        // 等到操作系统返回了 /etc/passwd 这个文件以后,回调函数才会执行。

        // 一个有趣的问题是,为什么 Node 约定,回调函数的一个参数,必须是错误对象err(如果没有错误,该参数就是null?)

        // 原因是执行分成两段,第一段执行完成以后,任务所在的上下文环境就已经结束了。
        // 在这以后抛出的错误,原来的上下文环境已经无法捕捉,只能当做参数,传入第二段。


        /* Promise
    
            回调函数本身并没有问题,它的问题出现在多个回调函数嵌套。
        */

        // 假定读取 A 文件之后,再读取 B 文件,代码如下:
        fs.readFile(fileA, 'utf-8', function (err, data) {
            fs.readFile(fileB, 'utf-8', function (err, data) {
                // ...
            })
        })

        /*  不难想象,如果依次读取两个以上的文件,就会出现多重嵌套。
            代码不是纵向发展而是横向发展,很快就会乱成一团,无法管理。
            因为多个异步操作形成了强耦合,只要有一个操作需要修改,它的上层回调函数和下层回调函数,可能都要跟着修改。
            这种情况就称为“回调函数地狱”(callback hell)。
    
            Promise 对象就是为了解决这个问题而提出的。它不是新的语法功能,而是一种新的写法,
            允许将回调函数的嵌套,改成链式调用。        
        */

        // 采用 Promise,连续读取多个文件,写法如下:
        var readFile = require('fs-readFile-promise');

        readFile(fileA)
            .then(function (data) {
                console.log(data.toString())
            })
            .then(function (data) {
                return readFile(fileB);
            })
            .then(function (data) {
                console.log(data.toString());
            })
            .catch(function (err) {
                console.log(err);
            });

        /*  上面代码中,使用了 fs-readFile-promise 模块,
            它的作用就是返回一个 Promise版本的 readFile 函数。
    
            Promise 提供 then 方法加载回调函数,catch 方法捕捉执行过程中抛出的错误。
            
            可以看到,Promise 的写法只是回调函数的改进,使用 then 方法以后,异步任务的两段执行看的更清楚了。
            除此之外,并无新意。
    
            Promise 的最大问题是代码冗余,原来的任务被 Promise 包装了一下,不管什么操作,
            一眼看去都是一堆 then,原来的语义变得很不清楚。
    
            那么,有没有更好的写法呢?
        */

        /*  三、Generator 函数
        
            协程
    
            传统的编程语言,早有异步编程的解决方案(其实是多任务的解决方案)。其中有一种叫做“协程”,
            意思是多个线程互相协作,完成异步任务。
    
            协程有点像函数,又有点像线程。它的运行流程大致如下:
            - 第一步,协程 A 开始执行。
            - 第二步,协程 A 执行到一半,进入暂停,执行权转移到协程 B.
            - 第三步,(一段时间后)协程 B 交还执行权。
            - 第四步,协程 A 恢复执行。        
            
            上面流程的协程 A,就是异步任务,因为它分成两段(或多段)执行。
        */

        // 举例来说,读取文件的协程写法如下。
        function* asyncObj() {
            // ...
            var f = yield readFile(fileA)
            // ...
        }

        /* 上面代码的函数 asyncObj 是一个协程,它的奥妙就在其中的 yield命令。
            它表示执行到此处,执行权将交给其他协程。也就是说,yield 命令是异步两个阶段的分界线。
    
            协程遇到 yield 命令就暂停,等到执行权返回,再从暂停的地方继续往后执行。
            它的最大优点,就是代码的写法非常像同步操作,如果去除 yield 命令,简直一模一样。        
        */

        /* 协程的 Generator 函数实现
    
            Generator 函数就是协程在 ES6 的实现,最大特点就是可以交出函数的执行权,(即暂停执行)。
    
            整个 Generator 函数就是一个封装的异步任务,或者说异步任务的容器。
            异步操作需要暂停的地方,都用 yield 语句注明。
        */

        // Generator 函数的执行方法如下:

        function* gen(x) {
            var y = yield x + 2;
            return y;
        }

        var g = gen(1);
        g.next() // { value: 3, done: false }
        g.next() // { value: undefined, done: true }

        /* Generator 函数的数据交换和错误处理
             Generator 函数可以暂停执行和恢复执行,这是它能封装异步任务的根本原因。

             除此之外,它还有两个特性,使它可以作为异步编程的完整解决方案:函数体内外的数据交换和错误处理机制。

             next 返回值的 value 属性,是 Generator 函数向外输出数据;
             next 方法还可以接受参数,向 Generator 函数体内输入数据。
        */
        function* gen(x) {
            var y = yield x + 2;
            return y;
        }

        var g = gen(1);
        g.next();
        g.next(2)
        /*  上面代码中,第一个 next 方法的 value 属性,返回表达式 x + 2 的值 3 。
            第二个方法带有参数 2,这个参数可以传入 Genenrator 函数,作为上个阶段异步任务的返回结果,被函数体内的变量 y 接收。

            因此,这一步的 value 属性,返回的就是 2 (变量 y 的值)

            Generator 函数内部还可以部署错误处理代码,捕获函数体内抛出的错误。
        */
        function* gen(x) {
            try {
                var y = yield x + 2;
            } catch (e) {
                console.log(e) // 出错了
            }
            return y;
        }

        var g = gen(1);
        g.next();
        g.throw('出错了');
        /*  上面代码的最后一行,Generator 函数体外,
            使用指针对象的 throw 方法抛出的错误,可以被函数体内的 try...catch代码块捕获。
            这意味着,出错的代码与处理错误的代码,实现了时间和空间上的分离,这对于异步编程无疑是很重要的。
        */


        /*  异步任务的封装
 
             下面看看如何使用 Generator 函数,执行一个真实的异步任务。       
        */
        var fetch = require('node-fetch');
        function* gen() {
            var url = 'https://api.github.com/users/github';
            var result = yield fetch(url);
            console.log(result.bio)
        }
        /* 上面的代码中,Generator 函数封装了一个异步操作,该操作先读取一个远程接口,
            然后从 JSON 格式的数据解析信息。就像前面说过的,这段代码非常像 同步操作,除了加上 yield 命令。
        */
        // 执行这段代码的方法如下:
        var g = gen();
        var result = g.next();
        result.value.then(function (data) {
            return data.json();
        }).then(function (data) {
            g.next(data);
        })
        /* 上面代码中,
            先执行 Generator 函数,获取遍历器对象,
            然后使用next 方法(第二行),执行异步任务的第一阶段。
            由于 fetch 模块返回的是一个 Promise 对象,
            因此用 then 方法调用下一个 next 方法。

            可以看到,虽然 Generator 函数将异步操作表示得很简洁,
            但是流程管理却不方便(即何时执行第一阶段、何时执行第二阶段)。
        */

        /*  四、Thunk 函数:

            Thunk 函数是自动执行 Generator 函数的一种方法。        
        */

        /*  参数的求值策略

            Thunk 函数早在上个世纪 60 年代就诞生了。

            那时,编程语言刚刚起步,计算机学家还在研究,编译器怎么写比较好。
            一个争论的焦点是“求值策略”,即函数的参数到底应该何时求值。        
        */
        var x = 1;
        function f(m) {
            return m * 2;
        }
        console.log(f(x + 5)) // 12

        // 产生两种意见:传值调用 和 传名调用

        /* Thunk 函数的含义:
            
            编译器的 “传名调用” 实现,往往是将参数放到一个临时函数之中,再将这个临时函数传入函数体。
            这个临时函数就叫做 Thunk 函数。
        */

        function f(m) {
            return m * 2;
        }
        f(x + 5);

        // 等同于:

        var thunk = function () {
            return x + 5;
        }
        function f(thunk) {
            return thunk() * 2;
        }
        // 上面代码中,函数 f 的参数 x + 5 被一个函数替换了。
        // 凡是用到原参数的地方,对 Thunk 函数求值即可。

        // 这就是 Thunk 函数的定义,它是“传名调用” 的一种实现策略,用来替换某个表达式。

        /*  Javascript 语言的 Thunk 函数

            Javascritp 语言是传值调用,它的 Thunk 函数含义有所不同。
            在 Javascript 语言中,Thunk 函数替换的不是表达式,而是多参数函数,
            将其替换成一个只接受回调函数作为参数的单参数函数。
        */

        // 例:
        // 正常版本的 readFile (多参数版本)
        fs.readFile(fileName, callback);
        // Thunk 版本的 readFile (单参数版本)
        var Thunk = function (fileName) {
            return function (callback) {
                return fs.readFile(fileName, callback);
            };
        };
        /*  上面代码中,fs 模块的 readFile 方法是一个多参数函数,两个参数分别为文件名和回调函数。
            经过转换器处理,它变成了一个单参数函数,只接受回调函数作为参数。
            这个单参数版本,就叫做 Thunk 函数。

            任何函数,只要参数有回调函数,就能写成 Thunk 函数的形式。
        */

        // 下面是一个简单的 Thunk 函数转换器:





    </script>
</body>

</html>```

标签:function,异步,15,函数,Generator,readFile,Thunk,应用
来源: https://blog.csdn.net/weixin_45774432/article/details/116081560

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有