傳值與傳址，都幾咧？
在程式語言中最基本的問題就是問題就是如何紀錄與操縱資料，牽扯到傳值與傳址的問題，這篇教學使用 JavaScript 搭配圖表幫助你了解它們的差異。了解如何儲存變數有助於更好的操控資料，避免出現改 A 卻動到 B 的狀況。
在程式語言中最基本的問題就是問題就是如何紀錄與操縱資料，牽扯到傳值與傳址的問題，這篇教學使用 JavaScript 搭配圖表幫助你了解它們的差異。了解如何儲存變數有助於更好的操控資料，避免出現改 A 卻動到 B 的狀況。
寫程式久了會發現撰寫乾淨可被維護的程式是一件相當困難的事情，其中一個造成難維護的原因是因為「函式除了運算並回傳結果之外過程中產生變化影響到其餘的程式」，換句話說問題就是「不必要的副作用，讓程式變得捉摸不定難以理解」，因此應該了解純粹函式的定義以及如何使用，為了更進一步撰寫撰寫乾淨的代碼。
本篇文章將透過簡單易懂的辭彙介紹 JavaScript 中的 this，讓讀者能夠更深入理解 JavaScript 中 this 的使用方式與特性。`this` 會如此讓人混亂是因為它需要基於前後文來判斷，最簡單的原則就是：誰呼叫 `this`，`this` 就代表誰。
特別記錄下來，這是 React Hook Form 中非常相近的方法：watch 與 useWatch 的差異比較與說明，就連我在第一次理解他們的時候也被搞混了，這裡製作了一些可以互動的實際範例讓你馬上體會到它們之間的差異。
JavaScript 箭頭函式是 ES6 版本中新增的語法，能夠簡潔明瞭地定義函式，並且已經被廣泛的使用當中。於本篇文章中我們將會學習如何使用箭頭函式來簡化程式碼，並且了解這個語法的特性以及要注意的地方，以及它可以被使用在那些場合當中。
React useRef 與一般定義變數差在哪？我決定把他們詳細的比較寫在這篇文章中。簡單來說 useRef 是一個 React Hook 可以讓你參考一個值並不會受到 React 的重新渲染影響，透過實際代碼操作範例來理解它與類似的 useState 還有一般變數的差異。
我相信撰寫程式並沒有絕對的準則，但絕對有些常見可以權衡留意的地方。這篇文章記錄著作為助教在檢閱不同人寫的代碼的時候，留意到的一些潛在的問題……本篇文章主要是經驗的濃縮，如果要詳細的撰寫建議可以參考看看無瑕的程式碼，會有更全面的說明與案例。
絕大多數時候你不會想要使用「鬆散比對」，嘗試使用「嚴謹的比對」將程式撰寫得嚴謹精確一些。在絕大多數的情況下，你不會想要使用鬆散比對，但是在某些情況下，可能會使用它會更為便利，本篇文章將介紹相關取捨，以及你可以在什麼時候使用不同的比較方式。
如果你需要大於 3 層的嵌套，代表你已經搞砸了，應當考慮重構程式碼，應當透過反轉與封裝程式來重構邏輯。這篇文章將詳細的介紹現有問題以及使用 Guard Clauses 技巧撰寫更好閱讀的代碼，也就是透過反轉邏輯的技巧來撰寫更少嵌套邏輯的程式。
為了達成最佳化網頁加載的順序，本篇文章以實際案例說明為什麼應該使用 HTML 內建的 `defer` 和 `async` 屬性，先從問題點出發再來到三種解決方案與比對，透過原生的 HTML Script 標籤屬性及能規劃腳本的加載順序。
搜尋列是普遍存儲資料於 HTML 中最常用的方式之一，讓我們學會如何使用它。本篇文章將會練習從無到有包含介面製作一個搜尋框，可以輸入結果並比對現有資料顯示關聯的內容，是一個非常適合 JavaScript 新手的一道實用練習題目。
計數器是入門各大框架基本會見到的習題，可以說是任何 App 最低限度的功能展示。這次使用原生的 JavaScript 來重現該題目，並且一步一步的思考並改善結果，本篇文章將會練習製作一個具備加、減、重製功能的 JavaScript 計數器。
上一章節從動圖理解了非同步的概念，這一章節將會介紹如何撰寫非同步程式。從簡單的回呼函式到 Promise 再到使用 Async/Await 語法。目前知道非同步的程式實際上是透過執行環境(瀏覽器、Node.js) 所提供的 API 來達成同時間處理多件事情的。
防抖與節流是前端效能主題中必定會出現的模式，對用戶的輸入進行適當的防抖與節流處理，除了有助於提升使用者體驗之外，對開發者來說也節省掉許多潛在的資源浪費，透過實際案例還有動畫圖片一起來了解防抖與節流如何幫助我們提升程式效率。
了解單線程的 JavaScript 背後如何運作、併發處理事件背後的奧妙、拆解晦澀難懂的專有名詞。瀏覽器執行環境中的 JavaScript 是單線程的，也就是一次只能執行一件事，如此一來其他事情就都會被擱置在後，讓使用者等待。這是非常大的問題，但解決方法也非常的簡單：「不要呆呆站在那裏等！」。