Generator及其使用

最新推荐文章于 2024-05-20 04:03:13 发布

小宇宙chris_310

最新推荐文章于 2024-05-20 04:03:13 发布

阅读量973

点赞数

分类专栏： javascript

本文链接：https://blog.csdn.net/qq_38796823/article/details/88210733

版权

javascript 专栏收录该内容

33 篇文章 0 订阅

订阅专栏

基本使用

1、generator（生成器）是ES6标准引入的新的数据类型。类似于一个函数，但可以返回多次值。
2、generator对象在返回值的过程中一旦发现了return，那么整个生成器就会直接结束。
3、可以通过for-of遍历generator对象，（不过他只会遍历所有yield返回的值）
4、如果要使用generator发起多次请求，那么，在适当的时候执行next方法就可以连续发起多次请求了。

案例

<body>
    用户名：<input type="text" value="admin">
    密码：<input type="password" value="12345">
    <button type="button">登陆</button><br>
    <div></div>
</body>
<script src="./jquery-3.3.1.js"></script>
<script>
    $(function () {
        $('button').on('click', function () {

            let username = $('input:text').val()
            let password = $('input:password').val()
            //声明一个空对象，用于接收每次请求返回的值
            var obj = {}
            function* gen() {
                yield fetch('http://127.0.0.1:8081/login?username=' + username + '&password=' + password).then(function (data) {
                    return data.json();
                }).then(function (data) {
                    obj = data
                    return data;
                })
                yield fetch('http://127.0.0.1:8081/getInf?username=' + obj.username).then(function (data) {
                    return data.json()
                }).then(function (data) {
                    obj = data
                    console.log(obj)
                    return data;
                })
                yield fetch('http://127.0.0.1:8081/getSum?level=' + obj.level).then(function (data) {
                    return data.json()
                }).then(function (data) {
                    obj = data
                    console.log(obj)
                    return data;
                })
                return 'end';
            }

            var g1 = gen();

            // 第一次发起请求
            // var f1=g1.next().value
            var f1 = g1.next().value.then(function (data) {
                console.log('1', data)
                var username = data.username;
                if (username == 'admin') {
                    // 第二次发起请求
                    g1.next().value.then(function (data) {
                        console.log('2', data)
                        let level = data.level;
                        let name = data.name;
                        let sex = data.sex;
                        if (level == '高级VIP') {
                            // 第三次发起请求
                            g1.next().value.then(function (data) {
                                console.log('2', data)
                                let sum = data.sum;
                                $('div').append(`名字：${name}<br>性别：${sex}<br>等级：${level}<br>总额：${sum}`)
                            })
                        }
                    })
                }
            })
        })
    })
</script>

小宇宙chris_310

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Generator及其使用

基本使用1、generator（生成器）是ES6标准引入的新的数据类型。类似于一个函数，但可以返回多次值。2、generator对象在返回值的过程中一旦发现了return，那么整个生成器就会直接结束。3、可以通过for-of遍历generator对象，（不过他只会遍历所有yield返回的值）4、如果要使用generator发起多次请求，那么，在适当的时候执行next方法就可以连续发起多次请...
复制链接

扫一扫