Chạy TypeScript CLI Online

Test code TypeScript nhanh gọn với CLI online, chạy ngay trong trình duyệt, không cần cài đặt—hoàn hảo cho việc học và debug.

🚀 tổng số lượt thực thi ( trong tháng này)

Udemy Logo 🎯 Gợi ý khóa học Typescript phù hợp với bạn

Loading...

🌀 Giới thiệu về Trình thực thi TypeScript trực tuyến này

CodeUtility TypeScript Executor cho phép bạn viết và chạy mã TypeScript trực tiếp trên trình duyệt - không cần thiết lập compiler, cài đặt Node.js hay môi trường cục bộ. Công cụ chạy mã TypeScript thật, được biên dịch sang JavaScript trong một môi trường an toàn, sandboxed.

Môi trường này hiện hỗ trợ TypeScript 5.4, giúp bạn truy cập các tính năng ngôn ngữ mới nhất như decorators, suy luận kiểu tốt hơn và hỗ trợ ECMAScript hiện đại.

Dù bạn đang học TypeScript, thử nghiệm các hàm tiện ích, hay mày mò với typing và interface, công cụ này mang đến cách nhanh và tương tác để viết, biên dịch và thực thi mã với phản hồi tức thì.

Rất phù hợp cho nhà phát triển muốn khám phá hệ thống kiểu của TypeScript hoặc kiểm chứng cách TypeScript biên dịch sang JavaScript mà không cần chuyển qua lại giữa trình soạn thảo hay terminal cục bộ.

💡 Cách sử dụng công cụ này

  • 1. Chọn phiên bản TypeScript hiện có (5.4) từ menu thả xuống ở phía trên trình soạn thảo.
  • 2. Viết hoặc dán mã TypeScript của bạn vào khu vực soạn thảo - bao gồm kiểu, interface và generic.
  • 3. Nhấp Chạy để biên dịch và thực thi mã, xem kết quả ở console bên dưới.
  • 4. Khi đang chạy, sẽ xuất hiện nút Dừng - nhấp để kết thúc sớm tiến trình.
  • 5. Dùng Sửa mã để tự động sửa lỗi cú pháp hoặc thụt dòng.
  • 6. Sau khi sửa, sẽ có nút Bản sửa - nhấp để xem các chỉnh sửa gần đây.
  • 7. Bạn cũng có thể Tải lên tệp cục bộ vào trình soạn thảo hoặc Tải xuống mã hiện tại.
  • 8. Mỗi lần chạy tối đa 20 giây trước khi tự dừng để đảm bảo ổn định và công bằng.

🧠 Mẹo: Trình thực thi TypeScript sẽ tự động biên dịch mã của bạn sang JavaScript ở phía sau - nhờ đó bạn có thể kiểm thử hành vi thực thi thật, đồng thời hưởng lợi từ kiểu tĩnh và an toàn lúc biên dịch.

💡 Hướng dẫn cơ bản TypeScript cho người mới bắt đầu

1. Khai báo biến

TypeScript cho phép kiểu tĩnh với let, const và chú thích kiểu.

let x: number = 10;
const pi: number = 3.14;
let name: string = "Alice";
let isActive: boolean = true;

2. Cấu trúc điều kiện (if / switch)

Dùng if, else if, và else để rẽ nhánh. switch xử lý nhiều giá trị.

let x = 5;
if (x > 0) {
  console.log("Số dương");
} else if (x < 0) {
  console.log("Số âm");
} else {
  console.log("Bằng 0");
}

switch (x) {
  case 1:
    console.log("Một");
    break;
  case 2:
    console.log("Hai");
    break;
  default:
    console.log("Khác");
}

3. Vòng lặp

Dùng for, while, và for...of để lặp.

for (let i = 1; i <= 5; i++) {
  console.log(i);
}

let i = 5;
while (i > 0) {
  console.log(i);
  i--;
}

4. Mảng

Dùng ngoặc vuông [] để khai báo mảng.

let numbers: number[] = [1, 2, 3, 4, 5];
let names: string[] = ["Alice", "Bob"];
console.log(numbers[1]);

5. Xử lý mảng

Dùng các phương thức dựng sẵn như push, splice, và filter.

let arr = [10, 20, 30];
arr.push(40);          // Thêm vào cuối
arr.splice(1, 1);      // Xóa phần tử thứ hai
console.log(arr);

6. Nhập/Xuất Console

Dùng console.log để hiển thị kết quả trong console.

const name: string = "Alice";
console.log("Xin chào, " + name);

7. Hàm

Khai báo hàm với tham số có kiểu và kiểu trả về.

function add(a: number, b: number): number {
  return a + b;
}

console.log(add(3, 5));

8. Map

Dùng đối tượng thuần hoặc Map cho cấu trúc khóa-giá trị.

const m = new Map<string, number>();
m.set("Alice", 25);
console.log(m.get("Alice"));

9. Xử lý ngoại lệ

Dùng trycatch để xử lý lỗi.

try {
  throw new Error("Đã có lỗi xảy ra");
} catch (e) {
  console.error(e.message);
}

10. I/O tệp (chỉ Node.js)

Dùng module fs của Node.js để đọc và ghi tệp.

import * as fs from "fs";

fs.writeFileSync("file.txt", "Xin chào tệp");
const content = fs.readFileSync("file.txt", "utf-8");
console.log(content);

11. Xử lý chuỗi

Dùng các phương thức chuỗi như length, concat, includes.

let str = "Hello World";
console.log(str.length);
console.log(str + "!");
console.log(str.includes("World"));

12. Lớp & Đối tượng

TypeScript hỗ trợ lập trình hướng đối tượng.

class Person {
  name: string;
  constructor(name: string) {
    this.name = name;
  }
  greet() {
    console.log(`Xin chào, tôi là ${this.name}`);
  }
}

const p = new Person("Alice");
p.greet();