القائمة
Use when callbacks use this. Use when API provides this context. Use when typing event handlers. Use when library sets this in callbacks. Use when documenting callback context.
التثبيت باستخدام Codex أو Claude انسخ هذا Prompt والصقه في Codex أو Claude أو مساعد آخر ليراجع صفحة Skill ويثبّتها لك.
استنادا إلى تصنيف SOC المهني
Use when defining global types. Use when augmenting window. Use when typing environment variables. Use when working with build-time constants. Use when configuring type definitions.
Use when migrating JavaScript to TypeScript. Use when gradually adopting TypeScript. Use when working with mixed codebases. Use when converting large projects. Use when teams are learning TypeScript.
Use when writing asynchronous code. Use when tempted to use callbacks. Use when composing multiple async operations.
Use when creating types from example data. Use when types don't match all cases. Use when API responses vary.
Use when writing type annotations on variables. Use when TypeScript can infer the type. Use when code feels cluttered with types.
Use when defining array-like types. Use when tempted to use number as index type. Use when understanding array keys.
| name | callback-this-type |
| description | Use when callbacks use this. Use when API provides this context. Use when typing event handlers. Use when library sets this in callbacks. Use when documenting callback context. |
When a library calls a user-provided callback with a specific this context, that context is part of the API. TypeScript allows you to type this as the first parameter of a function, even though it's not a real parameter. This documents and enforces the expected context.
thisthis contextthis in callbacksType this as the first parameter when it's part of your callback API. This documents the expected context and enables autocompletion.
// BAD: this is untyped
interface EventEmitter {
on(event: string, handler: (data: any) => void): void;
}
// User doesn't know what 'this' is:
emitter.on('click', function(data) {
this.something; // What properties does this have?
});
// GOOD: this is typed
interface EventEmitter {
on(
event: string,
handler: (this: EventContext, data: any) => void
): void;
}
interface EventContext {
target: Element;
timestamp: number;
preventDefault(): void;
}
// User now gets autocompletion for 'this'
emitter.on('click', function(data) {
this.target; // Autocomplete works!
this.timestamp; // Typed as number
});