Upgrade to Pro — share decks privately, control downloads, hide ads and more …

JavaScriptのセンターピン

Avatar for yosi yosi
August 08, 2022
Programming
0
140

 JavaScriptのセンターピン

Avatar for yosi

yosi

August 08, 2022
Tweet

More Decks by yosi

See All by yosi
自社開発のエンジニアの私が 大事にしてること（n=1）
Avatar for yosi yoshisan
1
60
なるほどGit講座 (追跡ブランチが理解できます！)
Avatar for yosi yoshisan
0
180
「自分の時間を生きる」キャリア論
Avatar for yosi yoshisan
1
100
小学生でもわかる SlackAPI×GAS
Avatar for yosi yoshisan
0
110
達人プログラマーになろう！
Avatar for yosi yoshisan
0
120
認証認可
Avatar for yosi yoshisan
1
130
オブジェクト指向が"チョットワカル"スライド
Avatar for yosi yoshisan
0
120
Linuxについて"ほんのチョットワカル"スライド
Avatar for yosi yoshisan
1
110
Let's React!! "チョットワカル"の第一歩
Avatar for yosi yoshisan
1
200

Other Decks in Programming

See All in Programming
モデル駆動設計をやってみよう Modeling Forum2025ワークショップ/Let’s Try Model-Driven Design
Avatar for haru860 haru860
0
200
無秩序からの脱却 / Emergence from chaos
Avatar for nrs nrslib
1
9.8k
Honoを技術選定したAI要件定義プラットフォームAcsimでの意思決定
Avatar for Tadashi Shigeoka codenote
0
270
Flutterチームから作る組織の越境文化
Avatar for ファインディ株式会社（イベント資料アップ用） findy_eventslides
0
620
Why Kotlin? 電子カルテを Kotlin で開発する理由 / Why Kotlin? at Henry
Avatar for Agata Naomichi agatan
1
130
r2-image-worker
Avatar for Yusuke Wada yusukebe
1
180
Phronetic Team with AI - Agile Japan 2025 closing
Avatar for Kenji Hiranabe hiranabe
2
690
関数の挙動書き換える
Avatar for takato fukui takatofukui
4
750
Reactive Thinking with Signals and the new Resource API
Avatar for Manfred Steyer manfredsteyer
PRO
0
120
GraalVM Native Image トラブルシューティング機能の最新状況（2025年版）
Avatar for NTTドコモソリューションズ　Java担当 ntt_dsol_java
0
170
「正規表現をつくる」をつくる / make "make regex"
Avatar for TSUYUSATO Kitsune makenowjust
1
920
Java_プロセスのメモリ監視の落とし穴_NMT_で見抜けない_glibc_キャッシュ問題_.pdf
Avatar for NTTドコモソリューションズ　Java担当 ntt_dsol_java
0
230

Featured

See All Featured
Music & Morning Musume
Avatar for Bryan Veloso bryan
46
7k
It's Worth the Effort
Avatar for 3n 3n
187
29k
YesSQL, Process and Tooling at Scale
Avatar for Rocio Delgado rocio
174
15k
Why Our Code Smells
Avatar for Brandon Keepers bkeepers
PRO
340
57k
GraphQLとの向き合い方2022年版
Avatar for Yosuke Kurami quramy
49
14k
[RailsConf 2023 Opening Keynote] The Magic of Rails
Avatar for Eileen M. Uchitelle eileencodes
31
9.8k
Java REST API Framework Comparison - PWX 2021
Avatar for Matt Raible mraible
34
9k
[RailsConf 2023] Rails as a piece of cake
Avatar for Vladimir Dementyev palkan
57
6.1k
Docker and Python
Avatar for Tania Allard trallard
46
3.7k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
Avatar for Marc Duiker marcduiker
34
2.3k
Designing for Performance
Avatar for Lara Hogan lara
610
69k
JavaScript: Past, Present, and Future - NDC Porto 2020
Avatar for David Neal reverentgeek
52
5.7k

Transcript

  1. P r e s e n t e d b

    y y o s h i チーム開発。 JavaScriptで いかがでしょう👀？？
  2. None
  3. None

  4. センターピンとは？？ ところで,,,,

  5. 一番効果が望める力点

  6. 一番効果が望める力点

  7. プログラミング言語にも センターピンはございます。

  8. 範囲を先取りする。

  9. 視点 1.HTMLの主要のタグ

  10. JSはHTMLのtagu内のidを基点にしている！ →パターンはある程度決まってる！ どういう時に使われる？ ・フォームの送信(生成・新規作成) ・link移動(非同期通信) ・テーブル(表示一覧) なぜHTML？？

  11. 視点 2.イベントハンドラ

  12. ある特定の操作をトリガー(基点)として動きます。 →この基点がイベントハンドラ！ ・clickした時 ・ボタン状をホバーした時 ・LINKに飛んだ時 etc イベントハンドラ

  13. ある特定の操作を基点として動きます。 →この基点がイベントハンドラ！ JSの主要な要素は全てHTMLのタグが発火箇所にな ります！ イベントハンドラ一覧(抜粋)

  14. 視点 3.関数表記

  15. JSの記述は関数型言語に近い思想になります！ 知っておきたいこと ・オブジェクト指向 ・関数指向 書き方 ・無名関数 ・コールバック関数 なぜ関数？？

  16. 視点 4.DOM操作

  17. ブラウザ側がブラウザAPIは使用する際に JavaScriptをデファクトスタンダードで扱えるように してるから。 JavaScriptでブラウザAPIを動かしています。 その際にブラウザAPI側で書くドキュメントの各要素をオ ブジェクト的に動かせるようになってる。 →これがDOM操作！ なぜJSがフロントで必要？？

  18. ブラウザ側がブラウザAPIは使用する際に JavaScriptをデファクトスタンダードで扱えるように してるから。 JavaScriptでブラウザAPIを動かしています。 その際にブラウザAPI側で書くドキュメントの各要素をオ ブジェクト的に動かせるようになってる。 →これがDOM操作！ なぜJSがフロントで必要？？

  19. 範囲を先取りする。

  20. 御清聴ありがとうございました