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
再帰関数を使ってみよう
Search
Yoshiaki Itakura
December 02, 2020
Programming
1
6.2k
再帰関数を使ってみよう
フロントエンドLT会 vol.2 - 2020冬まつり
の LT 用のスライドです。
Yoshiaki Itakura
December 02, 2020
Tweet
Share
More Decks by Yoshiaki Itakura
See All by Yoshiaki Itakura
Elementをさくっと拡張したい - @【ラクスル×KCF】FrontendNight
negibouze
0
550
Other Decks in Programming
See All in Programming
TDD 実践ミニトーク
contour_gara
1
290
Azure SRE Agentで運用は楽になるのか?
kkamegawa
0
2.1k
Design Foundational Data Engineering Observability
sucitw
3
190
Amazon RDS 向けに提供されている MCP Server と仕組みを調べてみた/jawsug-okayama-2025-aurora-mcp
takahashiikki
1
110
RDoc meets YARD
okuramasafumi
4
170
Improving my own Ruby thereafter
sisshiki1969
1
160
GitHubとGitLabとAWS CodePipelineでCI/CDを組み比べてみた
satoshi256kbyte
4
220
Oracle Database Technology Night 92 Database Connection control FAN-AC
oracle4engineer
PRO
1
440
Updates on MLS on Ruby (and maybe more)
sylph01
1
180
MCPでVibe Working。そして、結局はContext Eng(略)/ Working with Vibe on MCP And Context Eng
rkaga
5
2.2k
Putting The Genie in the Bottle - A Crash Course on running LLMs on Android
iurysza
0
140
アプリの "かわいい" を支えるアニメーションツールRiveについて
uetyo
0
230
Featured
See All Featured
Rails Girls Zürich Keynote
gr2m
95
14k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
51
5.6k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
15
1.6k
Build your cross-platform service in a week with App Engine
jlugia
231
18k
Automating Front-end Workflow
addyosmani
1370
200k
Producing Creativity
orderedlist
PRO
347
40k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
18
1.1k
Raft: Consensus for Rubyists
vanstee
140
7.1k
Faster Mobile Websites
deanohume
309
31k
The Art of Programming - Codeland 2020
erikaheidi
56
13k
Embracing the Ebb and Flow
colly
87
4.8k
A better future with KSS
kneath
239
17k
Transcript
再帰関数を使ってみよう 板倉 義晃(@ita_3y) @フロントエンドLT会 vol.2 - 2020冬まつり
本日のお品書き 1. 再帰関数 とは(30秒) 2. 再帰関数の例(30秒) 3. 実践1: オブジェクトから不要な値を取り除く(1分〜2分) 4.
実践2: 関数を定期的に実行する(2分) 5. 自己紹介(余った時間) 6. まとめ
再帰関数 とは あるものについて記述する際に、記述しているものそれ自身への参照が、そ の記述中にあらわれることをいう。(Wikipedia) 再帰 とは 再帰呼び出し とは 手続きや関数といった概念をもつプログラミング言語で、ある手続き中で再び その手続き自身を呼び出すこと。(Wikipedia)
再帰関数 とは 再帰的(自分自身を呼び出す)な関数のこと。
再帰関数の例 "There are 3 left." "There are 2 left." "There
are 1 left." "Finished." 終了条件が無いと無限ループするの で、なるべく先に書いておく。 再帰呼び出し
実践1: オブジェクトから不要な値を取り除く やりたいこと ・値 が null の場合は undefined を返す ・値
が Array の場合は null を undefined に変換した Array を返す ・値 が Object の場合は 値が null のプロパティを削除した Object を返す
実践1: オブジェクトから不要な値を取り除く ・x が null の場合 => undefined を返す ・x
が Array の場合 => Array の要素毎に removeNull を呼び出し (再帰呼び出し)、結果を返す ・val が Object の場合 => 値が null のプロパティ削除後に、値毎に removeNull を呼び出し(再帰呼び出し)、結果を オブジェクトにして返す
実践1: オブジェクトから不要な値を取り除く
実践2: 関数を定期的に実行する setTimeout と setInterval について 指定時間経過後、一度だけ関数を実行します。 setTimeout 各実行の間は指定した間隔で、定期的に関数を実行します。 setInterval
再帰的な setTimeout は実行の間の遅延を保証しますが、 setInterval は保証しません。 setInterval は関数の実行時間がインターバルに含まれるため、実際の遅延は指定時間よりも短 くなります。 再帰的な setTimeout は固定の遅延を保証します。 https://ja.javascript.info/settimeout-setinterval 再帰的な setTimeout と setInterval
実践2: 関数を定期的に実行する ・タイマースタート時 => execute を指定して、setTimeout を呼び出 す ・execute 関数実行時
=> 自身(execute)を指定して、setTimeout を呼 び出す(再帰呼び出し) ・タイマーストップ時 => clearTimeout を呼び出して処理をキャンセ ルする https://gist.github.com/negibouze/6a8574432210ea87d6eef2bebcc03712 ※長いので画像は一部抜粋したものです。
自己紹介 ・板倉 義晃(いたくら よしあき) ・Twitter: @ita_3y ・GitHub: negibouze
まとめ ・オブジェクトの探索等、再帰的な処理をしたい時は再帰関数が使えるかも ・再帰呼び出しをする時は、必ず終了条件があることを確認しよう ・等間隔の遅延を入れたい時は setTimeout の再帰呼び出しが良いかも ・JavaScript で再起呼び出しをする時はスタックオーバーフローに注意しよう ご清聴ありがとうございました。 参考:
JavaScript・再帰・トランポリン https://qiita.com/41semicolon/items/985bdd2f551d9392463c