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
JavaScriptのセンターピン
Search
yosi
August 08, 2022
Programming
0
110
JavaScriptのセンターピン
yosi
August 08, 2022
Tweet
Share
More Decks by yosi
See All by yosi
自社開発のエンジニアの私が 大事にしてること(n=1)
yoshisan
1
43
なるほどGit講座 (追跡ブランチが理解できます!)
yoshisan
0
160
「自分の時間を生きる」キャリア論
yoshisan
1
93
小学生でもわかる SlackAPI×GAS
yoshisan
0
100
達人プログラマーになろう!
yoshisan
0
110
認証認可
yoshisan
1
120
オブジェクト指向が"チョットワカル"スライド
yoshisan
0
110
Linuxについて"ほんのチョットワカル"スライド
yoshisan
1
95
Let's React!! "チョットワカル"の第一歩
yoshisan
1
170
Other Decks in Programming
See All in Programming
CSC509 Lecture 12
javiergs
PRO
0
160
What’s New in Compose Multiplatform - A Live Tour (droidcon London 2024)
zsmb
1
480
OnlineTestConf: Test Automation Friend or Foe
maaretp
0
110
Why Jakarta EE Matters to Spring - and Vice Versa
ivargrimstad
0
1.1k
Make Impossible States Impossibleを 意識してReactのPropsを設計しよう
ikumatadokoro
0
170
macOS でできる リアルタイム動画像処理
biacco42
9
2.4k
CSC509 Lecture 11
javiergs
PRO
0
180
リアーキテクチャxDDD 1年間の取り組みと進化
hsawaji
1
220
【Kaigi on Rails 2024】YOUTRUST スポンサーLT
krpk1900
1
330
聞き手から登壇者へ: RubyKaigi2024 LTでの初挑戦が 教えてくれた、可能性の星
mikik0
1
130
Realtime API 入門
riofujimon
0
150
CSC509 Lecture 13
javiergs
PRO
0
110
Featured
See All Featured
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
8
890
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
38
1.8k
A Modern Web Designer's Workflow
chriscoyier
693
190k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
280
13k
Speed Design
sergeychernyshev
25
620
10 Git Anti Patterns You Should be Aware of
lemiorhan
655
59k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
246
1.3M
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
4
370
GraphQLとの向き合い方2022年版
quramy
43
13k
Fireside Chat
paigeccino
34
3k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
131
33k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
329
21k
Transcript
P r e s e n t e d b
y y o s h i チーム開発。 JavaScriptで いかがでしょう👀??
None
None
センターピンとは?? ところで,,,,
一番効果が望める力点
一番効果が望める力点
プログラミング言語にも センターピンはございます。
範囲を先取りする。
視点 1.HTMLの主要のタグ
JSはHTMLのtagu内のidを基点にしている! →パターンはある程度決まってる! どういう時に使われる? ・フォームの送信(生成・新規作成) ・link移動(非同期通信) ・テーブル(表示一覧) なぜHTML??
視点 2.イベントハンドラ
ある特定の操作をトリガー(基点)として動きます。 →この基点がイベントハンドラ! ・clickした時 ・ボタン状をホバーした時 ・LINKに飛んだ時 etc イベントハンドラ
ある特定の操作を基点として動きます。 →この基点がイベントハンドラ! JSの主要な要素は全てHTMLのタグが発火箇所にな ります! イベントハンドラ一覧(抜粋)
視点 3.関数表記
JSの記述は関数型言語に近い思想になります! 知っておきたいこと ・オブジェクト指向 ・関数指向 書き方 ・無名関数 ・コールバック関数 なぜ関数??
視点 4.DOM操作
ブラウザ側がブラウザAPIは使用する際に JavaScriptをデファクトスタンダードで扱えるように してるから。 JavaScriptでブラウザAPIを動かしています。 その際にブラウザAPI側で書くドキュメントの各要素をオ ブジェクト的に動かせるようになってる。 →これがDOM操作! なぜJSがフロントで必要??
ブラウザ側がブラウザAPIは使用する際に JavaScriptをデファクトスタンダードで扱えるように してるから。 JavaScriptでブラウザAPIを動かしています。 その際にブラウザAPI側で書くドキュメントの各要素をオ ブジェクト的に動かせるようになってる。 →これがDOM操作! なぜJSがフロントで必要??
範囲を先取りする。
御清聴ありがとうございました