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
JSのクラスの後ろ向きな話
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
U76NER
July 08, 2022
Programming
0
130
JSのクラスの後ろ向きな話
U76NER
July 08, 2022
Tweet
Share
More Decks by U76NER
See All by U76NER
GASええやん
u76ner
1
96
競プロへの誘 -いざな-
u76ner
0
960
mockdateええやん
u76ner
0
310
Other Decks in Programming
See All in Programming
猫の手も借りたい!ので AIエージェント猫を作って社内に放した話 Claude Code × Container Lambda の Slack Bot "DevNeko"
naramomi7
0
260
AI主導でFastAPIのWebサービスを作るときに 人間が構造化すべき境界線
okajun35
0
700
Ruby and LLM Ecosystem 2nd
koic
1
540
GC言語のWasm化とComponent Modelサポートの実践と課題 - Scalaの場合
tanishiking
0
110
ベクトル検索のフィルタを用いた機械学習モデルとの統合 / python-meetup-fukuoka-06-vector-attr
monochromegane
2
390
コードレビューをしない選択 #でぃーぷらすトウキョウ
kajitack
3
890
クライアントワークでSREをするということ。あるいは事業会社におけるSREと同じこと・違うこと
nnaka2992
1
330
株式会社 Sun terras カンパニーデック
sunterras
0
2.1k
エラーログのマスキングの仕組みづくりに役立ったASTの話
kumoichi
0
180
What Spring Developers Should Know About Jakarta EE
ivargrimstad
0
390
AI時代のソフトウェア開発でも「人が仕様を書く」から始めよう-医療IT現場での実践とこれから
koukimiura
0
140
エンジニアの「手元の自動化」を加速するn8n 2026.02.27
symy2co
0
140
Featured
See All Featured
Dominate Local Search Results - an insider guide to GBP, reviews, and Local SEO
greggifford
PRO
0
99
XXLCSS - How to scale CSS and keep your sanity
sugarenia
249
1.3M
WCS-LA-2024
lcolladotor
0
480
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
287
14k
StorybookのUI Testing Handbookを読んだ
zakiyama
31
6.6k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
52
5.9k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
38
2.8k
Claude Code どこまでも/ Claude Code Everywhere
nwiizo
64
53k
AI in Enterprises - Java and Open Source to the Rescue
ivargrimstad
0
1.2k
JAMstack: Web Apps at Ludicrous Speed - All Things Open 2022
reverentgeek
1
390
Bash Introduction
62gerente
615
210k
Build The Right Thing And Hit Your Dates
maggiecrowley
39
3.1k
Transcript
1 LT会(仮) 2022/07/08 u76ner JSのクラスの 後ろ向きな話 1
- 先週輪読会でクラスの章を読んだ - 古い書き方とかを見つつ、JavaScriptのクラスをざっくり紐解こう という趣旨 - たぶん実務に役立つことはないネタ - (付け焼き刃なので不正確な部分があるかも) 2
はじめに
- もともとJavaScriptにクラスという概念はない - 語弊がありそうだけど - 無理やりJavaScriptでクラスを表現していた歴史がある - 期待に応えて(?)、ES6(ES2015)でclass構文が追加された 3 JSにおけるクラスの歴史
- オブジェクト指向 - Class-based - Prototype-based 4 JSにクラスはない?
- Class-based(Wikipedia) - クラス(ひな型)を用いてオブジェクトを生成する - ひな形であるクラスに注目している 5 JSにクラスはない?
- Class-based(Wikipedia) - クラス(ひな型)を用いてオブジェクトを生成する - ひな形であるクラスに注目している - とてもわかりやすい例 6 JSにクラスはない?
たい焼き器(クラス) たい焼き(インスタンス)
- Prototype-based(Wikipedia) - オブジェクトはすべてオブジェクトから生まれる - クローン元のオブジェクトをプロトタイプという 7 JSにクラスはない?
- Prototype-based(Wikipedia) - オブジェクトはすべてオブジェクトから生まれる - クローン元のオブジェクトをプロトタイプという - とてもわかりやすい例 8 JSにクラスはない?
原初たい焼き(プロトタイプ) クローンたい焼き
- JavaScriptはプロトタイプベース - そもそも言語の思想が違う - そんな中、JavaScriptにおけるクラスは無理やり作られた - たい焼きでたい焼き器を作ったようなもの - (TypeScriptの型はクラスの概念に近いかもね)
9 JSにクラスはない?
10 余談 たい焼き器(天然) たい焼き器(養殖)
- フィールド - ES2015以降 - コンストラクタなし - コンストラクタあり 11 クラスの書き方
- フィールド - ES5以前 - コンストラクタなし - コンストラクタあり 12 クラスの書き方
- メソッド - ES2015以降 13 クラスの書き方
- メソッド - ES5以前 14 クラスの書き方
- メソッド - ES5以前 15 クラスの書き方
- メソッド - ES2015以降 16 クラスの書き方
- メソッド - ES5以前 - 違うオブジェクトのメソッドであり、実体として違うもの - 必要以上にメモリを食ってしまう 17 クラスの書き方
- メソッド - こうしないといけない 18 クラスの書き方 めんどい
- prototype - オブジェクトにプロパティがなかったときに参照しに行く - 実は結構目にしてる 19 クラスの書き方
- MDN Web DocsのArrayのページより 20 クラスの書き方
- class構文のように、 読み書きしやすいように導入された文法のことを 糖衣構文(syntax sugar)という - Wikipedia - 例 -
C言語における p->member は (*p).member の糖衣構文 21 余談2(まじめ)
22 まとめ
23 まとめ 一方、ReactはFunction Componentを使った
24 まとめ 一方、ReactはFunction Componentを使った 人類にクラスという概念は早すぎる(クソデカ主語)