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
Two Blades, One Journey: Engineering While Managing
ohbarye
4
2.2k
AIエージェント開発のノウハウと課題
pharma_x_tech
5
3.7k
事業を差別化する技術を生み出す技術
pyama86
2
290
OPENLOGI Company Profile for engineer
hr01
1
20k
EMConf JP 2025 懇親会LT / EMConf JP 2025 social gathering
sugamasao
2
200
ExaDB-XSで利用されているExadata Exascaleについて
oracle4engineer
PRO
3
270
アジャイルな開発チームでテスト戦略の話は誰がする? / Who Talks About Test Strategy?
ak1210
1
650
脳波を用いた嗜好マッチングシステム
hokkey621
0
290
生成AI “再”入門 2025年春@WIRED TUESDAY EDITOR'S LOUNGE
kajikent
0
140
クラウド食堂とは?
hiyanger
0
120
設計を積み重ねてシステムを刷新する
sansantech
PRO
0
180
困難を「一般解」で解く
fujiwara3
7
1.2k
Featured
See All Featured
Mobile First: as difficult as doing things right
swwweet
223
9.5k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
129
19k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
10
1.3k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
356
29k
Building a Scalable Design System with Sketch
lauravandoore
461
33k
[RailsConf 2023] Rails as a piece of cake
palkan
53
5.3k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
32
2.1k
Making Projects Easy
brettharned
116
6k
Building Your Own Lightsaber
phodgson
104
6.2k
Thoughts on Productivity
jonyablonski
69
4.5k
Imperfection Machines: The Place of Print at Facebook
scottboms
267
13k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
44
7k
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