发布于2026-07-06 阅读(0)
扫一扫,手机访问
先给你吃一颗定心丸——如果你熟悉 C#,转 TypeScript 的过程远比你想象中要平滑。很多核心概念基本就是照着搬过来的,甚至连语法结构都有惊人相似之处。让我们一项项拆开来看,心里先有个数。
| 特性 | 说明 |
|---|---|
| 静态类型 | TS 和 C# 都支持变量、参数、返回值的类型标注(如 string, number ≈ string, int)。 |
| 类与面向对象 | class、interface、extends(继承)、implements(实现接口)语法高度相似。 |
| 泛型 | 都用 |
| 访问修饰符 | public/private/protected 在 TS 中用于编译期检查(运行时无作用,但 IDE 支持好)。 |
| async/await | 异步编程模型几乎一样:C# 用 Task |
看完这张表,你是不是觉得心里踏实多了?没错,你在 C# 里积累的类型思维、面向对象设计理念,在这里基本都派得上用场。
| 方面 | C# | TypeScript |
|---|---|---|
| 运行环境 | 编译为 .NET IL,在 CLR 上运行 | 编译为 Ja vaScript,在浏览器或 Node.js 中运行 |
| 类型系统 | 强制、严格(编译失败即错误) | 可选 + 渐进式(可写纯 JS,但推荐全类型) |
| 基础类型 | int, bool, DateTime 等 | 基于 JS:number(无 int/float 区分)、boolean、string;无内置日期类型(用 Date 对象) |
| 空值处理 | null + 可空类型 int? | null 和 undefined 并存;开启 strictNullChecks 后类似 C# 可空引用 |
| 模块化 | namespace / 程序集 | ES 模块:import { x } from './file' / export(无 namespace) |
| 变量声明 | int x = 1; 或 var x = 1; | 必须用 let / const:const x: number = 1; |
| 函数定义 | int Add(int a, int b) => a + b; | const add = (a: number, b: number): number => a + b; |
差异主要集中在运行环境和基础 API 上,类型系统方面也只是严格程度的差别。当你习惯了 C# 的强制类型检查,TS 那种“可选+渐进”的方式可能会让你有点不踏实——但反过来看,这恰恰给了你更多的灵活性。
第一步:写法习惯调整
const/let 代替 varimport/export 组织代码() => {}第二步:善用 TS 的“超能力”
interface) 定义对象形状(比 C# 更灵活)string | number第三步:记住:TS ≠ 新语言,而是“带类型的 JS”
fetch 而不是 HttpClient)TypeScript = C# 的类型系统 + Ja vaScript 的灵活性 + 浏览器/Node.js 运行时。
你已具备 80% 的核心能力,只需适应 JS 生态和少量语法差异,就能高效开发!

光说理论不过瘾,咱们直接上代码——看看几个最常见的场景,两种语言到底怎么写。
// C# string name = "Alice"; int age = 30; var isActive = true; // 类型推断
// TypeScript const name: string = "Alice"; let age: number = 30; const isActive = true; // 类型自动推断为 boolean
✅ 建议:TS 中优先用
const(不可变)和let(可变),避免var。
// C#
public int Add(int a, int b)
{
return a + b;
}
// 或表达式体
public int Multiply(int a, int b) => a * b;
// TypeScript
function add(a: number, b: number): number {
return a + b;
}
// 或箭头函数(更常见)
const multiply = (a: number, b: number): number => a * b;
// 返回类型通常可省略(TS 能推断)
const subtract = (a: number, b: number) => a - b;
// C#
public class Animal
{
public string Name { get; set; }
public Animal(string name) => Name = name;
public virtual void Speak() => Console.WriteLine("...");
}
public class Dog : Animal
{
public Dog(string name) : base(name) { }
public override void Speak() => Console.WriteLine("Woof!");
}
// TypeScript
class Animal {
constructor(public name: string) {} // 自动创建并赋值 this.name
speak(): void {
console.log("...");
}
}
class Dog extends Animal {
speak(): void {
console.log("Woof!");
}
}
✅ TS 的 constructor(public name: string) 是语法糖,等价于 C# 的自动属性初始化。
// C#
public interface IPerson
{
string Name { get; set; }
int Age { get; }
void Greet();
}
// TypeScript
interface Person {
name: string;
readonly age: number; // 只读 ≈ C# 的 { get; }
greet(): void;
}
? TS 接口用于描述对象形状,不限于类实现,也可用于普通对象:
const person: Person = { name: "Bob", age: 25, greet() { console.log("Hi"); } };
// C# public class Box{ public T Value { get; set; } public Box(T value) => Value = value; } var numberBox = new Box (42);
// TypeScript class Box{ constructor(public value: T) {} } const numberBox = new Box (42); // 或让 TS 推断 const stringBox = new Box("hello");
// C# public async TaskFetchDataAsync() { using var client = new HttpClient(); return await client.GetStringAsync("https://api.example.com/data"); }
// TypeScript(浏览器或 Node.js 环境) async function fetchData(): Promise{ const response = await fetch("https://api.example.com/data"); return await response.text(); } // 或使用 axios(需安装) import axios from 'axios'; async function fetchData2(): Promise { const res = await axios.get ("https://api.example.com/data"); return res.data; }
✅ 概念一致:async/await + 容器类型(Task
↔ Promise )
// C#
string? maybeName = GetName(); // 可空引用类型(C# 8+)
if (maybeName != null)
Console.WriteLine(maybeName.Length);
// TypeScript(tsconfig.json 中开启 "strictNullChecks": true)
function getName(): string | null {
return Math.random() > 0.5 ? "Alice" : null;
}
const maybeName = getName();
if (maybeName !== null) {
console.log(maybeName.length); // 安全访问
}
? 强烈建议在 tsconfig.json 中启用 strict: true,获得接近 C# 的空安全体验。
| C# 概念 | TypeScript 对应 |
|---|---|
| class | class(几乎一样) |
| interface | interface(更灵活) |
| List | T[] 或 Array |
| Task | Promise |
| namespace | 不用 → 改用 import/export |
| HttpClient | fetch 或 axios |
你缺的只是 Ja vaScript 运行时 API 和 前端/Node.js 生态 的熟悉度,语言本身对你来说几乎没有学习曲线!
售后无忧
立即购买>office旗舰店
售后无忧
立即购买>office旗舰店
售后无忧
立即购买>office旗舰店
售后无忧
立即购买>office旗舰店
正版软件
正版软件
正版软件
正版软件
正版软件
1
2
3
7
8