TypeScript? JavaScript? ??? ?? ?? ???? ???? JavaScript? ?? ?????. JavaScript ????? ?? TypeScript? ?? ?? ????? ????. ??? ??? ?????? ? ??? ??? ??? ???? ?????? ?? ????? ???? ??? ??????

? ????? TypeScript? ??? ??? ???? TypeScript? ??? ??? ?? JavaScript ????? ???? ??? ??? ???? ? ??? ???.

??????? ??????

TypeScript? ??? ??? ?? JavaScript???. TypeScript? ??? ???? ??? ?? ?? ???? ??? ???? ? ??? ?? ?? ??? ???? ???? JavaScript? ??????.

??? ???? ???. TypeScript? ??? JavaScript???! ??? JavaScript ??? ?? ??? TypeScript ????? ???. TypeScript? ?? ?? ??? ????, ??? ?? ???? ???, ??? ??? ? ?? ?? ??? ?????.

TypeScript? ???? ??? ??????

"TypeScript? ??? ?? JavaScript?? ? JavaScript? ???? ??????"?? ?? ? ????. ??? ?? ? ??? ??? ????.

1. ?? ???? ?? ??

   TypeScript? ??? ?? ???? ??? ??? ???? ? ??? ???. JavaScript??? ??? ?? ??? ??(?: ??? ?? ??? ??? ?? ??)?? ?? ??? ?? ?????. TypeScript? ??? ????? ?? ??? ??? ??? ?????.

2. ? ?? ?? ? ?? ??

   TypeScript? ? ?? ?? ??, ? ??? ?? ??, ? ?? ????? ?????. IDE? ?? ??? ??? ?? ? ???? ??? ?? ???? ??? ? ????.

3. ??? ????? ?? ?? ??

   JavaScript ????? ???? ?? ?? ???? ???? ??? ?? ???? ???? ?? ?? ? ????? ????. TypeScript? ???? ??? ? ? ??? ? ?? ????? ?? ??? ? ?????.

4. JavaScript ???? ??? ????

   TypeScript? JavaScript ???? ?? ?? ? ??? ???????. ??? ??? ??? ?? ??? ????. ??? ?? ??? ????? ?? ???. ?? JavaScript ????? ??? TypeScript? ????? ??? ? ????.

JavaScript ???? ?? ?? TypeScript ??

JavaScript? ????? TypeScript? ?? ???? ?????? ? ?? ??? ???? ????. ? ?? ?? TypeScript ??? ???????.

1. ??: TypeScript? ??

JavaScript? TypeScript? ?? ? ??? ? ??? ?? ??????. JavaScript?? ??? ?????. ?, ??? ???? ??? ??? ? ????.

let message = "Hello, world!";
message = 42;  // 沒有錯誤，即使類型已更改

TypeScript??? ?? ??? ????? ??? ? ??? ????? ??? ??? ?? ?? ??? ????? ?????.

let message: string = "Hello, world!";
message = 42;  // 錯誤：類型“number”無法分配給類型“string”

TypeScript? ? ?? ???? ??? ??? ????.

• string – ??? ????.
• number – ???(?? ? ?? ??? ??).
• boolean – ? ?? ?? ?.
• object – ??, ?? ? ??? ??? ??? ??.
• any – ?? ??? ???? ?? ??? ????? ???????(???? ??).

2. ?????: ??? ??? ?????.

TypeScript? ?????? ???? ??? ??? ?????. ?? ?? ?? ? ??? ???? ??? ???? ?? ??? ??? ? ????.

interface Person {
  name: string;
  age: number;
}

const person: Person = {
  name: "Alice",
  age: 25
};

?????? ?? ??? ??? ??(???)? ??(??)? ??? ???? ? ??? ?? ??? ???? ??? ??? ?????.

3. ??? ??

TypeScript??? ?? ???? ? ?? ?? ??? ???? ??? ? ?? ???? ???? ? ????.

function greet(name: string): string {
  return `Hello, ${name}!`;
}

