🔗 JavaScript 基礎概念
Closure（閉包）
閉包是 JavaScript 中一個強大的概念，允許函式在外部函式執行完畢後仍能存取其變數。這是因為內部函式仍然保有對外部函式作用域的引用。
IIFE（立即執行函式表達式）
IIFE (Immediately Invoked Function Expression) 允許函式在定義後立即執行，避免變數污染全域命名空間。
JavaScript 的作用域（Scope）與範圍鏈（Scope Chain）
JavaScript 的變數查找是由內向外進行的，這稱為範圍鏈 (Scope Chain)。這樣的機制確保內部函式能夠存取外部函式的變數。
Prototype（原型）
在 JavaScript 中，每個物件都有一個內建的 prototype，允許物件繼承屬性與方法，這是物件導向編程 (OOP) 的核心之一。
Event Loop（事件循環）
事件循環是 JavaScript 處理非同步操作的核心機制。透過 Call Stack（呼叫堆疊）與 Event Queue（事件佇列），JavaScript 可以有效管理異步任務。
Falsy 值
Falsy 值包括 false, 0, "", null, undefined, NaN，在條件判斷中都會被視為 false。
this 關鍵字
this 代表當前執行環境的對象，取決於函式的調用方式。箭頭函式不會綁定 this，而是繼承自外部作用域。
🤝 JavaScript 進階概念
Promise 與 Async/Await
Promise 允許我們以更清晰的方式處理非同步操作，而 async/await 是對 Promise 的語法糖，使非同步代碼更具可讀性。
setTimeout 與 setInterval
setTimeout 延遲執行一段程式碼，而 setInterval 會以固定間隔重複執行。
WebSocket
WebSocket 允許前後端建立雙向、持久的連接，相較於傳統的 HTTP 請求，能有效降低延遲。
🏗️ 前端開發基礎
HTTP 狀態碼
了解 HTTP 狀態碼如 200 OK、404 Not Found、500 Internal Server Error，對於除錯與 API 開發至關重要。
Cookie、LocalStorage、SessionStorage
這三者都是瀏覽器提供的存儲方式，Cookie 用於小型數據存儲與身份驗證，LocalStorage 適合長期存儲，SessionStorage 則適用於單次瀏覽會話。
Same Origin Policy（同源政策）與 CORS（跨來源資源共享）
同源政策限制了不同來源之間的請求，而 CORS（Cross-Origin Resource Sharing）允許透過適當的伺服器設定來放寬這些限制。
🌐 前端框架與工具
React Hooks
Hooks 讓函式組件也能擁有狀態與生命週期，常見的 Hooks 包括 useState、useEffect、useRef、useContext 等。
useEffect 觸發時機
useEffect 會根據依賴陣列決定何時執行，若未提供依賴，則會在每次重新渲染時觸發。
React Query
React Query 幫助開發者輕鬆處理資料請求與快取，減少 API 請求的重複並提升效能。
Redux 應用程式架構
Redux 是一種狀態管理工具，適合大型應用，通常結合 useSelector 取得狀態，useDispatch 發送 action 來更新狀態。
🔍 系統設計與架構
Stateless vs Stateful
Stateless 指的是無狀態服務，每次請求都是獨立的；Stateful 則保留請求之間的狀態，適用於即時通訊或多人遊戲。
Immutable vs Mutable Data
Immutable 資料不可變更，適合於 Redux 等狀態管理場景，而 Mutable 資料可被直接修改，適用於一般應用開發。
Declarative vs Imperative
Declarative（宣告式）開發強調「做什麼」，如 React，Imperative（命令式）則強調「如何做」，如 jQuery。
大型網站架構演進
現代大型網站架構從傳統的單體應用（Monolithic）演進到微服務（Microservices），再到無伺服器（Serverless），提升可擴展性與維護性。
⏳ 開發工具與實作
Docker Hub 上傳與部署
Docker 允許開發者打包應用並部署至 Docker Hub，提高可攜性與一致性。
Nginx 基礎設定
Nginx 可作為反向代理伺服器，提供負載均衡與靜態文件服務，提升網站效能。
Sass/SCSS
Sass/SCSS 是 CSS 預處理器，提供變數、巢狀結構與混入（Mixin），讓樣式管理更靈活。
CSS 選擇器
熟悉 CSS 選擇器如 nth-child、not()、attribute selector，可幫助提高樣式表的靈活性與可維護性。
⚡ 結語
前端開發涵蓋多個領域，從 JavaScript 基礎到框架應用、系統設計與開發工具，每個環節都影響著面試表現。掌握這些核心概念，並搭配實際專案練習，你將更有信心應對前端開發挑戰！
