- บทความ
- ตัวดำเนินการ
-
เครื่องมือ
ตัวปรับแต่ง
ทำโค้ดให้สวยงาม ทำ JavaScript ให้สวยงาม ทำ Python ให้สวยงาม ทำ JSON ให้สวยงาม ทำ HTML ให้สวยงาม ทำ SQL ให้สวยงาม จัดรูปแบบ Arrayตัวแปลง
แปลง HTML+ERB เป็น Haml แปลง HTML+ERB เป็น Slim แปลง HTML เป็น JSX แปลง HTML เป็น Pug แปลง CSS เป็น SCSS/Sass แปลง JSON เป็น YAML แปลง Python 2 เป็น 3
IDE Typescript น้ำหนักเบา - รันโค้ด Typescript ออนไลน์
เขียน รัน และดีบัก Typescript ใน IDE ออนไลน์น้ำหนักเบาที่รองรับหลายไฟล์ พื้นที่ทำงานถาวร ไลบรารีตามรันไทม์ การแชร์ และการทำงานร่วมกันแบบเรียลไทม์
🚀 183 การดำเนินการทั้งหมด (183 ในเดือนนี้)
📚 คอร์ส Typescript ที่ดีที่สุดที่คุณไม่ควรพลาด
กำลังโหลด...
💡 กำลังมองหาการพัฒนาทักษะของคุณหรือไม่? หลักสูตรเหล่านี้อาจช่วยได้ ลองดูในขณะที่โมเดล AI ของเราประมวลผลคำขอของคุณ
🌀 เกี่ยวกับตัวรัน TypeScript ออนไลน์นี้
CodeUtility TypeScript Executor ให้คุณเขียนและรันโค้ด TypeScript ได้โดยตรงบนเบราว์เซอร์ - ไม่ต้องตั้งค่า compiler ไม่ต้องติดตั้ง Node.js และไม่ต้องมีสภาพแวดล้อมในเครื่อง มันรันโค้ด TypeScript จริงที่คอมไพล์เป็น JavaScript ภายในรันไทม์ที่ปลอดภัยและแยกสภาพแวดล้อม (sandboxed)
สภาพแวดล้อมนี้รองรับ TypeScript 5.4 ช่วยให้คุณเข้าถึงฟีเจอร์ล่าสุดของภาษา เช่น decorators การอนุมานชนิดที่ดีขึ้น และการรองรับ ECMAScript สมัยใหม่
ไม่ว่าคุณจะกำลังเรียนรู้ TypeScript ทดสอบฟังก์ชันยูทิลิตี้ หรือทดลองกับ typing และ interfaces เครื่องมือนี้มอบวิธีการเขียน คอมไพล์ และรันโค้ดแบบรวดเร็ว โต้ตอบได้ พร้อมผลลัพธ์ทันที
เหมาะสำหรับนักพัฒนาที่อยากสำรวจระบบชนิดข้อมูลของ TypeScript หรือยืนยันว่า TypeScript คอมไพล์เป็น JavaScript อย่างไร โดยไม่ต้องสลับไปมาระหว่างตัวแก้ไขโค้ดหรือเทอร์มินัลในเครื่อง
มากกว่าเครื่องมือรันโค้ด
ใช้ตัวแก้ไขหลายไฟล์ เทอร์มินัลประมวลผลแบบแยกส่วน ไลบรารีเฉพาะรันไทม์ พื้นที่ทำงานถาวร การแชร์ และการทำงานร่วมกันแบบเรียลไทม์ได้จากตัวประมวลผลเดียวกัน
วิธีใช้ตัวประมวลผลนี้
เลือกรันไทม์ เปิดหรือสร้างไฟล์ เขียนโค้ด แล้วเลือกเรียกใช้ ผลลัพธ์จะแสดงในเทอร์มินัล ส่วนผู้ใช้ที่ลงชื่อเข้าใช้สามารถเก็บไฟล์ในพื้นที่ทำงาน ติดตั้งไลบรารี และทำงานร่วมกันผ่านการแชร์ได้
- เลือกเวอร์ชันแล้วแก้ไขไฟล์ปัจจุบัน หรือเปิดไฟล์อื่นในพื้นที่ทำงาน
- เรียกใช้โค้ด ป้อนข้อมูลในเทอร์มินัลเมื่อระบบร้องขอ และตรวจสอบประวัติการเรียกใช้ที่บันทึกไว้
- ใช้ไลบรารี เครื่องมือพื้นที่ทำงาน การแชร์ และแชท เมื่องานของคุณต้องใช้โค้ดมากกว่าหนึ่งส่วน
💡 คู่มือพื้นฐาน TypeScript สำหรับผู้เริ่มต้น
1. การประกาศตัวแปร
TypeScript รองรับ static typing ด้วย let, const และ type annotations
let x: number = 10;
const pi: number = 3.14;
let name: string = "Alice";
let isActive: boolean = true;
2. เงื่อนไข (if / switch)
ใช้ if, else if, และ else เพื่อแยกทางเลือกการทำงาน ส่วน switch เหมาะกับหลายค่า
let x = 5;
if (x > 0) {
console.log("บวก");
} else if (x < 0) {
console.log("ลบ");
} else {
console.log("ศูนย์");
}
switch (x) {
case 1:
console.log("หนึ่ง");
break;
case 2:
console.log("สอง");
break;
default:
console.log("อื่นๆ");
}
3. ลูป
ใช้ for, while, และ for...of สำหรับการวนซ้ำ
for (let i = 1; i <= 5; i++) {
console.log(i);
}
let i = 5;
while (i > 0) {
console.log(i);
i--;
}
4. อาเรย์
ใช้วงเล็บเหลี่ยม [] เพื่อกำหนดอาเรย์
let numbers: number[] = [1, 2, 3, 4, 5];
let names: string[] = ["Alice", "Bob"];
console.log(numbers[1]);
5. การจัดการอาเรย์
ใช้เมธอดที่มีมาให้ เช่น push, splice, และ filter
let arr = [10, 20, 30];
arr.push(40); // เพิ่มต่อท้าย
arr.splice(1, 1); // ลบสมาชิกตัวที่สอง
console.log(arr);
6. อินพุต/เอาต์พุตทางคอนโซล
ใช้ console.log เพื่อแสดงผลในคอนโซล
const name: string = "Alice";
console.log("สวัสดี, " + name);
7. ฟังก์ชัน
ประกาศฟังก์ชันพร้อมกำหนดชนิดของพารามิเตอร์และค่าที่ส่งกลับ
function add(a: number, b: number): number {
return a + b;
}
console.log(add(3, 5));
8. Map
ใช้วัตถุธรรมดาหรือ Map สำหรับโครงสร้างแบบคีย์-ค่า
const m = new Map<string, number>();
m.set("Alice", 25);
console.log(m.get("Alice"));
9. การจัดการข้อยกเว้น
ใช้ try และ catch เพื่อจัดการข้อผิดพลาด
try {
throw new Error("มีบางอย่างผิดพลาด");
} catch (e) {
console.error(e.message);
}
10. การอ่าน/เขียนไฟล์ (เฉพาะ Node.js)
ใช้โมดูล fs ของ Node.js เพื่ออ่านและเขียนไฟล์
import * as fs from "fs";
fs.writeFileSync("file.txt", "สวัสดีไฟล์");
const content = fs.readFileSync("file.txt", "utf-8");
console.log(content);
11. การจัดการสตริง
ใช้เมธอดของสตริง เช่น length, concat, includes
let str = "Hello World";
console.log(str.length);
console.log(str + "!");
console.log(str.includes("World"));
12. คลาสและอ็อบเจ็กต์
TypeScript รองรับการเขียนโปรแกรมเชิงวัตถุ (OOP)
class Person {
name: string;
constructor(name: string) {
this.name = name;
}
greet() {
console.log(`สวัสดี ฉันชื่อ ${this.name}`);
}
}
const p = new Person("Alice");
p.greet();