greet("Alice");  // 正確
greet(42);  // 錯誤：類型“number”的參數(shù)無法分配給類型“string”的參數(shù)

??? ????, ???, ??? ????? ???? ?? ??? ??? ?? ????.

function sum(a: number, b: number = 0): number {
  return a + b;
}

console.log(sum(5)); // 5
console.log(sum(5, 3)); // 8

4. Union ??: ?? ?? ??

JavaScript?? ??? ?? ??? ?? ???? ??? ? ??? TypeScript??? Union ??? ???? ??? ???? ?? ????? ??? ? ????.

?? ?? ????? ??? ??? ? ?? ??? ??? ? ????.

let value: string | number;

value = "Hello";
value = 42;

Union ??? ????? null? ??? ? ?? ??? ?? ?? ??? ?? ? ?? ?? ?? ? ?????.

5. ???? ??

TypeScript? JavaScript(ES6)? ????? ??? ? ??? ?? ?? ?? ?????(OOP) ??? ????? ?? ?? ???? ?????.

class Animal {
  constructor(public name: string) {}

  speak(): void {
    console.log(`${this.name} makes a sound.`);
  }
}

class Dog extends Animal {
  speak(): void {
    console.log(`${this.name} barks.`);
  }
}

const dog = new Dog("Buddy");
dog.speak();  // 輸出：Buddy barks.

TypeScript??? ???? ??? ???? ?? ??? ???? ??? ?? ?? ???? ??? ???? ????? ?? ??? ???? ? ? ????.

6. ??: ???? ??? ??? ?? ??

???? ???? ?? ???? ?????? ?? ???? ???? ??, ??? ? ?????? ?? ? ????. ? ??? ?? ??? ??? ???? ?? ?? ??? ???? ??? ??? ??? ? ????.

function identity<T>(arg: T): T {
  return arg;
}

console.log(identity("Hello"));  // 類型為string
console.log(identity(42));  // 類型為number

???? ?? ??? ???? ?? ?????? ????? ?? ??? ??? ?? ??? ??? ??? ? ?? ?????.

TypeScript ????

?? ?? ??? ?????? ?? JavaScript ?????? TypeScript? ??? ??????

1. TypeScript ?? npm? ?? TypeScript? ??? ? ????.

npm install -g typescript

2. TypeScript ?? ?? ??? TypeScript? ?? ??(tsconfig.json)? ???? ???? ??? ???? ??? ?????.

?? ??? ???? ? ??? ??? ? ????.

let message = "Hello, world!";
message = 42;  // 沒有錯誤，即使類型已更改

3. .ts ?? ?? TypeScript ??? ????? .ts ???? ?? ??? ?????. TypeScript ????(tsc)? .ts ??? ?? JavaScript ??? ???? ? ????.

let message: string = "Hello, world!";
message = 42;  // 錯誤：類型“number”無法分配給類型“string”

4. ?? ??? ? ?? TypeScript ??? ??? ? ??? ???? JavaScript? ???? ? ????.

interface Person {
  name: string;
  age: number;
}

const person: Person = {
  name: "Alice",
  age: 25
};

??? ?? ????? Node.js?? ??? ? ?? JavaScript ??? ?????.

??

TypeScript? JavaScript ??? ?? ????? ???? ?? ???? ??? ??? ?????. JavaScript? ?? ??? ?? ??? ???? ?? ??? ? ?? ??? ???? ??? ??? ??? ??? ???? ? ??? ???.

?? JavaScript? ????? TypeScript? ??? ?? ?? ?? ???? ????? ??? ? ????. ?? ???, ? ?? ???, ? ?? ???? ?? ???? ???? ???? ?? ??? ????? ??? ???? ??? ??? ??? ???.

TypeScript? ??? ?????? ?????! ?

? ??? JavaScript ???? ?? TypeScript ??? ?? ?????. ??? ??? PHP ??? ????? ?? ?? ??? ?????!