Upgrade to PRO for Only $50/Year—Limited-Time Offer! 🔥
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
JavaScriptのセンターピン
Search
yosi
August 08, 2022
Programming
0
140
JavaScriptのセンターピン
yosi
August 08, 2022
Tweet
Share
More Decks by yosi
See All by yosi
自社開発のエンジニアの私が 大事にしてること(n=1)
yoshisan
1
63
なるほどGit講座 (追跡ブランチが理解できます!)
yoshisan
0
190
「自分の時間を生きる」キャリア論
yoshisan
1
100
小学生でもわかる SlackAPI×GAS
yoshisan
0
110
達人プログラマーになろう!
yoshisan
0
120
認証認可
yoshisan
1
140
オブジェクト指向が"チョットワカル"スライド
yoshisan
0
120
Linuxについて"ほんのチョットワカル"スライド
yoshisan
1
120
Let's React!! "チョットワカル"の第一歩
yoshisan
1
200
Other Decks in Programming
See All in Programming
モデル駆動設計をやってみようワークショップ開催報告(Modeling Forum2025) / model driven design workshop report
haru860
0
280
ローカルLLMを⽤いてコード補完を⾏う VSCode拡張機能を作ってみた
nearme_tech
PRO
0
150
AIコーディングエージェント(Manus)
kondai24
0
210
生成AI時代を勝ち抜くエンジニア組織マネジメント
coconala_engineer
0
610
AI Agent Tool のためのバックエンドアーキテクチャを考える #encraft
izumin5210
3
1.1k
Rubyで鍛える仕組み化プロヂュース力
muryoimpl
0
160
著者と進める!『AIと個人開発したくなったらまずCursorで要件定義だ!』
yasunacoffee
0
160
ELYZA_Findy AI Engineering Summit登壇資料_AIコーディング時代に「ちゃんと」やること_toB LLMプロダクト開発舞台裏_20251216
elyza
2
590
クラウドに依存しないS3を使った開発術
simesaba80
0
150
大規模Cloud Native環境におけるFalcoの運用
owlinux1000
0
190
Findy AI+の開発、運用におけるMCP活用事例
starfish719
0
1.7k
Jetpack XR SDKから紐解くAndroid XR開発と技術選定のヒント / about-androidxr-and-jetpack-xr-sdk
drumath2237
1
190
Featured
See All Featured
Balancing Empowerment & Direction
lara
5
820
Done Done
chrislema
186
16k
Amusing Abliteration
ianozsvald
0
69
BBQ
matthewcrist
89
9.9k
State of Search Keynote: SEO is Dead Long Live SEO
ryanjones
0
69
Stop Working from a Prison Cell
hatefulcrawdad
273
21k
Redefining SEO in the New Era of Traffic Generation
szymonslowik
1
160
The Curious Case for Waylosing
cassininazir
0
190
From Legacy to Launchpad: Building Startup-Ready Communities
dugsong
0
110
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
17k
Tips & Tricks on How to Get Your First Job In Tech
honzajavorek
0
400
Lightning talk: Run Django tests with GitHub Actions
sabderemane
0
92
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がフロントで必要??
範囲を先取りする。
御清聴ありがとうございました