Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
クラスへの割り込み処理とProxyとReflect / method-intercept-wi...
Search
hivesbee
May 24, 2019
Programming
140
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
クラスへの割り込み処理とProxyとReflect / method-intercept-with-proxy-and-reflect
初投稿です。
hivesbee
May 24, 2019
More Decks by hivesbee
See All by hivesbee
組織・プロセス・技術 フロントエンドの生産性向上への複眼的アプローチ
hivesbee
0
43
Design System Meets Vue.js
hivesbee
0
170
mabl を融和させるための取り組み in クラウドサイン / how-to-fusion-mabl-in-cloudsign
hivesbee
0
230
フロントエンドの組織について考える / think-about-front-end-organization
hivesbee
5
3k
ProgressiveにVueを導入している話 / vue-progressive-integration
hivesbee
1
670
ProgressiveにVueを導入している現場から送る小ネタ / vue-progressive-integration-tips-dialog
hivesbee
1
610
Other Decks in Programming
See All in Programming
우리의 Nitro Modules는 당신의 Turbo Modules보다 아름답다
l2hyunwoo
0
220
最近”作らせてる” ローカルAIアプリの話
akit37
0
500
Agentic Software Factoryに、すごく賢いIF文を。 / super smart IF statement into the Agentic Software Factory.
rkaga
8
2.4k
Simple Storage Service(S3) is not simple
iwatsukayura
0
330
パスワード再設定メールのURLについて知っておこう
uyuki234
0
180
Lambda durable functionsでHuman in the Loopを楽に…楽に……
har1101
1
200
AI時代のTerminal環境を UNIX哲学で設計・運用する
yasunori0418
1
210
あなたの await、OS まで届いてる? strace で覗く JavaScript の非同期
hasutosasaki
1
1.5k
[2026-10-14](C)Re:ゼロから始める異世界生活〜始まりの終わりと終わりの始まり〜
tosite
0
160
當我們開始不讀 Code - AI Agent 時代,Code Review 與 Clean Code 還剩下什麼?
jame2408
1
320
HTML-in-Canvasで作る未来のWeb UI表現
clockmaker
5
5.7k
Findy - エンジニア向け会社紹介/Findy Company Deck
findyinc
6
400k
Featured
See All Featured
YesSQL, Process and Tooling at Scale
rocio
174
15k
Measuring & Analyzing Core Web Vitals
bluesmoon
9
1k
A Soul's Torment
seathinner
8
3.8k
Prompt Engineering for Job Search
mfonobong
0
540
Marketing to machines
jonoalderson
1
5.9k
Ruling the World: When Life Gets Gamed
codingconduct
0
420
[Rails World 2026] Durable orchestration on Rails: from continuation to workflow
palkan
1
900
Designing for Performance
lara
612
70k
The Pragmatic Product Professional
lauravandoore
37
7.5k
Stop Working from a Prison Cell
hatefulcrawdad
274
21k
Designing for humans not robots
tammielis
254
26k
What Being in a Rock Band Can Teach Us About Real World SEO
427marketing
0
1.1k
Transcript
ΫϥεͷׂΓࠐΈॲཧͱ 1SPYZͱ 3FqFDU XFKT!OE .BTBTIJ)BHBʢ!)JWFTCFFʣ
⾣6ODBVHIU3FGFSFODF&SSPS)BHBJTOPUEFpOFE .BTBTIJ)BHB (JUIVCIJWFTCFF 5XJUUFS!)JWFTCFFʢ;͕͊ʣ 'SPOUFOE&OHJOFFSBU↘ &EJUPS(P-BOE $PNNBOEMPMDBU ❤7VFKT K2VFSZ /BLBNPUP
ࠓ͓͢Δ͜ͱ ϝιουʹର͢ΔׂΓࠐΈΛ࣮ͨͯ͘͠ɺ ͍Ζ͍Ζௐͯপ͚ͬͨͲɺ ݁ہγϯϓϧͳ࣮ʹͳͬͨͱ͍͏ɺ ໎͍ʹ໎ͬͨͱ͖ͷ͓ͳ͠ ࠓͷίʔυɿIUUQTKTpEEMFOFUIJWFTCFFRYHSX[
Ζ͏ͱͨ͜͠ͱ ਆʢϢʔςΟϦςΟʔΫϥεʣݴͬͨʮΤϥʔ͋Εʯ ɹ☝ͷϝιουݺͼग़࣌͠ʹνΣοΫॲཧΛ ɹט·ͤͯͦ͜ͰΤϥʔͩͬͨΒ ɹΤϥʔϋϯυϦϯά͍ͨ͠ʢ෦తʹґଘੑΛೖʣ ɹͱ͍͏ͷΛ#VTJOFTT-PHJDଆͰ࣮͍ͨ͠ 6UJM$MBTT #VTJOFTT -PHJD .FUIPE
Τϥʔ͋Ε &SSPS )BOEMFS ʢ·ͩͳ͍ʣ
Ͳ͏͠Α͏ͱ͔ͨ͠ Ҋ̍ɿ#VTJOFTT-PHJDଆͰίʔυΛॻ͚ʁ ɹˠʢϝιουݺͼग़ͨ͢ͼʹॻ͘ͷʣμϧ͘Ͷʁ Ҋ̎ɿ6UJM$MBTTͷதͰνΣοΫ͢Εʁ ɹˠʢ6UJM$MBTTͷϝιου૿͑ͨͱ͖ʹʣਏ͘Ͷʁ Ҋ̏ɿׂΓࠐΈॲཧͰղܾ͢Εʁ ɹˠͲ͏ͬͯʜʁˠ1SPYZͬͯ͋Δ͡ΌΜʂ 6UJM$MBTT #VTJOFTT -PHJD
.FUIPE Τϥʔ͋Ε &SSPS )BOEMFS ʢ·ͩͳ͍ʣ
࣮ͯ͠Έͨʢࣦഊฤʣ // ׂΓࠐΈॲཧ͞ΕΔ Utility Ϋϥε class _Util { static greet(name)
{ console.log(`hello! ${name}!`) } static throwError(...args) { console.log(‘Sample#throwError') // ͜͜ͰΤϥʔ͕ى͜Δ throw new Error(...args) } } // Proxy ʹΘͨ͢ϋϯυϥ const handler = { get(target, name, receiver) { try { interceptor() return target[name] } catch (e) { onError(e) } } } // ͍ͭ͜ΒΛ export export let interceptor // ׂΓࠐΈॲཧ༻ export let onError // Τϥʔϋϯυϥ export const Util = new Proxy(_Util, handler) // ׂΓࠐΈॲཧͷ࣮ interceptor = () => { console.log('intercept!') } onError = (e) => { console.log('onError!') console.log(e) } // ࣮ࡍʹݺͼग़͢ Util.greet('haga') Util.throwError('sample error') 6UJM$MBTTKT #VTJOFTT-PHJDKT উͬͨͳʂ ෩࿊ೖͬͯ͘Δ Χϓʔ
࣮ͯ͠Έͨʢࣦഊฤʣ JOUFSDFQU IFMMPIBHB JOUFSDFQU 4BNQMFUISPX&SSPS 6TFSTʜUFTUKT UISPXOFX&SSPS BSHT ?
&SSPSTBNQMFFSSPS BU1SPYZUISPX&SSPS 6TFSTʜUFTUKT BU0CKFDUBOPOZNPVT 6TFSTʜUFTUKT ʜ ࣮ߦͨ݁͠Ռʜ ΨνͷΤϥʔൃੜ ʢΤϥʔϋϯυϥͰݕ͍ͯ͠ͳ͍ʣ Χϓʔ
࣮ͯ͠Έͨʢࣦഊฤʣ const handler = { get(target, name, receiver) { try
{ interceptor() return target[name] } catch (e) { onError(e) } } } ݪҼʜ ϝιουͦͷ··ฦͯ͠·͢Μʜ ͦΓΌಈ͖·ͤΜΘʜ ͱͳΔͱIBOEMFSͰॲཧͤͯ͋͛͞ͳ͍ͱʜ ˠͦ͏͍͑3FqFDUͬͯ͋ͬͨͳʜ
࣮ͯ͠Έͨʢޭʁฤʣ const handler = { get(target, name, receiver) { return
(...args) => { const apiMethod = Reflect.get(target, name, receiver) const boundApiMethod = apiMethod.bind(target) try { interceptor() return boundApiMethod(...args) } catch (e) { onError(e) } } } } const handler = { get(target, name, receiver) { try { interceptor() return target[name] } catch (e) { onError(e) } } } 3FqFDUHFUͰϝιουΛऔΓग़ͯ͠ॲཧ ΤϥʔϋϯυϦϯά·ͰؚΊͨॲཧΛSFUVSO ͔ͬͨʁ Χϓʔ #FGPSF "GUFS ˠ;ͭʔʹಈ͍ͨ
͖ͬ͞ʢ̑࣌ؒલʣࢥͬͨ͜ͱ͚ͩͲ ͪΐͬͱ·ͬͯ ͜Εͬͯ3FqFDUͱ͍͏ΑΓϞδϡʔϧͰॻ͍͔ͨΒ͡ΌͶʁ ͱɺ͍͏͜ͱͰ 3FqFDUͷॲཧΛͯ͠ϞδϡʔϧΛSFUVSO͢Δͱ͚࣮ͩ͜
࣮ͯ͠Έͨʢޭฤʣ const handler = { get(target, name, receiver) { return
(...args) => { try { interceptor() return target[name](...args) } catch (e) { onError(e) } } } } ಈ͍ͨΑʜ ʢमਖ਼ͷϓϧϦΫग़͞ͳ͖Όʜʣ Χϓʔ
·ͱΊ ɾ1SPYZ͚ͩͰׂΓࠐΈॲཧͰ͖Δ ɹ͋Εɺ3FqFDUͬͯͳΜͩʜ ɾਖ਼ɺ͚ࣗͩͰߟ͑ͯ࡞͔ͬͨΒ͜Ε͕ ɹϕετϓϥΫςΟε͔Ͳ͏͔ϫΧϥϯ ɾ;ͩΜ7VFʹ͓ΜͿʹ͔ͩͬͩ͜Βٱ͠ͿΓʹপͬͨ ɾ*OWFSTJGZ+4ʜ ɹͬͪ͜ͷ΄͏ָ͕ʹॻ͚ΔΜͰ͔͢ʜʁ ɹ˞ࡢௐͨ͠Βग़͖ͯͨʜৄ͍͠ਓڭ͑ͯʜ
͝੩ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ Χϓʔʂ