(基础)JavaScript生成器,执行,传递参数

生成器:生成器是ES6中新增的一种函数控制、使用的方案,它可以让我们更加灵活的控制函数什么时候继续执行、暂停执 行等。

首先,生成器函数需要在function的后面加一个符号:*

其次,生成器函数可以通过yield关键字来控制函数的执行流程:

最后,生成器函数的返回值是一个Generator(生成器):

function* foo() {
  console.log("函数开始执行~")
  const value1 = 100
  console.log("第一段代码:", value1)
  yield
  const value2 = 200
  console.log("第二段代码:", value2)
  yield
  const value3 = 300
  console.log("第三段代码:", value3)
  yield
  console.log("函数执行结束~")
}

// 调用生成器函数时, 会给我们返回一个生成器对象
const generator = foo()
// 函数开始执行~
// 第一段代码: 100
generator.next()
// 第二段代码: 200
generator.next()
// 第三段代码: 300
generator.next()
// 函数执行结束~
generator.next()

生成器函数传递参数

function* foo(num) {               //接受num参数5
  console.log("函数开始执行~")

  const value1 = 100 * num
  console.log("第一段代码:", value1)
  const n = yield value1            //接受n参数  10

  const value2 = 200 * n
  console.log("第二段代码:", value2)
  const count = yield value2       //接受count参数  25

  const value3 = 300 * count
  console.log("第三段代码:", value3)
  yield value3

  console.log("函数执行结束~")
  return "123"
}

// 生成器上的next方法可以传递参数
const generator = foo(5)       //第一个参数直接传递  
// 函数开始执行~
// 第一段代码: 500   并传递参数10  const n = yield value1   
console.log(generator.next(10))    // { value: 500, done: false }

// 第二段代码: 5000    并传递参数20  const count = yield value2 
console.log(generator.next(25))   // { value: 5000, done: false }

终止执行生成器

function* foo(num) {
  console.log("函数开始执行~")

  const value1 = 100 * num
  console.log("第一段代码:", value1)
  const n = yield value1

  const value2 = 200 * n
  console.log("第二段代码:", value2)
  const count = yield value2

  const value3 = 300 * count
  console.log("第三段代码:", value3)
  yield value3

  console.log("函数执行结束~")
  return "123"
}

const generator = foo(10)

console.log(generator.next())

// 第二段代码的执行, 使用了return
// 那么就意味着相当于在第一段代码的后面加上return, 就会提前终端生成器函数代码继续执行
console.log(generator.return(15))
console.log(generator.next())
console.log(generator.next())
console.log(generator.next())
console.log(generator.next())
console.log(generator.next())
console.log(generator.next())

// 函数开始执行~
// 第一段代码: 1000
// { value: 1000, done: false }    
// { value: 15, done: true }       
// { value: undefined, done: true }
// { value: undefined, done: true }
// { value: undefined, done: true }
// { value: undefined, done: true }
// { value: undefined, done: true }
// { value: undefined, done: true }

生成器抛出异常

function* foo() {
  console.log("代码开始执行~")

  const value1 = 100
  try {
    yield value1
  } catch (error) {
    // 捕获异常才可以继续执行,没有捕获不可以执行后面代码
    console.log("捕获到异常情况:", error)
  }

  console.log("第二段代码继续执行")
  const value2 = 200
  yield value2

  console.log("代码执行结束~")
}
const generator = foo()
generator.next()
generator.throw("error message")     //第2段代码抛出异常,捕获异常才可以继续执行,没有捕获不可以执行后面代码

// 代码开始执行~
// 捕获到异常情况: error message
// 第二段代码继续执行

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值