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.4k
Other Decks in Technology
See All in Technology
Windows 11 で AWS Documentation MCP Server 接続実践/practical-aws-documentation-mcp-server-connection-on-windows-11
emiki
0
950
より良いプロダクトの開発を目指して - 情報を中心としたプロダクト開発 #phpcon #phpcon2025
bengo4com
1
3.1k
ローカルLLMでファインチューニング
knishioka
0
150
PHP開発者のためのSOLID原則再入門 #phpcon / PHP Conference Japan 2025
shogogg
4
710
TechLION vol.41~MySQLユーザ会のほうから来ました / techlion41_mysql
sakaik
0
180
Model Mondays S2E02: Model Context Protocol
nitya
0
220
AWS CDK 実践的アプローチ N選 / aws-cdk-practical-approaches
gotok365
6
720
データプラットフォーム技術におけるメダリオンアーキテクチャという考え方/DataPlatformWithMedallionArchitecture
smdmts
5
620
GitHub Copilot の概要
tomokusaba
1
130
PHPでWebブラウザのレンダリングエンジンを実装する
dip_tech
PRO
0
200
Node-RED × MCP 勉強会 vol.1
1ftseabass
PRO
0
140
【5分でわかる】セーフィー エンジニア向け会社紹介
safie_recruit
0
26k
Featured
See All Featured
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
138
34k
BBQ
matthewcrist
89
9.7k
Build your cross-platform service in a week with App Engine
jlugia
231
18k
The Art of Programming - Codeland 2020
erikaheidi
54
13k
StorybookのUI Testing Handbookを読んだ
zakiyama
30
5.8k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
Large-scale JavaScript Application Architecture
addyosmani
512
110k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
8
790
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
657
60k
Building Applications with DynamoDB
mza
95
6.5k
Java REST API Framework Comparison - PWX 2021
mraible
31
8.6k
What's in a price? How to price your products and services
michaelherold
246
12k
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