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
150
0
Share
JavaScriptのセンターピン
yosi
August 08, 2022
More Decks by yosi
See All by yosi
自社開発のエンジニアの私が 大事にしてること(n=1)
yoshisan
1
81
なるほどGit講座 (追跡ブランチが理解できます!)
yoshisan
0
200
「自分の時間を生きる」キャリア論
yoshisan
1
110
小学生でもわかる SlackAPI×GAS
yoshisan
0
120
達人プログラマーになろう!
yoshisan
0
130
認証認可
yoshisan
1
140
オブジェクト指向が"チョットワカル"スライド
yoshisan
0
130
Linuxについて"ほんのチョットワカル"スライド
yoshisan
1
120
Let's React!! "チョットワカル"の第一歩
yoshisan
1
220
Other Decks in Programming
See All in Programming
最初からAWS CDKで技術検証してもいいんじゃない?
akihisaikeda
4
180
飯MCP
yusukebe
0
450
存在論的プログラミング: 時間と存在を記述する
koriym
5
740
今からFlash開発できるわけないじゃん、ムリムリ! (※ムリじゃなかった!?)
arkw
0
170
野球解説AI Agentを開発してみた - 2026/02/27 LayerX社内LT会資料
shinyorke
PRO
0
380
forteeの改修から振り返るPHPerKaigi 2026
muno92
PRO
3
110
PHPで TLSのプロトコルを実装してみる
higaki_program
0
720
安いハードウェアでVulkan
fadis
1
870
夢の無限スパゲッティ製造機 -実装篇- #phpstudy
o0h
PRO
0
180
20260315 AWSなんもわからん🥲
chiilog
2
180
ロボットのための工場に灯りは要らない
watany
12
3.3k
Everything Claude Code OSS詳細 — 5層構造の中身と導入方法
targe
0
160
Featured
See All Featured
Un-Boring Meetings
codingconduct
0
250
The Illustrated Children's Guide to Kubernetes
chrisshort
51
52k
The Spectacular Lies of Maps
axbom
PRO
1
670
コードの90%をAIが書く世界で何が待っているのか / What awaits us in a world where 90% of the code is written by AI
rkaga
61
43k
Statistics for Hackers
jakevdp
799
230k
The SEO Collaboration Effect
kristinabergwall1
0
410
Amusing Abliteration
ianozsvald
1
150
Build your cross-platform service in a week with App Engine
jlugia
234
18k
GraphQLとの向き合い方2022年版
quramy
50
14k
Leo the Paperboy
mayatellez
6
1.6k
Unsuck your backbone
ammeep
672
58k
Mozcon NYC 2025: Stop Losing SEO Traffic
samtorres
0
190
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がフロントで必要??
範囲を先取りする。
御清聴ありがとうございました