在实际的前端开发过程中，我们可能会遇到需要使用 ES6 生成器的场景，同时还需要在生成器中使用默认参数。然而，在 ES6 中，我们发现无法直接在生成器中使用默认参数。那么，如何解决这个问题呢？
ES6 生成器与默认参数
ES6 引入了生成器函数，也称为 Generator 函数，可以用于通过迭代器来控制函数的执行。ES6 的默认参数功能也非常强大，方便我们定义函数的默认参数值。但是，当这两个功能结合在一起时，我们却发现默认参数并不能直接在生成器函数中正常工作。
例如，在下面的代码中，我们定义了一个生成器函数 foo，同时在其中使用了默认参数 x=0：
function* foo(x=0) {
yield x;
}然而，当我们尝试调用这个生成器函数时，使用默认参数并不会起作用：
const generator = foo(); const result = generator.next(); console.log(result.value); // 输出 undefined
我们可以看到，虽然我们在函数定义时使用了默认参数 x=0，但是在调用生成器函数时，x 的默认值并未被应用，返回的值为 undefined。
解决方案1：使用 yield*
要解决这个问题，我们可以使用 yield* 语法来代替默认参数。
在使用 yield* 时，我们需要将默认的值传递给另一个生成器函数，这个生成器函数会控制 foo 的执行流程，同时可以在该函数中使用默认参数。例如，我们可以将默认值 x=0 传递给一个内部的生成器函数 bar：
function* bar(x=0) {
yield x;
}
function* foo() {
const result = yield* bar();
yield result;
}现在，我们再次调用生成器函数 foo，可以发现默认参数功能已经正常工作了：
const generator = foo(); const result = generator.next(); console.log(result.value); // 输出 0
解决方案2：使用条件判断
除了使用 yield*，我们还可以在生成器函数中手动添加条件以实现默认参数的功能。
在这种方法中，我们需要先检查参数是否为 undefined，如果是，则使用默认参数。例如：
function* foo(x) {
const result = x === undefined ? 0 : x;
yield result;
}此时，调用生成器函数 foo 时，我们可以传递 undefined 或其他值，生成器将会按照对应的逻辑执行：
-- -------------------- ---- ------- ----- ---------- - ------ -- --------- - ----- ------- - ------------------ --------------------------- -- -- - ----- ---------- - --------------- -- -- -------------- - ----- ------- - ------------------ --------------------------- -- -- - ----- ---------- - -------- -- ----- ----- ------- - ------------------ --------------------------- -- -- --
总结
今天，我们解决了在 ES6 中生成器无法使用默认参数的问题。我们介绍了两种解决方案：使用 yield* 或使用条件判断。在实际的开发过程中，我们可以根据具体的业务场景，选择更加适合自己的方法来解决这个问题。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6502b8e495b1f8cacdff206c