---
title: "JavaScript（From CSharp）"
author: "Perrin Yong"
author_profile: https://www.pystone.net/profile/
published_by: "Perrin Yong"
canonical: https://www.pystone.net/notes/javascript-for-csharp-developers/
type: note
content_role: unspecified
visibility: public
id_stability: rename-stable
source_path: "10-计算机、信息技术与工程/05-游戏图形与运行时/WebGL/JavaScript（From CSharp）.md"
content_hash: 698dda3338118f3769a89c13bc8ae8962f2b804acf583c8dc5fd3524a4d6d997
knowledge_version: 224c990773de.5fa8af6e39fa
site_commit: 224c990773de166d23a886306577dd90379529ce
notes_commit: 5fa8af6e39fa3891d1b9b4832bfa6c4e0ecaaf0a
---
# JavaScript（From CSharp）

﻿# JavaScript（From CSharp）


### 为什么选 **C#** 来对比

* 语法符号同属 C 家族：花括号作用域、`;` 语句结束、`++ --` 运算符等几乎一致。
* 都支持 **类→对象**、**接口**、**lambda 表达式**、**async / await**。
* C# 6 起引入的 **动态类型（`dynamic`）**、**匿名对象**、**LINQ** 风格，与 JavaScript 的动态、函数式特性可一一映射。
  （C++ / Java 在异步与动态方面更远，Python 则语法风格完全不同。）

---

## 1 变量与类型

| 主题    | C#                                      | JavaScript                        |
| ----- | --------------------------------------- | --------------------------------- |
| 声明    | `int x = 5;``var y = "hi";` (编译期推断) | `let x = 5;``const y = "hi";` |
| 动态    | `dynamic obj = 7; obj = "txt";`         | 所有变量天然动态                          |
| 作用域   | 块级 `{}`（自 C# 8 起）                       | `let / const` 块级，`var` 函数级        |
| 字符串插值 | `$"Name:{name}"`                        | `` `Name:${name}` ``              |

---

## 2 对象与原型 / 类

### C# class ↔ JS class（语法相似）

```csharp
class Player {
    public string Name { get; }
    public Player(string n) { Name = n; }
    public virtual void Say() => Console.WriteLine($"Hi I’m {Name}");
}
```

```js
class Player {
    constructor(name){ this.name = name; }
    say(){ console.log(`Hi I’m ${this.name}`); }
}
```

**差异**

