初學者指南：Node.js 和瀏覽器中常見函數的使用差異

更新日期： 2025 年 3 月 22 日

JavaScript 是一種既能在瀏覽器中運行，也能在後端使用的語言。

Node.js 是一個用於在後端運行 JavaScript 的開源運行環境，而瀏覽器則是 JavaScript 最早應用的前端環境。

這兩者都可以執行 JavaScript，但在常見函數和 API 的使用上存在一些差異。

在這篇文章中，我們將介紹 Node.js 和瀏覽器中的一些常見函數的差異，幫助新手更好地理解兩者的特性和不同之處。

console 函數

在瀏覽器中

在瀏覽器中，console 函數最常用於輸出調試訊息，通過瀏覽器的開發者工具來顯示。

常見的函數有：

• console.log()：將訊息輸出到控制台，用於普通調試。
• console.warn()：輸出警告訊息，通常以黃色顯示。
• console.error()：輸出錯誤訊息，通常以紅色顯示。

這些函數非常適合用於調試 JavaScript 程式，並可以在開發者工具中清楚地查看訊息。

在 Node.js 中

在 Node.js 中，console 函數的用法與瀏覽器相似，但它將輸出顯示在終端（命令行）中。

Node.js 的 console.log()、console.warn() 和 console.error() 都是用於在後端進行調試和查看輸出，差別在於輸出的位置。

此外，Node.js 中還有 console.table() 這樣的函數，可以用來在終端中顯示表格形式的資料，這在查看數組或物件時非常方便。

alert() 函數

在瀏覽器中

alert() 是一個瀏覽器特有的函數，用於彈出一個提示框來顯示訊息，通常用於通知用戶一些重要訊息。

alert('這是一個通知訊息');

在 Node.js 中

在 Node.js 中並沒有 alert() 函數，因為 Node.js 是用於後端開發的，並不會與用戶的視覺界面進行互動。

相對應的，Node.js 更適合用來處理後端邏輯、數據庫操作、檔案系統等，不會出現彈窗提示的需求。

document 和 window

在瀏覽器中

document 和 window 是瀏覽器環境中非常重要的物件。

它們提供了操作 DOM（文件物件模型）和與瀏覽器窗口交互的方法。

• document：用於存取和操作網頁內容，例如獲取某個元素、修改其屬性。

  document.getElementById('myElement').innerText = 'Hello, World!';

• window：代表瀏覽器窗口，是全局物件，包含許多有用的方法，例如 window.setTimeout() 和 window.location。

在 Node.js 中

Node.js 中沒有 document 和 window 物件，因為 Node.js 不處理 HTML 文件和瀏覽器窗口。

取而代之的是，Node.js 有許多內建模組，例如 fs 用於檔案系統操作，http 用於建立伺服器等。

Node.js 的設計目的主要是服務端處理，而不是前端的 DOM 操作。

定時器函數 (setTimeout 和 setInterval)

在瀏覽器中

瀏覽器中有 setTimeout() 和 setInterval() 函數，用於延遲執行某個函數或設置間隔執行。

• setTimeout()：在指定的延遲後執行一段程式碼。

  setTimeout(() => {
    console.log('這是延遲 2 秒後的訊息');
  }, 2000);

• setInterval()：每隔一段時間重複執行某段程式碼。

在 Node.js 中

在 Node.js 中，同樣可以使用 setTimeout() 和 setInterval()，它們的用法和瀏覽器中基本相同。

因此，這些定時器函數可以在前後端環境中通用，不需要額外學習新的語法。

require 和 import

在瀏覽器中

在現代 JavaScript 中，import 用於引入模組（Module）。

這是一種基於 ES6 的模組化語法，允許你在代碼中使用其他文件中的函數或物件。

import { myFunction } from './myModule.js';
myFunction();

瀏覽器環境中支援 ES6 的模組化，可以通過 import 來引入其他腳本，但這通常需要將腳本標記為 type="module"。

在 Node.js 中

在 Node.js 中，最常見的是使用 require() 來引入模組。

require 是 Node.js 的內建函數，用於引入其他模組或庫。

const fs = require('fs');

從 Node.js 12 版開始，Node.js 也支援 ES6 模組化語法，因此你可以選擇使用 import，但需要在文件中將其指定為 ES 模組（例如文件名使用 .mjs 扩展名）。

小結

JavaScript 在瀏覽器和 Node.js 環境中的應用略有不同，主要是因為兩者的用途和定位不同：

• 瀏覽器主要用於前端交互，擁有 window、document 等物件來操作 DOM，顯示訊息給用戶。
• Node.js 則用於後端開發，沒有 window 和 document，但提供了許多服務端相關的功能，如文件操作和伺服器建立等。

了解這些差異能夠幫助你，在開發時更好地選擇適合的工具和方法，並且能有效區分哪些 API 是專屬於前端或後端環境的。

希望這篇文章幫助你了解 Node.js 和瀏覽器中常見函數的使用差異，如果還有其他問題，隨時告訴我，我們可以一起探討更多的 JavaScript 知識！