总结
- 对于框架原理只能说个大概，真的深入某一部分具体的代码和实现方式就只能写出一个框架，许多细节注意不到。
开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
-
算法方面还是很薄弱，好在面试官都很和蔼可亲，擅长发现人的美哈哈哈…（最好多刷一刷，不然影响你的工资和成功率???）
-
在投递简历之前，最好通过各种渠道找到公司内部的人，先提前了解业务，也可以帮助后期优秀 offer 的决策。
-
要勇于说不，对于某些 offer 待遇不满意、业务不喜欢，应该相信自己，不要因为当下没有更好的 offer 而投降，一份工作短则一年长则 N 年，为了幸福生活要慎重选择！！！
第一次跳槽十分忐忑不安，和没毕业的时候开始找工作是一样的感受，真的要相信自己，有条不紊的进行。如果有我能帮忙的地方欢迎随时找我，比如简历修改、内推、最起码，可以把烦心事说一说，人嘛都会有苦恼的～
祝大家都有美好的未来，拿下满意的 offer。
+ - [1. 由内向外传递](#1__236)
- [2.由外向内传递](#2_255)
+ [六、return与throw](#returnthrow_265)
+ - [1. next()、throw()、return()的异同](#1_nextthrowreturn_267)
- [2. return](#2_return_279)
- [3. throw](#3_throw_297)
+ [参考链接](#_328)
一、Generator描述
ES6提供的异步编程解决方案。Generator函数是一个状态机，内部封装了多种状态；还是一个遍历器生成函数，返回的遍历器对象可以遍历Generator函数内部的每一个状态。
二、写法
除普通函数的特征外还有两个特征：
function关键字与函数名之间有一个星号。- 函数体内部使用
yield表达式，定义不同内部状态。
写法如下：
// Gerneator函数hello内部有两个`yield`表达式`hello`和`world`，且函数有三个状态：hello,world和return语句
function\* hello() {
yield 'hello';
yield 'world';
return 'ending';
}
var hw = hello();//调用hello()后返回的是一个指向内部状态的指针对象。
三、yield与next
Generator函数是分段执行的，yield表达式是暂停执行的标记，next方法可以恢复执行，并返回一个有着value和done两个属性的对象。
1. yield
yield表达式是暂停执行的标记
使用yield表达式的注意点：
yield表达式只能用在 Generator 函数里面，用在其他地方都会报错。yield表达式如果用在另一个表达式之中，必须放在圆括号里面。
function\* demo() {
console.log('Hello' + (yield)); // OK
}
- 用作函数参数或放在赋值表达式的右边，可以不加括号。
function\* demo() {
foo(yield 'a', yield 'b'); // OK
let input = yield; // OK
}
2. next
next方法可以恢复执行，并返回一个有着value和done两个属性的对象。
value属性表示当前的内部状态的值，是yield关键字后面表达式的值done属性是一个布尔值，表示是否遍历结束。
next还可以用于传递参数
遍历器对象的next方法运行逻辑如下
- 遇到
yield表达式，暂停执行，并将紧跟在yield后面的表达式的值，作为返回的对象的value属性值。 - 如果没有再遇到新的
yield表达式，就一直运行到函数结束，直到return语句为止，并将return语句后面的表达式的值，作为返回的对象的value属性值。 - 如果该函数没有
return语句，则返回的对象的value属性值为undefined。
运行逻辑实例讲解
- 当第一次调用add()，也就是运行到第38行时，add函数不会开始执行；
- 当第一次调用next()，也就是运行到第39行时，generator函数中蓝色部分开始执行，遇到
yield "2"表达式暂停。【注意：第一个next()仅起到让函数开始执行的作用，不能用于传递数据】
运行结果如下：
- 当第二次调用next()，也就是运行到第40行时，generator函数中黄色部分开始执行，遇到
yield "3"表达式暂停。此时传入的20会替换掉上一个yield表达式，也就是替换let x = yield "2";—>let x = 20;。
运行结果如下：
- 当第三次调用next()，也就是运行到第41行时，generator函数中绿色部分开始执行，遇到
return x+y;表达式暂停。此时传入的30会替换掉上一个yield表达式，也就是替换let y = yield "3";—>let y = 30;。
运行结果如下：
yield与return的异同
相同：都能返回紧跟在语句后面的表达式的值。
不同：
- 遇到
yield函数暂停执行，下次从该位置继续。return语句并不具备暂停功能。 - 一个函数只能执行一次
return语句，可以执行多个yield表达式。
四、Generator函数状态的遍历
1. 遍历一个Generator函数状态
- 通过for…of遍历
注意：一旦next方法返回对象的done属性为true，for…of循环就会中止，且不包含该返回对象，所以return语句返回的值不会在for…of循环中遍历。
function\* foo() {
yield 1;
yield 2;
yield 3;
yield 4;
yield 5;
return 6;
}
for (let v of foo()) {
console.log(v);
}
执行结果如下：
- 通过…解构遍历
// foo函数同上
let fn = foo();
console.log(...fn);
执行结果如下：
2. 在一个Generator函数内遍历另一个Generator函数的状态
- 手动遍历
- for…of遍历
- …解构遍历
- yield*遍历
function\* foo() {
yield "a";
yield "b";
return "result";
}
function\* bar() {
yield "start";
// 1.手动遍历
yield "a";
yield "b";
// 2.利用for of手动遍历 foo()
for (let i of foo()) {
console.log(i);
}
// 3.利用解构赋值...遍历
let fn = foo();
console.log(...fn);
// 4.利用yield\*遍历
// yield\*表明它返回的是一个遍历器对象，结果是该遍历器对象的内部值
yield\* foo();
yield "ending";
}
for (let v of bar()) {
console.log(v);
}
执行结果如下：
yield*介绍
用来在一个 Generator 函数里面执行另一个 Generator 函数
- 与不加*的对比
// foo同上
function\* bar() {
yield\* foo();
// 不加\*的对比
yield foo();
}
for (let v of bar()) {
console.log(v);
}
执行结果如下：
- yield*可接收所调用Genertor函数return的值
// foo同上
// 如果yield\* 接收的 Generator 函数带有return语句，return返回的数据可以被接收。
function\* bar() {
let val = yield\* foo();
console.log(val
}
for (let v of bar()) {
console.log(v);
}
执行结果如下：
- 任何有Iterator接口的数据结构都可以被yield*遍历， 如字符串会遍历每个字符。数组会遍历每个元素。
#### 总结
* 对于框架原理只能说个大概，真的深入某一部分具体的代码和实现方式就只能写出一个框架，许多细节注意不到。
**[开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】](https://bbs.csdn.net/forums/4304bb5a486d4c3ab8389e65ecb71ac0)**
* 算法方面还是很薄弱，好在面试官都很和蔼可亲，擅长发现人的美哈哈哈...（最好多刷一刷，不然影响你的工资和成功率????）
* 在投递简历之前，最好通过各种渠道找到公司内部的人，先提前了解业务，也可以帮助后期优秀 offer 的决策。
* 要勇于说不，对于某些 offer 待遇不满意、业务不喜欢，应该相信自己，不要因为当下没有更好的 offer 而投降，一份工作短则一年长则 N 年，为了幸福生活要慎重选择！！！
第一次跳槽十分忐忑不安，和没毕业的时候开始找工作是一样的感受，真的要相信自己，有条不紊的进行。**如果有我能帮忙的地方欢迎随时找我，比如简历修改、内推、最起码，可以把烦心事说一说**，人嘛都会有苦恼的～
祝大家都有美好的未来，拿下满意的 offer。
扫一扫
716
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
