Upgrade to Pro — share decks privately, control downloads, hide ads and more …

How Hooks Work under the Hood?

Avatar for miycctwn miycctwn
August 25, 2020
Programming
0
31

How Hooks Work under the Hood?

公司內部 React workshop 分享

Avatar for miycctwn

miycctwn

August 25, 2020
Tweet

More Decks by miycctwn

See All by miycctwn
自己的工具自己造，咱們來造 React Hooks!
Avatar for miycctwn mindytai
0
54

Other Decks in Programming

See All in Programming
data-viz-talk-cz-2025
Avatar for Leonardo Collado-Torres lcolladotor
0
100
GC25 Recap: The Code You Reviewed is Not the Code You Built / #newt_gophercon_tour
Avatar for mazrean mazrean
0
140
釣り地図SNSにおける有料機能の実装
Avatar for nokonoko1203 nokonoko1203
0
200
What Spring Developers Should Know About Jakarta EE
Avatar for ivargrimstad ivargrimstad
0
640
alien-signals と自作 OSS で実現する フレームワーク非依存な ロジック共通化の探求 / Exploring Framework-Agnostic Logic Sharing with alien-signals and Custom OSS
Avatar for aose aoseyuu
3
4.7k
AI時代に必須！状況言語化スキル / ai-context-verbalization
Avatar for MinoDriven minodriven
2
250
三者三様 宣言的UI
Avatar for Keita Kagurazaka kkagurazaka
0
320
CSC509 Lecture 08
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
0
270
オープンソースソフトウェアへの解像度🔬
Avatar for うたもく utam0k
18
3.2k
When Dependencies Fail: Building Antifragile Applications in a Fragile World
Avatar for Selçuk Usta selcukusta
0
120
Software Architecture
Avatar for Henning Schwentner hschwentner
6
2.4k
The Past, Present, and Future of Enterprise Java
Avatar for ivargrimstad ivargrimstad
0
640

Featured

See All Featured
Producing Creativity
Avatar for Steve Smith orderedlist
PRO
348
40k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
Avatar for soudai sone soudai
PRO
191
56k
Fantastic passwords and where to find them - at NoRuKo
Avatar for Phil Nash philnash
52
3.5k
How to train your dragon (web standard)
Avatar for Monica Dinculescu notwaldorf
97
6.3k
We Have a Design System, Now What?
Avatar for Morgane Peng morganepeng
53
7.9k
The Cult of Friendly URLs
Avatar for Andy Hume andyhume
79
6.6k
Making Projects Easy
Avatar for Brett Harned brettharned
120
6.4k
Side Projects
Avatar for Sacha Greif sachag
455
43k
Building a Scalable Design System with Sketch
Avatar for Laura Van Doore lauravandoore
463
33k
ピンチをチャンスに：未来をつくるプロダクトロードマップ #pmconf2020
Avatar for Aki / @LoveIdahoBurger aki_iinuma
127
54k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
Avatar for Eileen M. Uchitelle eileencodes
140
34k
Designing for humans not robots
Avatar for Tammie Lister tammielis
254
26k

Transcript

  1. How Hooks Work under the Hood?

  2. 01 JS Closure

  3. Scope Chain 切分變數最有效範圍是 function

  4. 試看以下程式碼

  5. None

  6. 內層的 function 可以讀取外層宣告的變數 但外層的 outer function 存取不到內層變數 若是自己層級找不到會一層一層往外找 直到 Global

  7. None

  8. function 是被定義的當下決定的 並不是被呼叫才被定義

  9. Closure 當 inner function 被回傳後 可以取得內部函式環境裡的變數值 記住了當時的環境 這就是閉包！

  10. 0 2 useState

  11. None

  12. 如果要更貼近真實的 React Hook API state 必須要為變數

  13. None

  14. Module Pattern Javascript Design Pattern

  15. None

  16. Ref 1. Deep dive: How do React hooks really work?

    2. 0 陷阱！0 誤解！8 天重新認識 JavaScript！- 許國政 (Kuro)