TypeScript does not support direct operator overloading — only imitation of this behavior is possible at the function/class level, as JavaScript (and TypeScript's compilation to JS) does not provide the ability to change the behavior of standard operators (+, *, -, etc.) for user-defined types.
History of the issue: in languages like C++ or C#, it is possible to define custom behavior for operators when working with objects. In TypeScript (and JavaScript), there is no such functionality because the output is regular JS code, where operators are firmly tied to internal types.
Problem: when developing classes with abstract entities (e.g., vectors, matrices, amounts of money, etc.), it is often necessary to implement convenient work with them through operators. There is no syntax in TypeScript that allows this to be done natively.
Solution: to imitate operator overloading, methods with clear names (add, mul, sub) are created, sometimes static methods or utility functions are used. Additionally, explicit type conversion can be implemented via the valueOf method, but this is not sufficient for full overloading of all operators, and this solution works only for some operators for primitive values.
Code example:
class Vector2D { constructor(public x: number, public y: number) {} add(v: Vector2D): Vector2D { return new Vector2D(this.x + v.x, this.y + v.y); } } const v1 = new Vector2D(1, 2); const v2 = new Vector2D(3, 4); const result = v1.add(v2); // Vector2D { x: 4, y: 6 }
Key features:
add, sub) are usedvalueOf method works only for some operators, limitedlyIf you define valueOf/toString, will the + operator overloading work for classes?
No. valueOf affects only behavior when converting to a primitive type. For + operators (like string concatenation or numeric addition), this may yield unexpected results; other operators cannot be configured.
class Currency { constructor(private amount: number) {} valueOf() { return this.amount; } } const c1 = new Currency(10); const c2 = new Currency(5); console.log(c1 + c2); // 15, but this is not a Currency object!
Can you use Proxy for operator overloading in TypeScript?
No. Proxy allows intercepting access to properties and methods but not operator work (+, *, etc.), which only work with built-in types.
Can an operator be "overloaded" through declaration in an interface or type?
No. In interfaces, you can only describe methods and function signatures, you cannot describe operator overloads as, for example, in C# (operator+)
A developer added valueOf to the Currency class to get a numeric representation and perform mathematical operations directly (currency1 + currency2). As a result, the semantics were lost; the result of addition was a simple number, not a currency object, and it became impossible to track the type of the returned value.
Pros:
Cons:
In the Vector class, a method add returns a new Vector. It is clearly typed, and ambiguities are impossible.
Pros:
Cons: