Generator 是 ES6 中新增的语法,和 Promise 一样,都可以用来异步编程

// 使用 * 表示这是一个 Generator 函数
// 内部可以通过 yield 暂停代码
// 通过调用 next 恢复执行
function* test() {
let a = 1 + 2;
yield 2;
yield 3;
}
let b = test();
console.log(b.next()); // > { value: 2, done: false }
console.log(b.next()); // > { value: 3, done: false }
console.log(b.next()); // > { value: undefined, done: true }

从以上代码可以发现,加上 * 的函数执行后拥有了 next 函数,也就是说函数执行后返回了一个对象。每次调用 next 函数可以继续执行被暂停的代码。以下是 Generator 函数的简单实现

// cb 也就是编译过的 test 函数
function generator(cb) {
return (function() {
var object = {
next: 0,
stop: function() {}
}; return {
next: function() {
var ret = cb(object);
if (ret === undefined) return { value: undefined, done: true };
return {
value: ret,
done: false
};
}
};
})();
}
// 如果你使用 babel 编译后可以发现 test 函数变成了这样
function test() {
var a;
return generator(function(_context) {
while (1) {
switch ((_context.prev = _context.next)) {
// 可以发现通过 yield 将代码分割成几块
// 每次执行 next 函数就执行一块代码
// 并且表明下次需要执行哪块代码
case 0:
a = 1 + 2;
_context.next = 4;
return 2;
case 4:
_context.next = 6;
return 3;
// 执行完毕
case 6:
case "end":
return _context.stop();
}
}
});
}

简单说说JavaScript的Generator 实现(ES6)的更多相关文章

  1. 最简单的JavaScript模板引擎

    在小公司待久了感觉自己的知识面很小,最近逛博客园和一些技术网站看大家在说JavaScript模版引擎的事儿,完全没有概念,网上一搜这是08年开始流行起来的...本来以为这是很高深的知识,后来在网上看到 ...

  2. 一个简单的javascript节流器实现

    节流器 javascript的节流器主要用于延缓某些动作的执行,比如ajax请求,如果input框注册了input事件,那么当用户输入时就会持续的触发这个事件,如果回调函数中持续的通过ajax调用后台 ...

  3. javaScript - 面向对象 - ES5 和 ES6

    javaScript - 面向对象 - ES5 和 ES6 ES5之前用 构造函数 构造函数的特点 就是一个普通函数, 他的函数名要大写.: 带方法的写法: 原型的方式: prototype 为内置的 ...

  4. 简单的JavaScript字符串加密解密

    简单的JavaScript字符串加密解密 <div> <input type="text" id="input" autofocus=&quo ...

  5. JavaScript、TypeScript、ES6三者之间的联系和区别

    ES6是什么 ECMAScript 6.0(以下简称ES6)是JavaScript语言(现在是遵循ES5标准)的下一代标准,已经在2015年6月正式发布了.它的目标,是使得JavaScript语言可以 ...

  6. ES6 Generator vs ES6 async/await

    ES6 Generator vs ES6 async/await next yield promise refs xgqfrms 2012-2020 www.cnblogs.com 发布文章使用:只允 ...

  7. JavaScript Learning Paths(ES5/ES6/ES-Next)

    JavaScript Learning Paths(ES5/ES6/ES-Next) JavaScript Expert refs https://developer.mozilla.org/en-U ...

  8. ES6新特性:Javascript中Generator(生成器)

    ES6的很多特性都跟Generator扯上关系,而且实际用处比较广, 包含了任何需要异步的模块, 比如ajax, filesystem, 或者数组对象遍历等都可以用到: Generator的使用: G ...

  9. 6周学习计划,攻克JavaScript难关(React/Redux/ES6 etc.)

    作者:余博伦链接:https://zhuanlan.zhihu.com/p/23412169来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处. 和大家一样,最近我也看了Jo ...

随机推荐

  1. Oracle高危安全漏洞:具有查询权限用户可绕开安全限制进行数据修改

    数据库版本 11.2.0.* 检查数据库是否存在此bug的脚本: Oracle用户执行此脚本 #!/bin/bash # Usage: 检查ORACLE数据库是否存在高危安全漏洞(具有查询权限用户可绕 ...

  2. 【08】Kubernets:Service

    写在前面的话 在 K8S 第一节的时候我们简单提到过 Service 的工作模式有三种:userspace / iptables / ipvs.并且已经知道在目前新版本中默认是 ipvs,前提是在按照 ...

  3. Dictionary<string, Dictionary<string, Person>> dic = new Dictionary<string, Dictionary<string, Person>>();

    using System;using System.Collections.Generic;using System.Linq;using System.Text; namespace Console ...

  4. redis的主从复制,哨兵值守

    环境: 主服务器:192.168.10.10    Centos 7  redis-5.0.4 从服务器:192.168.10.129  Centos 7  redis-5.0.4 从服务器:192. ...

  5. dapperDemo

    dapperDemo 下载链接:http://pan.baidu.com/s/1geQHXPT

  6. SpringApplication到底run了什么(下)

    在上篇文章中SpringApplication到底run了什么(上)中,我们分析了下面这个run方法的前半部分,本篇文章继续开工 public ConfigurableApplicationConte ...

  7. React Navigation 导航栏样式调整+底部角标消息提示

    五一佳节匆匆而过,有人选择在外面看人山人海,有人选择宅在家中度过五一,也有人依然坚守在第一线,致敬! 这是坚持学习react-native的第二篇文章,可能会迟到,但是绝不会缺席,这篇要涉及到的是re ...

  8. Centos7允许使用密码登录

      现在使用云主机比较多,所以一般都是使用秘钥登录,当做一个集群的时候需要几台机器之间免密登录时,就需要修改他的配置文件了,刚做运维那会儿,很熟练,现在忘得差不多了,特此记录一下,下次又这个需求时就不 ...

  9. 剑指:求1+2+…+n

    题目描述 求 1+2+…+n,要求不能使用 乘除法.for.while.if.else.switch.case 等关键字及条件判断语句 A?B:C. 样例 输入:10 输出:55 解法 前面的和+后一 ...

  10. python抓取网站提示错误ssl.SSLCertVerificationError处理

    python在抓取制定网站的错误提示:ssl.SSLCertVerificationError: [SSL: CERTIFICATE_VERIFY_FAILED] certificate verify ...