The Evolution of JavaScript and Need for TypeScript

The Need for TypeScript

JavaScript is dynamically typed, which means that a variable has no fixed type and that types are examined only while the program runs. Consider a small function from an online store:

function calculateTotal(price, shipping) {
  return price + shipping;
}

console.log(calculateTotal(20, 5));
console.log(calculateTotal("20", 5));

25
205

The second call passes the price as a string, perhaps because the value came from a form field. JavaScript reports nothing. The + operator joins the two values into the string "205", and the wrong total continues through the program until someone notices it.

This kind of bug became more expensive as JavaScript applications grew in complexity. The cost appeared in four areas:

• Finding bugs. A type mistake appears only when that line runs, and it may appear far from its cause.
• Working in large teams. Nothing in the code above tells another developer that price must be a number, and JavaScript has no built-in type check to enforce it.
• Changing code. When you change a function, nothing lists the places that call it, so debugging and refactoring become difficult. Refactoring means changing the structure of code without changing its behavior.
• Editor support. Without declared types, editors have less information for code completion, refactoring suggestions, and real-time error detection.

Frameworks such as AngularJS and React made web development easier to organize, but they did not address this problem. A large application built with them was still dynamically typed, and it was still hard to maintain.

Emergence of TypeScript

Microsoft released the first public version of TypeScript in October 2012 to address these limits, especially in larger and more complex applications. Its design has one central idea: all JavaScript syntax stays legal, and the language adds optional type annotations. A language that contains all of another language in this way is called a superset, and a language whose types are checked before the program runs is called statically typed. TypeScript is therefore a statically typed superset of JavaScript.

Here is the same function with annotations, which are the : number parts:

function calculateTotal(price: number, shipping: number): number {
  return price + shipping;
}

console.log(calculateTotal("20", 5));

order.ts(5,28): error TS2345: Argument of type 'string' is not assignable to parameter of type 'number'.

The compiler now reports the mistake before anyone runs the program. Because annotations are optional and existing JavaScript syntax stays legal, a team can adopt TypeScript while it keeps its existing code and its JavaScript flexibility.

TypeScript also added features for structuring large programs, such as interfaces and access modifiers, along with strong editor tooling. It gained popularity quickly, particularly for large enterprise applications and for modern web applications built with frameworks such as Angular and React.