TypeScript supports the typeof operator not only at runtime (like in JavaScript) but also at compile time for type inference of an expression. This allows you to obtain the type of an already declared variable, function, or object structure, making typing flexible and reducing the likelihood of duplication and desynchronization of types.
Initially, in JavaScript, the typeof operator was used to determine the type of a value at runtime. TypeScript has expanded this mechanism — now typeof at compile time creates a reference to the type of the value of a variable or the result of a function. This is extremely useful when working with complex structures, configs, and also when reusing types between modules.
When manually declaring types, it is easy to make mistakes: changing a structure definition and forgetting to update the type- or interface-declaration, or incorrectly copying types between objects. This leads to desynchronization of code and runtime errors. By using typeof, the type is inferred dynamically and always matches the current data structure.
To declare a variable with a type corresponding to an already existing structure or constant, you use the typeof operator:
const config = { host: "localhost", port: 8080, }; let serverCfg: typeof config; // Type serverCfg is the same as that of config
For typing a function that returns a specific structure:
function makeUser() { return { id: 1, name: "Alex" }; } type User = ReturnType<typeof makeUser>; // User: {id: number; name: string;}
Key features:
typeof in TS returns the type of the variable's value or the result of an expression at compile time.ReturnType, Parameters), as well as keyof to obtain a list of keys of an object.Does the typeof operator execute in TypeScript at runtime?
No, the type typeof works only at compilation and does not appear in the runtime code, although the JavaScript operator typeof exists at runtime.
Can typeof be used to infer the type of class properties?
Yes, but only if the property is already declared as static or with an initial value, otherwise there will be an error. For private/public protected, only public properties/methods are considered.
Is there a difference between 'let x: typeof y;' and 'let x = y;'?
From a typing perspective — in both cases, the compiler will infer the type automatically. However, 'typeof' can be used for writing type declarations without initialization or for more complex combinations with utility types.
typeof for the usual js type check typeof x === 'string' — this is runtime, not a compile-time type.In the project, a large application settings object is described separately as a type and separately as a variable. When changing the structure, the type is forgotten to be updated, leading to API operation errors.
Pros: Flexible work with types, you can redefine types through type or interface.
Cons: High risk of desynchronization of structure and types, poor maintainability.
Using typeof to obtain the current type of an object structure when declaring new variables and generating a type for the API interface.
Pros: Type always matches the value, low error probability, good auto-completion.
Cons: If the object is very complex, the resulting type may be confusing to read for beginners.