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
IBM Bobを使って、PostgreSQLのToDoアプリをDb2へ変換してみよう/202603_Dojo_Bob
mayumihirano
1
300
EMからICへ、二周目人材としてAI全振りのプロダクト開発で見つけた武器
yug1224
5
520
プロジェクトマネジメントをチームに宿す -ゼロからはじめるチームプロジェクトマネジメントは活動1年未満のチームの教科書です- / 20260304 Shigeki Morizane
shift_evolve
PRO
1
250
事例に見るスマートファクトリーへの道筋〜工場データをAI Readyにする実践ステップ〜
hamadakoji
1
280
us-east-1 に障害が起きた時に、 ap-northeast-1 にどんな影響があるか 説明できるようになろう!
miu_crescent
PRO
13
4.1k
Claude Codeが爆速進化してプラグイン追従がつらいので半自動化した話 ver.2
rfdnxbro
0
490
Claude Code Skills 勉強会 (DevelersIO向けに調整済み) / claude code skills for devio
masahirokawahara
1
14k
白金鉱業Meetup_Vol.22_Orbital Senseを支える衛星画像のマルチモーダルエンベディングと地理空間のあいまい検索技術
brainpadpr
2
290
Oracle Database@Azure:サービス概要のご紹介
oracle4engineer
PRO
4
1.2k
オレ達はAWS管理をやりたいんじゃない!開発の生産性を爆アゲしたいんだ!!
wkm2
4
490
Ultra Ethernet (UEC) v1.0 仕様概説
markunet
3
250
SRE NEXT 2026 CfP レビュアーが語る聞きたくなるプロポーザルとは?
yutakawasaki0911
0
220
Featured
See All Featured
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
25
1.8k
The Illustrated Guide to Node.js - THAT Conference 2024
reverentgeek
1
300
Max Prin - Stacking Signals: How International SEO Comes Together (And Falls Apart)
techseoconnect
PRO
0
110
Music & Morning Musume
bryan
47
7.1k
sira's awesome portfolio website redesign presentation
elsirapls
0
190
The untapped power of vector embeddings
frankvandijk
2
1.6k
End of SEO as We Know It (SMX Advanced Version)
ipullrank
3
4.1k
Lessons Learnt from Crawling 1000+ Websites
charlesmeaden
PRO
1
1.1k
More Than Pixels: Becoming A User Experience Designer
marktimemedia
3
350
Ecommerce SEO: The Keys for Success Now & Beyond - #SERPConf2024
aleyda
1
1.8k
Leveraging LLMs for student feedback in introductory data science courses - posit::conf(2025)
minecr
1
190
技術選定の審美眼(2025年版) / Understanding the Spiral of Technologies 2025 edition
twada
PRO
118
110k
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