文章目錄
- 一、一句話總結
- 二、詳細對比
- 三、關鍵區別詳解
- 1. **運行環境不同**
- 2. **沒有 DOM / BOM**
- 3. **擁有系統級 API**
- 4. **模塊系統差異**
- 四、它們的關係圖
- 五、舉個實際例子
- 前端（瀏覽器中的 JavaScript）
- 後端（Node.js 中的 JavaScript）
- 常見誤區澄清
- 總結
一、一句話總結
JavaScript 是一門編程語言，Node.js 是一個能讓 JavaScript 在服務器端運行的運行時環境（Runtime）。
- 瀏覽器中的 JavaScript → 用於操作網頁（DOM、動畫、交互）
- Node.js 中的 JavaScript → 用於開發後端服務（API、數據庫、文件系統等）
二、詳細對比
|
維度
|
JavaScript
|
Node.js
|
|
本質 |
編程語言（ECMAScript 標準） |
JavaScript 的運行時環境（基於 V8 引擎） |
|
運行位置 |
瀏覽器（Chrome、Firefox 等）
|
服務器 / 本地計算機（脱離瀏覽器）
|
|
核心能力 |
操作 DOM、處理用户事件、AJAX 請求
|
讀寫文件、訪問數據庫、啓動 HTTP 服務器、操作系統資源
|
|
全局對象 |
|
|
|
模塊系統 |
ES Modules ( |
CommonJS ( |
|
I/O 模型 |
異步（但受限於瀏覽器 API）
|
事件驅動 + 非阻塞 I/O（核心優勢） |
|
典型用途 |
網頁交互、前端框架（Vue/React）
|
後端 API、微服務、腳本工具、實時應用
|
三、關鍵區別詳解
1. 運行環境不同
- JavaScript 最初設計用於瀏覽器，只能操作網頁元素。
// 瀏覽器中有效
document.getElementById('btn').click();
alert('Hello');- Node.js 讓 JS 脱離瀏覽器，可以：
// Node.js 中有效（瀏覽器中會報錯！）
const fs = require('fs');
fs.readFileSync('data.txt');2. 沒有 DOM / BOM
- Node.js 沒有
window、document、localStorage等瀏覽器對象。 - 你不能在 Node.js 中寫：
// 在 Node.js 中會報錯：document is not defined
document.querySelector('h1');3. 擁有系統級 API
Node.js 提供了瀏覽器沒有的能力：
// 讀寫文件
const fs = require('fs');
fs.writeFileSync('log.txt', 'Hello Server');
// 啓動 HTTP 服務器
const http = require('http');
http.createServer((req, res) => {
res.end('Hello from Node.js!');
}).listen(3000);4. 模塊系統差異
- 瀏覽器：原生支持 ES Modules（
import/export）
<script type="module">
import { foo } from './utils.js';
</script>- Node.js（傳統）：使用 CommonJS
// 導入
const express = require('express');
// 導出
module.exports = { hello: 'world' };- 現代 Node.js（v14+）：也支持 ES Modules（需
.mjs後綴或package.json中設"type": "module"）
四、它們的關係圖
┌───────────────────┐
│ JavaScript │ ← 編程語言（ECMAScript）
└─────────┬─────────┘
│
┌─────────────────┼─────────────────┐
▼ ▼ ▼
┌─────────────┐ ┌──────────────┐ ┌──────────────┐
│ 瀏覽器 │ │ Node.js │ │ Deno / Bun │
│ (Chrome等) │ │ (服務器環境) │ │ (新運行時) │
└─────────────┘ └──────────────┘ └──────────────┘所以：Node.js 是 JavaScript 的“宿主環境”之一，就像瀏覽器一樣。
五、舉個實際例子
假設你要開發一個“用户註冊”功能：
前端（瀏覽器中的 JavaScript）
// 發送註冊請求
fetch('/api/register', {
method: 'POST',
body: JSON.stringify({ email: 'user@example.com' })
});後端（Node.js 中的 JavaScript）
// 接收請求，保存到數據庫
const express = require('express');
const app = express();
app.post('/api/register', (req, res) => {
// 1. 驗證數據
// 2. 連接數據庫
// 3. 保存用户
// 4. 返回結果
res.json({ success: true });
});💡 前後端都用 JavaScript，但運行環境和能力完全不同！
常見誤區澄清
|
誤區
|
正確理解
|
|
“Node.js 是一種新語言”
|
Node.js 不是語言，是運行時
|
|
“學了前端 JS 就會 Node.js”
|
語法相同，但 API 和思維模式不同（需學 Node 特有模塊）
|
|
“Node.js 可以替代瀏覽器 JS”
|
兩者用途不同，通常配合使用（全棧開發）
|
總結
|
JavaScript
|
Node.js
|
|
|
是什麼 |
編程語言
|
JS 運行時
|
|
在哪跑 |
瀏覽器
|
服務器/本地
|
|
能做什麼 |
操作網頁
|
操作文件、網絡、系統
|
|
是否依賴對方 |
不依賴
|
依賴 JS 語言
|
掌握這個區別，是邁向
全棧開發
