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
130
JavaScriptのセンターピン
yosi
August 08, 2022
Tweet
Share
More Decks by yosi
See All by yosi
自社開発のエンジニアの私が 大事にしてること(n=1)
yoshisan
1
49
なるほどGit講座 (追跡ブランチが理解できます!)
yoshisan
0
170
「自分の時間を生きる」キャリア論
yoshisan
1
97
小学生でもわかる SlackAPI×GAS
yoshisan
0
100
達人プログラマーになろう!
yoshisan
0
110
認証認可
yoshisan
1
120
オブジェクト指向が"チョットワカル"スライド
yoshisan
0
110
Linuxについて"ほんのチョットワカル"スライド
yoshisan
1
100
Let's React!! "チョットワカル"の第一歩
yoshisan
1
180
Other Decks in Programming
See All in Programming
Lambda(Python)の リファクタリングが好きなんです
komakichi
3
190
小田原でみんなで一句詠みたいな #phpcon_odawara
stefafafan
0
330
On-the-fly Suggestions of Rewriting Method Deprecations
ohbarye
1
1.8k
Qiita Bash
mercury_dev0517
2
200
タイムゾーンの奥地は思ったよりも闇深いかもしれない
suguruooki
1
640
Road to RubyKaigi: Making Tinny Chiptunes with Ruby
makicamel
4
120
AI Agents with JavaScript
slobodan
0
230
ComposeでWebアプリを作る技術
tbsten
0
110
Rollupのビルド時間高速化によるプレビュー表示速度改善とバンドラとASTを駆使したプロダクト開発の難しさ
plaidtech
PRO
1
170
Enterprise Web App. Development (1): Build Tool Training Ver. 5
knakagawa
1
110
SwiftUI API Design Lessons
niw
1
280
Deoptimization: How YJIT Speeds Up Ruby by Slowing Down / RubyKaigi 2025
k0kubun
0
790
Featured
See All Featured
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
8
660
A better future with KSS
kneath
239
17k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
Become a Pro
speakerdeck
PRO
27
5.3k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
29
1.6k
Unsuck your backbone
ammeep
670
57k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
280
13k
Building Adaptive Systems
keathley
41
2.5k
Reflections from 52 weeks, 52 projects
jeffersonlam
349
20k
4 Signs Your Business is Dying
shpigford
183
22k
Side Projects
sachag
452
42k
Optimising Largest Contentful Paint
csswizardry
36
3.2k
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がフロントで必要??
範囲を先取りする。
御清聴ありがとうございました