* **继承**：`class Mage : Player` (C#) vs `class Mage extends Player` (JS)。
* **字段可见性**：C# 有 `public/private/protected/internal`；JS #私有字段仅 ES2022+。
* **原型链**：JS 每个对象指向其 **prototype**；C# 无此概念，运行期通过元数据 (reflection)。

### C# 动态对象 ↔ JS 字面量

```csharp
var o = new { x = 1, y = "hi" };  // 匿名类型，编译期只读
dynamic d = new ExpandoObject();
d.z = 10;                         // 运行期可增删
```

```js
const o = { x:1, y:"hi" };        // 可随时增删
o.z = 10;
```

---

## 3 函数、Lambda、闭包

| 概念         | C#                                                       | JavaScript                                   |
| ---------- | -------------------------------------------------------- | -------------------------------------------- |
| 普通函数       | `int Add(int a,int b){return a+b;}`                      | `function add(a,b){return a+b}`              |
| Lambda     | `(int a,int b)=>a+b`                                     | `(a,b)=>a+b`                                 |
| 闭包         | 捕获外部变量`Func<int> counter(){int c=0;return ()=>++c;}` | `function counter(){let c=0;return ()=>++c}` |
| 默认参数 / 可变参 | `void Foo(int a=1, params int[] r)`                      | `function foo(a=1,...r)`                     |

---

## 4 模块与命名空间

```csharp
// File: Game.Core.cs
namespace Game.Core { public class Util { } }
```

```js
// ES Module
// File: util.js
export function util(){}
```

* C# 编译期基于 **命名空间**；JS 运行期基于 **文件级模块**（`import / export`）。
* Node.js 早期用 `require()` CommonJS；现代浏览器/Node 支持 ES Module。

---

## 5 异步编程：async / await

```csharp
async Task<string> FetchAsync(string url){
    using var cli=new HttpClient();
    return await cli.GetStringAsync(url);
}
```

```js
async function fetchText(url){
    const res = await fetch(url);
    return await res.text();
}
```

共性

* 关键字、语义几乎一致：`await` 暂停直到 Promise / Task 完成。
* 错误以 **异常**（`catch` / `try { } catch { }`）处理。

---

## 6 集合操作：LINQ ↔ JS 数组高阶函数

| 操作 | C# LINQ                 | JavaScript                                   |
| -- | ----------------------- | -------------------------------------------- |
| 过滤 | `numbers.Where(n=>n>5)` | `numbers.filter(n=>n>5)`                     |
| 映射 | `.Select(n=>n*2)`       | `.map(n=>n*2)`                               |
| 聚合 | `.Sum()` `.Average()`   | `.reduce((s,n)=>s+n,0)`                      |
| 惰性 | `IEnumerable<>` 延迟执行    | 所有数组方法立即执行 (ES2024 `iterator.toArray()` 将类似) |

---

## 7 内存管理与垃圾回收

* **两者都有 GC**；C# 倾向代数分代 + 基于引用计数的 `IDisposable` 模式；JS Omni GC（浏览器 V8、SpiderMonkey）。
* C# 用 `using` / `await using` 调用 `Dispose`，JS 暂无语言级析构；需要手动取消事件监听或使用 `WeakRef`。

---

## 8 错误处理

```csharp
try {
    Do();
} catch(Exception ex) {
    Console.WriteLine(ex.Message);
} finally { }
```

```js
try {
    doSomething();
} catch(ex){
    console.log(ex.message);
} finally {}
```

* 异常对象相似：`ex.Message` vs `ex.message`，JS 还自带 `stack` 字符串。

---

## 9 运行时反射 / 元编程

| 场景     | C#                                 | JavaScript                                           |
| ------ | ---------------------------------- | ---------------------------------------------------- |
| 读取类型信息 | `typeof(Player)` / `obj.GetType()` | `typeof obj` 返回 `"object"`；原型：`obj.constructor.name` |
| 动态调用   | `MethodInfo.Invoke`                | `obj[methodName]()`                                  |
| 生成代码   | `Expression<T>` / Roslyn           | `eval()` / 动态 `Function()`                           |

JS 天然动态，反射成本更低但易失控；C# 需 `System.Reflection` 且编译期安全性更高。

---

## 10 严格模式与类型安全

* **C#**：编译期强类型，可用 `dynamic` 放宽，但失去 IntelliSense 与大部分静态检查。
* **JavaScript**：本体弱类型，可借 **TypeScript** 提供编译期类型系统；TypeScript 语法酷似 C#（接口、枚举、可空类型）。

---

### 小结 · 迁移学习技巧

1. **先抓相同符号**：花括号作用域、`;`、`for(;;)`、`if( )` 条件写法 100% 通用。
2. **把 C# Lambda→JS Arrow**：语法仅是去掉参数类型、换 `=>` 体为表达式或块。
3. **async/await 迁移**：连关键字与错误模型都一致；记得 JS 的 `fetch` 返回 Promise。
4. **面向对象差异**：别把 C# 的访问修饰符与接口多重继承惯性带入 JS；JS 支持混入、动态扩展原型，设计更灵活也更易出错。
5. **动态特性对照**：用 C# 的 `dynamic` + `ExpandoObject` 练习，可快速体会 JS 对象可随时增删属性的模式。

掌握以上“一一映射”后，你就能**借熟悉的 C# 思维快速摸通 JavaScript**，再深入异步事件循环、原型链与模块打包器（Webpack/Vite）时，会更游刃有余。
