Introduction to TypeScript
Introduction
Introduction
In this lesson, you'll learn about introduction to typescript in TypeScript. Coming from Java, you already have a foundation for understanding this concept. We'll build on that knowledge while highlighting the key differences.
In Java, you're familiar with introduction.
TypeScript has its own approach to introduction, which we'll explore step by step.
The TypeScript Way
Let's see how TypeScript handles this concept. Here's a typical example:
// TypeScript - compiles to JavaScript
const greeting: string = "Hello, World!";
console.log(greeting);
// Top-level code - no class required!
function greet(name: string): void {
console.log(`Hello, ${name}!`);
}
greet("World");
// Compile: tsc main.ts
// Run: node main.jsComparing to Java
Here's how you might have written similar code in Java:
// Java - runs on the JVM
public class Main {
public static void main(String[] args) {
System.out.println("Hello, World!");
}
}
// Compile: javac Main.java
// Run: java MainYou may be used to different syntax or behavior.
Java runs on the JVM; TypeScript compiles to JavaScript and runs in the browser or Node.js
You may be used to different syntax or behavior.
Java requires every statement inside a class; TypeScript allows top-level functions and variables
You may be used to different syntax or behavior.
Both are statically typed, but TypeScript types are erased at compile time
You may be used to different syntax or behavior.
Java source files are .java; TypeScript source files are .ts
You may be used to different syntax or behavior.
TypeScript needs tsc to compile, then node (or a browser) to run
Step-by-Step Breakdown
1. No Mandatory Class Wrapper
In Java every line of code lives inside a class. TypeScript (like JavaScript) lets you write functions and variables at the top level of a file.
public class Main {
public static void main(String[] args) {
System.out.println("Hello!");
}
}// TypeScript - just write it at the top level
console.log("Hello!");2. Compilation Pipeline
Java compiles to bytecode for the JVM. TypeScript compiles to plain JavaScript, which is then executed by a JS engine.
// tsconfig.json controls compilation
{
"compilerOptions": {
"target": "ES2020",
"strict": true,
"outDir": "./dist"
}
}
// tsc --init → generate tsconfig
// tsc → compile all .ts files
// node dist/main.js → run output3. console.log vs System.out.println
The standard output call is console.log() in TypeScript/JavaScript. It accepts multiple arguments and uses commas rather than concatenation.
System.out.println("Value: " + x);// TypeScript
console.log("Value:", x);
console.log(`Value: ${x}`); // template literal4. Type Annotations
TypeScript adds optional type annotations to JavaScript. The syntax feels different from Java but serves the same purpose.
String name = "Alice";
int age = 30;
void greet(String n) { }let name: string = "Alice";
let age: number = 30;
function greet(n: string): void { }
// TypeScript can also infer types:
let name2 = "Alice"; // inferred as stringCommon Mistakes
When coming from Java, developers often make these mistakes:
- Java runs on the JVM; TypeScript compiles to JavaScript and runs in the browser or Node.js
- Java requires every statement inside a class; TypeScript allows top-level functions and variables
- Both are statically typed, but TypeScript types are erased at compile time
Key Takeaways
- TypeScript files are .ts and compile to .js via tsc
- No class wrapper required — top-level code is valid
- console.log() replaces System.out.println()
- Type annotations use a colon syntax: variable: type