TypeScript Essentials for FAANG Interviews
Introduction to TypeScript
What is TypeScript?
Think of TypeScript as JavaScript with superpowers. At its core, it's a superset of JavaScript, which means any valid JavaScript code is also valid TypeScript code. The key difference is that TypeScript adds static typing.
What does that mean? In plain JavaScript, you can create a variable and give it a number, then later assign a string to it without any issue until you try to run the code. TypeScript catches these kinds of errors before you run the code, acting like a grammar checker for your programming logic.
Developed by Microsoft, TypeScript is designed to build large-scale applications. When you're done writing your TypeScript code, it gets 'transpiled'—a fancy word for converted—into plain JavaScript that can run in any browser.
TypeScript is a superset of JavaScript that adds static typing, classes, interfaces, and other features to the language.
Why Bother with Types?
Adding types might seem like extra work at first, but it pays off significantly. The main benefits are catching errors early, making code easier to read and maintain, and enabling powerful developer tools.
Catching errors before you run your code is a game-changer. It means fewer bugs make it into production.
For example, consider this simple JavaScript function:
function add(a, b) {
return a + b;
}
// This will work as expected, resulting in 7.
console.log(add(3, 4));
// This will NOT work as expected. It returns '34' instead of 7.
console.log(add(3, '4'));
In JavaScript, the second call to add() might cause a subtle bug that's hard to find. TypeScript stops this from happening by letting you define what kind of data your function accepts.
function add(a: number, b: number) {
return a + b;
}
add(3, 4); // Works!
// This line will now show an error right in your editor!
// Error: Argument of type 'string' is not assignable to parameter of type 'number'.
add(3, '4');
This immediate feedback is incredibly valuable. It also makes your code self-documenting. Anyone reading function add(a: number, b: number) knows exactly what kind of arguments the function expects.
This leads to another huge benefit: better tooling. Because TypeScript understands your code's structure and types, your code editor can provide more intelligent autocompletion, refactoring, and error checking, making development faster and more efficient.
Setting Up Your Environment
Getting started with TypeScript is straightforward. You'll need Node.js and npm (which comes with Node.js) installed on your machine. Once you have them, you can install TypeScript globally using a single command in your terminal:
npm install -g typescript
This command installs the TypeScript compiler, tsc. Let's create a simple file named greeter.ts:
// greeter.ts
function greet(person: string) {
return "Hello, " + person;
}
let user = "Jane Doe";
console.log(greet(user));
Now, compile it by running tsc greeter.ts in your terminal. This will create a new file, greeter.js, containing plain JavaScript that any browser can understand:
// greeter.js
function greet(person) {
return "Hello, " + person;
}
var user = "Jane Doe";
console.log(greet(user));
Notice how the type annotations are gone? The compiler checks for errors and then strips the types away, leaving you with clean, runnable JavaScript. For larger projects, you can use a tsconfig.json file to configure compiler options, but for now, you know enough to get started!
What is the primary feature that TypeScript adds to JavaScript?
The process of converting TypeScript code into plain JavaScript is called...