yield关键字

MDN关于yield关键字的解释: 

The yield keyword is used to pause and resume a generator function (function* or legacy generator function).

// yield 关键字用来暂停和恢复一个生成器函数((function* 或遗留的生成器函数)。

yield是个啥?

首先,先确定一下,yield是个关键字,注意它不是一个函数。yield跟var、let关键字声明不同,它 有点儿类似于return,yield能够返回紧跟在语句后面那个表达式的值。它与return不同之处在于,return只能运行一遍,而yeild可以多次执行。

yield用法

[rv] = yield [expression];

// rv可选。返回传递给生成器的next()方法的可选值,以恢复其执行。
// expression可选。定义通过迭代器协议从生成器函数返回的值。如果省略,则返回undefined

关于Generator函数

yield只能在Generator函数中使用,function * fun() {}这便是一个Generator函数。

Generator函数有两个特征:

1.function函数与函数名之间有一个*

2.他的内部需要配合yield关键字来打断执行。

关于next()方法

yield表达式本身没有返回值,或者说总是返回undefined。next方法可以带一个参数,该参数就会被当作上一个yield表达式的返回值。

***Generator函数、yield关键字、next方法像是一个铁三角一样,以组合方式出道***

看了这么多,可能也是迷迷糊糊,下面来举个栗子:

let num = 1;
function *fun() {
    num ++;
    yield;
    return num;
}

let resFun = fun();
console.log(num); // 请问这时候会console出什么?

// 此时num的值===1,为啥嘞?因为let resFun = fun();这段代码只是声明了这个函数,人家函数里面的代码一句还没执行呢,所以num = 1。
// 如果想要执行这个函数里面的代码就需要next()方法来支持一下了

let res1 = resFun.next();
console.log(num); // 这个时候num = 2

// 借此机会可以来看看next()返回了什么
let res2 = resFun.next();
console.log(res1); // 返回{value:undefined, done: false}
console.log(res2); // 返回{value:2, done: true}

此时,你明白否?

总结一下:


(1)遇到yield表达式,就暂停执行后面的操作,并将紧跟在yield后面的那个表达式的值,作为返回的对象的value属性值。

(2)下一次调用next方法时,再继续往下执行,直到遇到下一个yield表达式。

(3)如果没有再遇到新的yield表达式,就一直运行到函数结束,直到return语句为止,并将return语句后面的表达式的值,作为返回的对象的value属性值。

(4)如果该函数没有return语句,则返回的对象的value属性值为undefined。

兼容性:(除了ie其他都可以)

虽然前端平常用不到这个关键字,不过多了解了解还是好的,万一面试时用到了呢哈哈

已标记关键词 清除标记
相关推荐
©️2020 CSDN 皮肤主题: 书香水墨 设计师:CSDN官方博客 返回首页