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
140
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.8k
アウトプットの始め方/start output 20230121
ariaki
0
260
web-secure-phpcon2020
ariaki
3
3.3k
オブジェクトライフサイクルとメモリ管理を学ぼう / OOC 2020
ariaki
8
3.5k
エンジニアはアウトプットによって成長できるのか? / Grow with your output
ariaki
24
6.3k
アウトプットを始めよう / How to begin output jawsug-bgnr
ariaki
2
3.7k
参加者の安全を守れていますか? / Protecting community safety
ariaki
1
6.7k
タピオカに学ぶ二段階認証 / tapioca-mfa
ariaki
5
1.2k
古に学ぶ個人開発のススメ / My recommendation of personal development
ariaki
1
1.4k
Other Decks in Technology
See All in Technology
AIエージェント時代のエンジニアになろう #jawsug #jawsdays2025 / 20250301 Agentic AI Engineering
yoshidashingo
9
4k
フォーイット_エンジニア向け会社紹介資料_Forit_Company_Profile.pdf
forit_tech
1
1.7k
AWS Well-Architected Frameworkで学ぶAmazon ECSのセキュリティ対策
umekou
2
150
データベースの負荷を紐解く/untangle-the-database-load
emiki
2
550
入門 PEAK Threat Hunting @SECCON
odorusatoshi
0
180
Autonomous Database Serverless 技術詳細 / adb-s_technical_detail_jp
oracle4engineer
PRO
17
46k
エンジニアリング価値を黒字化する バリューベース戦略を用いた 技術戦略策定の道のり
kzkmaeda
7
3.4k
手を動かしてレベルアップしよう!
maruto
0
250
開発組織を進化させる!AWSで実践するチームトポロジー
iwamot
2
530
Pwned Labsのすゝめ
ken5scal
2
560
Potential EM 制度を始めた理由、そして2年後にやめた理由 - EMConf JP 2025
hoyo
2
3.1k
Snowflakeの開発・運用コストをApache Icebergで効率化しよう!~機能と活用例のご紹介~
sagara
1
530
Featured
See All Featured
A Tale of Four Properties
chriscoyier
158
23k
A designer walks into a library…
pauljervisheath
205
24k
Build your cross-platform service in a week with App Engine
jlugia
229
18k
Building Adaptive Systems
keathley
40
2.4k
Speed Design
sergeychernyshev
27
810
Writing Fast Ruby
sferik
628
61k
KATA
mclloyd
29
14k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
30
4.6k
How GitHub (no longer) Works
holman
314
140k
The Cult of Friendly URLs
andyhume
78
6.2k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
366
25k
Unsuck your backbone
ammeep
669
57k
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