今天这篇文章让我感到非常的兴奋,接下来我们将一起领略ES6中最具魔力的特性。

为什么说是“最具魔力的”?对于初学者来说,此特性与JS之前已有的特性截然不同,可能会觉得有点晦涩难懂。但是,从某种意义上来说,它使语言内部的常态行为变得更加强大,如果这都不算有魔力,我不知道还有什么能算。

不仅如此,此特性可以极大地简化代码,它甚至可以帮助你逃离“回调地狱”。

既然新特性如此神奇,那么就一起深入了解它的魔力吧!

ES6生成器(Generators)简介:

什么是生成器?

我们从一个示例开始:

function* quips(name) {
yield "你好 " + name + "!";
yield "希望你能喜欢这篇介绍ES6的译文";
if(name.startsWith("X")) {
yield "你的名字 " + name + " 首字母是X,这很酷!";
}
yield "我们下次再见!";
}

这段代码很可能代表着当今互联网上最重要的一类应用,如果感到困惑,可以点击这里查看,然后再回来接着阅读。

这段代码看起来很像一个函数,我们称之为生成器函数,它与普通函数有很多共同点,但是二者有如下区别:

  • 普通函数使用function声明,而生成器函数使用function*声明。
  • 在生成器函数内部,有一种类似return的语法:关键字yield。二者的区别是,普通函数只可以return一次,而生成器函数可以yield多次(当然也可以只yield一次)。在生成器的执行过程中,遇到yield表达式立即暂停,后续可恢复执行状态。

这就是普通函数和生成器函数之间最大的区别,普通函数不能自暂停,生成器函数可以。

生成器做了什么?

当你调用quips()生成器函数时发生了什么?

> var iter = quips("jorendorff");
[object Generator];
> iter.next();
{ value: "你好 jorendorff!", done: false };
> iter.next();
{ value: "希望你能喜欢这篇介绍ES6的译文", done: false };
> iter.next();
{ value: "我们下次再见!", done: false };
> iter.next();
{ value: undefined, done: true };

你大概已经习惯了普通函数的使用方式,当你调用它们时,它们立即开始运行,直到遇到return或抛出异常时才退出执行,作为JS程序员你一定深谙此道。

.....

es6学习笔记二:生成器 Generators的更多相关文章

  1. ES6学习笔记<三> 生成器函数与yield

    为什么要把这个内容拿出来单独做一篇学习笔记? 生成器函数比较重要,相对不是很容易理解,单独做一篇笔记详细聊一聊生成器函数. 标题为什么是生成器函数与yield? 生成器函数类似其他服务器端语音中的接口 ...

  2. ES6学习笔记<二>arrow functions 箭头函数、template string、destructuring

    接着上一篇的说. arrow functions 箭头函数 => 更便捷的函数声明 document.getElementById("click_1").onclick = ...

  3. ES6学习笔记(二)——字符串扩展

    相信很多人也和我一样,不喜欢这样循规蹈矩的逐条去学习语法,很枯燥乏味.主要是这样学完一遍之后,没过一段时间就忘到九霄云外了.不如实际用到的时候研究它记得牢靠,所以我就整理成笔记,加深记忆的同时便于复习 ...

  4. ES6学习笔记二

    字符串遍历 var str = 'hello'; for(let s of str){console.log(s += ' ')} //h e l l o 字符串查找:添加了include(str,i ...

  5. ES6学习笔记二:各种扩展

    转载请注明原文地址:http://www.cnblogs.com/ygj0930/p/7242967.html 一:字符串扩展 1:字符串遍历器 for (let char of str) { // ...

  6. ES6学习笔记(二)

    Set 和 Map 数据结构 1.set 基本用法 ES6提供了新的数据结构Set,它类似于数组,但是成员的值都是唯一的,没有重复的值 Set本身是一个构造函数,用来生成Set数据结构 const s ...

  7. ES6学习笔记<五> Module的操作——import、export、as

    import export 这两个家伙对应的就是es6自己的 module功能. 我们之前写的Javascript一直都没有模块化的体系,无法将一个庞大的js工程拆分成一个个功能相对独立但相互依赖的小 ...

  8. ES6学习笔记<四> default、rest、Multi-line Strings

    default 参数默认值 在实际开发 有时需要给一些参数默认值. 在ES6之前一般都这么处理参数默认值 function add(val_1,val_2){ val_1 = val_1 || 10; ...

  9. ES6学习笔记<一> let const class extends super

    学习参考地址1  学习参考地址2 ECMAScript 6(以下简称ES6)是JavaScript语言的下一代标准.因为当前版本的ES6是在2015年发布的,所以又称ECMAScript 2015:也 ...

随机推荐

  1. h5网页在微信里打开 右上角分享到微信好友或者朋友圈

    首先你需要一个分享接口地址,然后在自定义图片 标题 描述 如下: <script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js& ...

  2. javascript获取时间戳

    时间戳: 时间戳是自 1970 年 1 月 1 日(00:00:00 GMT)以来的秒数.它也被称为 Unix 时间戳(Unix Timestamp). JavaScript 获取当前时间戳: < ...

  3. 【BZOJ4155】[Ipsc2015]Humble Captains

    题解: 第一问裸的最小割 第二问考虑贪心 我们把边权平均分配给两个点 然后就变成了给n个数分两组差最小 np-hard问题 暴力背包,操作存在区间左移,右移,or bieset优化

  4. linux 运维一些常见的简单安全设置 运维必看

    1. 修改ssh服务的默认端口,这个是十分有必要的,因为密码爆破一直存在.ssh服务的默认端口是22,一般的恶意用户也往往扫描或尝试连接22端口.所以第一步就是修改这个默认端口打开/etc/ssh/s ...

  5. net core体系-web应用程序-4net core2.0大白话带你入门-7asp.net core日志组件(Logger和Nlog)

    asp.net core日志组件   日志介绍 Logging的使用 1. appsettings.json中Logging的介绍 Logging的配置信息是保存在appsettings.json配置 ...

  6. jQuery Validate自定义错误信息,自定义方法

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. windows下安装Memcached服务器,PHP的memcache扩展

    Memcahed 介绍:Memcahed是一个内存缓存服务器 (类似MySQL服务器) 作用:提高web的响应速度,例如缓存数据库查询结果 原理:把数据存到内存中 (提高速度的原因) 教程相关 系统: ...

  8. POJ 2029 Get Many Persimmon Trees (模板题)【二维树状数组】

    <题目链接> 题目大意: 给你一个H*W的矩阵,再告诉你有n个坐标有点,问你一个w*h的小矩阵最多能够包括多少个点. 解题分析:二维树状数组模板题. #include <cstdio ...

  9. 从零搭建 ES 搜索服务(五)搜索结果高亮

    一.前言 在实际使用中搜索结果中的关键词前端通常会以特殊形式展示,比如标记为红色使人一目了然.我们可以通过 ES 提供的高亮功能实现此效果. 二.代码实现 前文查询是通过一个继承 Elasticsea ...

  10. linux学习笔记 其他常用命令

    cd + 回车  = cd ~ 进入当前用户主目录 查看指定进程信息 *ps -ef |grep 进程名 *ps -查看属于自己的进程 *ps -aux 查看所有的用户的执行进程 换成    ps - ...