OVERVIEW
1、WHAT IS PROXY
2、USE CASES
3、OBSERVABLE & IMMER.JS
4、DISCUSS
Slide 3
Slide 3 text
WHAT IS PROXY
PROXY IS A DESIGN PATTERN
Slide 4
Slide 4 text
WHAT IS PROXY
PROXY IN JAVASCRIPT
The Proxy object is used to define custom behavior for
fundamental operations (e.g. property lookup, assignment,
enumeration, function invocation, etc)
Slide 5
Slide 5 text
WHAT IS PROXY
PROXY IN JAVASCRIPT
handler.apply()
handler.construct()
handler.defineProperty()
handler.deleteProperty()
handler.get()
handler.getOwnPropertyDescriptor
()
handler.getPrototypeOf()
handler.has()
handler.isExtensible()
handler.ownKeys()
handler.preventExtensions()
handler.set()
handler.setPrototypeOf()
Slide 6
Slide 6 text
USE CASES
BASIC USAGE
Slide 7
Slide 7 text
USE CASES
SET DEFAULT PROPERTIES
Slide 8
Slide 8 text
USE CASES
PRIVATE PROPS
Slide 9
Slide 9 text
USE CASES
TRACK PROPS CHANGE
Slide 10
Slide 10 text
USE CASES
SINGLETON
Slide 11
Slide 11 text
USE CASES
PROP VALIDATORS
Slide 12
Slide 12 text
USE CASES
COOKIE OBJECT HANDLER
Slide 13
Slide 13 text
USE CASES
REVOCABLE PROXY
Slide 14
Slide 14 text
REAL WORLD PROJECT
OBSERVABLE-UTIL
▸ https://github.com/nx-js/observer-util
Slide 15
Slide 15 text
REAL WORLD PROJECT
OBSERVABLE-UTIL
Slide 16
Slide 16 text
REAL WORLD PROJECT
IMMER
▸ https://github.com/mweststrate/immer
Slide 17
Slide 17 text
REAL WORLD PROJECT
IMMER
Slide 18
Slide 18 text
SUMMARY
PROS & CONS
▸ Expando property access
▸ Low coupling
▸ Protect the original object
▸ Meta programming in a way
▸ Browser compatibility