Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
What we should know when using closure
Search
Akira Morikawa
July 23, 2018
Technology
0
150
What we should know when using closure
Akira Morikawa
July 23, 2018
Tweet
Share
More Decks by Akira Morikawa
See All by Akira Morikawa
コロナ禍だからこそ考えるオフラインコミュニティの意義 / significance of community
ariaki
0
1.9k
アウトプットの始め方/start output 20230121
ariaki
0
290
web-secure-phpcon2020
ariaki
3
3.4k
オブジェクトライフサイクルとメモリ管理を学ぼう / OOC 2020
ariaki
8
3.6k
エンジニアはアウトプットによって成長できるのか? / Grow with your output
ariaki
24
6.4k
アウトプットを始めよう / How to begin output jawsug-bgnr
ariaki
2
3.8k
参加者の安全を守れていますか? / Protecting community safety
ariaki
1
6.9k
タピオカに学ぶ二段階認証 / tapioca-mfa
ariaki
5
1.3k
古に学ぶ個人開発のススメ / My recommendation of personal development
ariaki
1
1.5k
Other Decks in Technology
See All in Technology
Operating Operator
shhnjk
1
620
20250707-AI活用の個人差を埋めるチームづくり
shnjtk
6
4k
VS CodeとGitHub Copilotで爆速開発!アップデートの波に乗るおさらい会 / Rapid Development with VS Code and GitHub Copilot: Catch the Latest Wave
yamachu
2
190
さくらのIaaS基盤のモニタリングとOpenTelemetry/OSC Hokkaido 2025
fujiwara3
3
460
スタートアップに選択肢を 〜生成AIを活用したセカンダリー事業への挑戦〜
nstock
0
260
改めてAWS WAFを振り返る~業務で使うためのポイント~
masakiokuda
2
300
Enhancing SaaS Product Reliability and Release Velocity through Optimized Testing Approach
ropqa
1
240
マネジメントって難しい、けどおもしろい / Management is tough, but fun! #em_findy
ar_tama
7
1.2k
Delta airlines Customer®️ USA Contact Numbers: Complete 2025 Support Guide
deltahelp
0
930
AWS CDK 入門ガイド これだけは知っておきたいヒント集
anank
3
290
SREのためのeBPF活用ステップアップガイド
egmc
1
200
AIエージェントが書くのなら直接CloudFormationを書かせればいいじゃないですか何故AWS CDKを使う必要があるのさ
watany
9
2.3k
Featured
See All Featured
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
5.9k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
30
2.1k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
29
1.8k
Building Adaptive Systems
keathley
43
2.7k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
Build The Right Thing And Hit Your Dates
maggiecrowley
36
2.8k
YesSQL, Process and Tooling at Scale
rocio
173
14k
4 Signs Your Business is Dying
shpigford
184
22k
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3.3k
Building a Modern Day E-commerce SEO Strategy
aleyda
42
7.4k
Thoughts on Productivity
jonyablonski
69
4.7k
GitHub's CSS Performance
jonrohan
1031
460k
Transcript
( on ES6+ ) What we should know when using
closure 2018. 07. 23 / #wejs CC-BY-4.0 ariaki4dev
第一級オブジェクト function
関数定義
関数を代入
[ ES5 ] 無名関数 や 即時関数 は 何に使われていたか?
使用例 ブロックスコープの代替手段(グローバル汚染の回避)
- 即時関数を使いたくないたい人向け - ブロックスコープ ( let ) の使用 - モジュール化
( <script type=”module”>...</script> ) - Symbol や WeakMap を使う - 将来的にプライベートフィールドができるかも ( tc39-proposal ) - Private Field - Public Field グローバル汚染の回避方法
関数閉包 closure
- プログラミング言語における関数オブジェクトの一種 - 無名関数で実現している - 引数以外の変数を自身の静的スコープで解決する - 関数の中に関数を定義することができる - 外側の関数で宣言された変数を内側の関数で操作できる
- 主な利点はグローバル変数の削減 closure https://ja.wikipedia.org/wiki/クロージャ
closure example # 1 - 関数内で関数を定義している - say 内で外部変数 message
が解決できている
closure example # 2 - say を関数外に持ち出しても message が解決できている
closure example # 3 - 即時関数を即時呼び出し
closure example # 4 - outer / inner 引数の組み合わせ例
closure example # 5 encapsulation
余談)Function.prototype instance scope global scope
余談)object
余談)class
スコープと生存期間 scope & extent
静的スコープ 動的スコープ static / lexical scope dynamic scope
浅いアクセス 深いアクセス 深い束縛 浅い束縛
スコープが静的に閉じられている(閉包) → closure closure
scope chain inner outer global - shadowing … スコープを挟んで名前を重複定義できる -
masking … 一番近い変数が優先される
activation object activation object arguments this activation object arguments this
vars vars variable objects vars Global Outer Inner
activation object - scope chain - 関数のコール毎に activation object が生成される
- 自分では直接触る事ができない object - メモリを都度確保する - closure はメモリ使用量増加の原因になる - prototype chain - prototype が格納される - scope chain 探索後に対象となる ( scope chain が優先 )
closure によるメモリリークの発生 memory leak
1. Timer / EventListener
2. Variables
3. Circular reference myfunc elem myfunc
- 第一級オブジェクトっていろんな書き方ができる - closure は宣言時参照なので外部変数の GC を阻害する - Javascript 楽しい
まとめ
Build Something Amazing ariaki4dev written by