城市碼農

Articles about JavaScript

JavaScript2024-09-08

理解 JS 原型,從 Prototype, Prototype Chain 到 Prototype Pollution

JS 原型看似離開發者很遠,實際上很近,因為開發者所使用的原生函式一直都跟 Prototype Chain 有關,此外,Prototype 被污染更是種安全性議題,如果開發上能對原型更理解,就更能避免寫出 anti pattern 的程式碼。

Redux, JavaScript2022-01-20

理解 Redux 原始碼 (3):來實作 combineReducers 吧

前兩篇 Redux 原始碼的文章,實作了 createStore 以及 applyMiddleware 等項目,在這篇文章中,將實作負責整合多個 reducers 的 combineReducers,藉此了解 Redux 是如何實踐這件事。

Redux, JavaScript2021-12-30

理解 Redux 原始碼 (2):來實作 middlewares、applyMiddleware 以及 createStore enhancer 吧

接續上篇 Redux 系列文章,已實作完 createStore 中的 getState、dispatch、subscribe 後,這篇將進階到實作 Redux middleware 相關的功能,如 applyMiddleware 及 createStore 傳入的 enhancer 等。帶著好奇心,更深入探討 Redux 吧。

Redux, JavaScript2021-12-01

理解 Redux 原始碼 (1):來實作 createStore 的 getState、dispatch、subscribe 吧

很好奇 Redux 是如何在程式中實踐狀態統一控管以及單向資料流的概念,於是決定閱讀 Redux 的原始碼,並解實作基礎的 createStore function,會聚焦在 getState、dispatch、subscribe API。

JavaScript2021-07-25

透過程式範例,熟悉 JS 執行流程的關鍵:Event Loop

學習 JavaScript 執行流程時,會需要深入理解 Event Loop,其中包含 Call Stack、Callback Queue、Macrotasks、Microtasks 等概念,將在本文中整理詳述,期待閱讀完後,能更完整地理解 promise 與 setTimeout 等執行項目混在一起時,誰先執行的相關問題。

JavaScript2021-06-01

JS 中的淺拷貝 (Shallow copy) 與深拷貝 (Deep copy) 原理與實作

在 JS 中 Object 資料型別的複製變數時,是複製地址(address)而非原始值(value),所以操作複製出的新變數時,容易更動到原始變數,反之亦然,因此容易造成非預期的 Bug 發生。為了解決這類問題,就必須了解 Object 資料型別的兩種拷貝方式:淺拷貝(Shallow copy)與深拷貝(Deep copy)。

JavaScript2021-05-20

JS 變數傳遞探討:pass by value 、 pass by reference 還是 pass by sharing?

在 JS 中,時常會聽到基本型別 (Primitive type) 的變數是 pass by value,物件型別 (Object) 的變數是 pass by reference 的說法,然而當深入查找後,又會發現 pass by sharing,更甚至看到 JS 都是 pass by value,究竟是怎麼回事呢?本文將由記憶體儲存變數的方式、複製變數的方式談起,一步步理解 JS 中的 pass by value、pass by reference 以及 pass by sharing。

JavaScript2020-11-29

parseInt / parseFloat / Number,將字串轉型為數字的方法比較

最近在工作時遇到 string 要用 parseInt 還是 Number 轉型的選擇,因此閱讀 ES6 規格與 MDN 的定義,來大致理解 parseInt / parseFloat / Number 三者差異。文中有解釋:為什麼 parseInt(010, 10) 的結果會是 8 的原因。

JavaScript2020-10-25

JS 宣告變數, var 與 let / const 差異

2019 開始學 JS 時,已經倡導使用 let / const,然而網路上資料常有 var,它們差異在哪?