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
100
JavaScriptのセンターピン
yosi
August 08, 2022
Tweet
Share
More Decks by yosi
See All by yosi
自社開発のエンジニアの私が 大事にしてること(n=1)
yoshisan
1
34
なるほどGit講座 (追跡ブランチが理解できます!)
yoshisan
0
150
「自分の時間を生きる」キャリア論
yoshisan
1
88
小学生でもわかる SlackAPI×GAS
yoshisan
0
93
達人プログラマーになろう!
yoshisan
0
100
認証認可
yoshisan
1
110
オブジェクト指向が"チョットワカル"スライド
yoshisan
0
100
Linuxについて"ほんのチョットワカル"スライド
yoshisan
1
84
Let's React!! "チョットワカル"の第一歩
yoshisan
1
150
Other Decks in Programming
See All in Programming
最近追加した型の紹介とその振り返り
aki19035vc
0
170
Activities at Cairo Library
cairolibrary720
0
1.2k
Google's Recipe for Scaling (Web) Security – LocoMocoSec 2024
lweichselbaum
0
170
CSC307 Lecture 09
javiergs
PRO
1
500
GraphQL はいいぞ! ~Laravel で学ぶ GraphQL 入門~
azuki
1
160
Xcode 16のPreviewModifierと@Previewableを活用した効率的なプレビュー方法の考察
ojun9
2
160
Clean Architecture by TypeScript & NestJS
ryounasso
0
150
スクラムマスターって孤独じゃないですか?
yoshitaroyoyo
1
140
SDCon2024: Enabling DevOps and Team Topologies thru architecture: architecting for fast flow
cer
PRO
0
780
SRE チーム立ち上げ前に考えたこと・取り組んだこと / Considerations and Preparations Before Establishing an SRE Team
mackey0225
3
320
社内 LT 会を発足し、アウトプット文化を醸成させるために考えたこと・やったこと / Starting internal LT meetings and fostering an output culture
mackey0225
3
120
ドメイン駆動設計の実践
masuda220
PRO
17
5.1k
Featured
See All Featured
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
149
45k
Bash Introduction
62gerente
607
210k
A designer walks into a library…
pauljervisheath
201
24k
Design by the Numbers
sachag
277
18k
Code Review Best Practice
trishagee
58
16k
How STYLIGHT went responsive
nonsquared
93
5k
Gamification - CAS2011
davidbonilla
78
4.9k
Fontdeck: Realign not Redesign
paulrobertlloyd
79
5.1k
Intergalactic Javascript Robots from Outer Space
tanoku
266
26k
Teambox: Starting and Learning
jrom
130
8.6k
Making the Leap to Tech Lead
cromwellryan
127
8.7k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
121
18k
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がフロントで必要??
範囲を先取りする。
御清聴ありがとうございました