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
120
JavaScriptのセンターピン
yosi
August 08, 2022
Tweet
Share
More Decks by yosi
See All by yosi
自社開発のエンジニアの私が 大事にしてること(n=1)
yoshisan
1
45
なるほどGit講座 (追跡ブランチが理解できます!)
yoshisan
0
170
「自分の時間を生きる」キャリア論
yoshisan
1
94
小学生でもわかる SlackAPI×GAS
yoshisan
0
100
達人プログラマーになろう!
yoshisan
0
110
認証認可
yoshisan
1
120
オブジェクト指向が"チョットワカル"スライド
yoshisan
0
110
Linuxについて"ほんのチョットワカル"スライド
yoshisan
1
96
Let's React!! "チョットワカル"の第一歩
yoshisan
1
170
Other Decks in Programming
See All in Programming
ARA Ansible for the teams
kksat
0
150
仕様変更に耐えるための"今の"DRY原則を考える / Rethinking the "Don't repeat yourself" for resilience to specification changes
mkmk884
0
170
AWS Organizations で実現する、 マルチ AWS アカウントのルートユーザー管理からの脱却
atpons
0
150
Boost Performance and Developer Productivity with Jakarta EE 11
ivargrimstad
0
270
Amazon Bedrock Multi Agentsを試してきた
tm2
1
290
2,500万ユーザーを支えるSREチームの6年間のスクラムのカイゼン
honmarkhunt
6
5.3k
2024年のWebフロントエンドのふりかえりと2025年
sakito
2
250
ファインディの テックブログ爆誕までの軌跡
starfish719
2
1.1k
責務と認知負荷を整える! 抽象レベルを意識した関心の分離
yahiru
2
450
一休.com のログイン体験を支える技術 〜Web Components x Vue.js 活用事例と最適化について〜
atsumim
0
480
Honoのおもしろいミドルウェアをみてみよう
yusukebe
1
210
Unity Android XR入門
sakutama_11
0
160
Featured
See All Featured
Typedesign – Prime Four
hannesfritz
40
2.5k
Build The Right Thing And Hit Your Dates
maggiecrowley
34
2.5k
Gamification - CAS2011
davidbonilla
80
5.1k
jQuery: Nuts, Bolts and Bling
dougneiner
63
7.6k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
12
960
Java REST API Framework Comparison - PWX 2021
mraible
28
8.4k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
40
2k
How GitHub (no longer) Works
holman
314
140k
The Invisible Side of Design
smashingmag
299
50k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
356
29k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
666
120k
GraphQLの誤解/rethinking-graphql
sonatard
68
10k
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がフロントで必要??
範囲を先取りする。
御清聴ありがとうございました