Contextually type `this` inside `function*` from a leading thisArg

[bun-unsafe]

🔍 Search Terms

function* this implicit any
generator thisArg contextual this
noImplicitThis function*
Effect.gen this function*
this parameter generator callback
site:github.com/microsoft/TypeScript generator thisArg
related: #12548 (thisArg for Array#forEach callbacks)

✅ Viability Checklist

• This wouldn't be a breaking change in existing TypeScript/JavaScript code
• This wouldn't change the runtime behavior of existing JavaScript code
• This could be implemented without emitting different JS based on the types of the expressions
• This isn't a runtime feature (e.g. library functionality, non-ECMAScript syntax with JavaScript output, new syntax sugar for JS, etc.)
• This isn't a request to add a new utility type: https://github.com/microsoft/TypeScript/wiki/No-New-Utility-Types
• This feature would agree with the rest of our Design Goals: https://github.com/Microsoft/TypeScript/wiki/TypeScript-Design-Goals

⭐ Suggestion

Type this inside a function* expression from a leading thisArg (or from an explicit this parameter on the callback type), the same way Array#forEach already contextually types this from its thisArg.

Today a nested function* used as a callback gets this: any under noImplicitThis / strict, even when:

1. it is created inside a class method, and
2. the callee’s first argument is a thisArg whose type is the enclosing instance.

No new syntax. No emit change. Existing code that already writes function* (this: Foo) or fn(this, function* () { ... }) should just type-check.

This is the type-checker analogue of #12548, but for generator function expressions rather than Array callbacks.

📃 Motivating Example

You can write Effect-style / yield* programs inside a class method and this is just the instance — no function* (this: this) annotation, and no extra thisArg ceremony for the type checker.

class Form {
  model = { name: "" }

  run(gen: (this: this) => Generator<unknown, string>) {
    return gen.call(this)
  }

  submit() {
    return this.run(function* () {
      return this.model.name // today: TS2683, `this` is implicit any
    })
  }
}


If this shipped, the this inside that function* would be Form, because the callback type already says (this: this) => ....

1. What do you want to use this for?

Class-based controllers that build a generator program and yield* methods on this (Vue + Effect-style Effect.gen(this, function* () { ... })). This pattern appears in 50+ files in one app. The runtime already passes the instance as thisArg; only the types are missing.

2. What shortcomings exist with current approaches?

• A nested function* does not get contextual this from a this parameter on the callback type.
• Arrow functions have lexical this but cannot yield* (and new generator syntax would be a JS proposal, which this issue is not requesting).
• async/await only unwraps Promise and cannot carry a typed error channel, so generators are the do-notation that exists today.

3. What workarounds are you using in the meantime?

// Workaround A — repeat the class type on every generator
Effect.gen(this, function* (this: FormController) {
  yield* this.submitModel(decoded)
})

// Workaround B — pass thisArg at runtime and still annotate `this`
Effect.gen(this, function* () {
  yield* this.submitModel(decoded) // still TS2683 without an annotation
})

Both are noise. The runtime thisArg is already correct.

Observed on TypeScript 6.0.3 and 7.0.2 (same language surface; not a native-port regression).

[RyanCavanaugh]

I'm a little surprised this doesn't work already. If it's a ~one-line fix we should just do it; maybe there were unforeseen complications originally

[bun-unsafe]

Thanks — I don’t think this is a one-line fix, and I didn’t mean to imply that.

The surprising part is that contextual this already works for a plain function expression when the callee types the callback as (this: T) => .... It does not work for a function* with the same callback type:

class Form {
  model = { name: "" }

  runFn(fn: (this: this) => string) {
    return fn.call(this)
  }

  runGen(fn: (this: this) => Generator<unknown, string>) {
    return fn.call(this)
  }

  submit() {
    this.runFn(function () {
      return this.model.name // OK
    })

    this.runGen(function* () {
      return this.model.name // TS2683: `this` implicitly has type 'any'
    })
  }
}

Playground: TypeScript 6.0.3 and 7.0.2 behave the same.

So the request is narrower than “new generator this rules”: apply the existing contextual-this rule (the #12548 / thisArg one) to function* expressions as well.

Libraries such as Effect.gen(self, f) already declare f: (this: Self) => Generator<...>. Runtime this is correct. The annotation function* (this: Form) is only there because the generator form doesn’t pick up that contextual this.

I don’t have a patch. If the generator path simply never copies the contextual this type onto the expression, that would explain why it lingered. Happy to add more repros if useful.