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 - From DHTML to a Multi-Paradigm Lan...
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
Robert Vogt
September 23, 2016
Technology
0
420
JavaScript - From DHTML to a Multi-Paradigm Language
Robert Vogt
September 23, 2016
Tweet
Share
More Decks by Robert Vogt
See All by Robert Vogt
React Native — Webnesday #9
deniaz
1
420
Hands On: React Native
deniaz
0
380
ADR Lightning Talk
deniaz
0
410
Other Decks in Technology
See All in Technology
Exadata Database Service on Dedicated Infrastructure(ExaDB-D) UI スクリーン・キャプチャ集
oracle4engineer
PRO
8
7.2k
EMからVPoEを経てCTOへ:マネジメントキャリアパスにおける葛藤と成長
kakehashi
PRO
9
1.6k
作りっぱなしで終わらせない! 価値を出し続ける AI エージェントのための「信頼性」設計 / Designing Reliability for AI Agents that Deliver Continuous Value
aoto
PRO
2
270
[JAWSDAYS2026]Who is responsible for IAM
mizukibbb
0
350
DevOpsエージェントで実現する!! AWS Well-Architected(W-A) を実現するシステム設計 / 20260307 Masaki Okuda
shift_evolve
PRO
3
500
白金鉱業Meetup_Vol.22_Orbital Senseを支える衛星画像のマルチモーダルエンベディングと地理空間のあいまい検索技術
brainpadpr
2
290
[JAWS DAYS 2026]私の AWS DevOps Agent 推しポイント
furuton
0
140
AIファーストを前提とした開発スタイルの変化
sbtechnight
0
280
タスク管理も1on1も、もう「管理」じゃない ― KiroとBedrock AgentCoreで変わった"判断の仕事"
yusukeshimizu
5
2.5k
最強のAIエージェントを諦めたら品質が上がった話 / how quality improved after giving up on the strongest AI agent
kt2mikan
0
130
OCI技術資料 : コンピュート・サービス 概要
ocise
4
54k
クラウド × シリコンの Mashup - AWS チップ開発で広がる AI 基盤の選択肢
htokoyo
2
170
Featured
See All Featured
Joys of Absence: A Defence of Solitary Play
codingconduct
1
300
Agile that works and the tools we love
rasmusluckow
331
21k
SEO in 2025: How to Prepare for the Future of Search
ipullrank
3
3.4k
Digital Projects Gone Horribly Wrong (And the UX Pros Who Still Save the Day) - Dean Schuster
uxyall
0
660
What does AI have to do with Human Rights?
axbom
PRO
1
2k
Optimizing for Happiness
mojombo
378
71k
Hiding What from Whom? A Critical Review of the History of Programming languages for Music
tomoyanonymous
2
530
Marketing Yourself as an Engineer | Alaka | Gurzu
gurzu
0
150
Digital Ethics as a Driver of Design Innovation
axbom
PRO
1
210
Into the Great Unknown - MozCon
thekraken
40
2.3k
A Soul's Torment
seathinner
5
2.4k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
55
3.3k
Transcript
JavaScript From DHTML to a Multi-Paradigm Language Robert Vogt #NCamp16
Robert Vogt Software Engineer from & in Sankt Gallen @_deniaz
None
«Web 2.0 describes World Wide Web websites that emphasize user-generated
content, usability, and interoperability for end users.»
jQuery MooTools Prototype JS script.aculo.us
Single-page application
Angular React Object-Oriented Functional
None
JavaScript
«A programming paradigm is a style or way of programming.
Some languages make it easy to write in some paradigms but not others.»
«Object-oriented programming is a programming language model organized around objects
rather than actions and data rather than logic.»
class Dog extends Animal {} let dog = new Dog();
dog.walk();
let Animal = { walk: function() {} }; let Dog
= Object.create(Animal); Dog.bark = function() { return ‘Woof!’; };
Class-based Inheritance Prototypical Inheritance
«Functional Programming is a programming paradigm that treats computation as
the evaluation of mathematical functions and avoids changing-state and mutable data.»
Functions First-Class
let sum = function(a, b) { return a + b;
}
Functions Higher-Order
$.get( 'http://example.com', (data) => { /* Success! */ } );
function createPrinter(a, b) { return function() { return ‘Namics’; }
} const print = createPrinter(); print(); // Namics.
Functions Pure
let double = (x) = x * 2;
Closures Function
let incrementer = (function() { let _value = 0; return
() => ++_value; })(); incrementer(); // 1 incrementer(); // 2 incrementer(); // 3
Data Immutable
const list1 = Immutable.List.of(1, 2); const list2 = list1.push(3, 4,
5);
Composition Function
let ten = double(sum(2, 3));
Soooo… Any Real World Examples?
None
Store View Action Action Dispatcher
const HelloMessage = (props) => ( <div>Hello {props.name}</div> );
«Those who are unaware they are walking in darkness will
never seek light.» — Bruce Lee find me on twitter @_deniaz