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
The future of JavaScript
Search
dherman
September 27, 2011
Programming
6
2.4k
The future of JavaScript
I've seen the future of JavaScript, and it's AMAZING
dherman
September 27, 2011
Tweet
Share
More Decks by dherman
See All by dherman
Rust + Node = Neon
dherman
1
320
Evolving the World's Most Popular Programming Language
dherman
0
650
Closing iterators
dherman
0
770
A better future for comprehensions
dherman
0
2k
Evolution is Awesome
dherman
0
550
Status Report: ES6 Modules
dherman
16
3.9k
Discussion with TC39 about the semantics of symbols
dherman
1
400
September 2013 Modules Status Update
dherman
2
1.2k
Rust: low-level programming without the segfaults
dherman
13
9k
Other Decks in Programming
See All in Programming
Dissecting and Reconstructing Ruby Syntactic Structures
ydah
1
770
Building a macOS screen saver with Kotlin (Android Makers 2025)
zsmb
1
160
note の Elasticsearch 更新系を支える技術
tchov
0
110
Memory API : Patterns, Performance et Cas d'Utilisation
josepaumard
0
140
AIコーディングワークフローの試行 〜AIエージェント×ワークフローでの自動化を目指して〜
rkaga
3
3.7k
Make Parsers Compatible Using Automata Learning
makenowjust
2
5.2k
Boost Your Performance and Developer Productivity with Jakarta EE 11
ivargrimstad
0
150
新しいPHP拡張モジュールインストール方法「PHP Installer for Extensions (PIE)」を使ってみよう!
cocoeyes02
0
410
The Evolution of the CRuby Build System
kateinoigakukun
0
720
個人開発の学生アプリが企業譲渡されるまで
akidon0000
0
840
Rollupのビルド時間高速化によるプレビュー表示速度改善とバンドラとASTを駆使したプロダクト開発の難しさ
plaidtech
PRO
1
180
状態と共に暮らす:ステートフルへの挑戦
ypresto
2
750
Featured
See All Featured
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
23
2.6k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
47
2.7k
Why You Should Never Use an ORM
jnunemaker
PRO
55
9.3k
Building a Modern Day E-commerce SEO Strategy
aleyda
40
7.2k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
13
680
What's in a price? How to price your products and services
michaelherold
245
12k
The World Runs on Bad Software
bkeepers
PRO
67
11k
Speed Design
sergeychernyshev
29
900
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
135
33k
The Pragmatic Product Professional
lauravandoore
33
6.5k
BBQ
matthewcrist
88
9.6k
It's Worth the Effort
3n
184
28k
Transcript
I HAVE SEEN THE FUTURE OF JAVASCRIPT AND IT’S AMAZING
Hi, I’m dherman @littlecalculist
I — JavaScript and I love the language it almost
is...
None
None
POWER
Bits, bytes and blobs binary file and network I/O
var Point2D = new StructType({ x: uint32,
y: uint32 }); var Color = new StructType({ r: uint8, g: uint8, b: uint8 });
var Pixel = new StructType({ point: Point2D,
color: Color }); var Triangle = new ArrayType(Pixel, 3);
new Triangle([ { point: { x: 0,
y: 0 }, color: { r: 255, g: 255, b: 255 } }, { point: { x: 5, y: 5 }, color: { r: 128, g: 0, b: 0 } }, { point: { x: 10, y: 0 }, color: { r: 0, g: 0, b: 128 } } ])
Keep off my property private names
function Container() { var secret = 3;
this.service = function() { if (secret-‐-‐) { ... } }; }
var key = Name.create("secret"); function Container() { this[key] = 3
} Container.prototype = { service: function() { if (this[key]-‐-‐) { ... } } };
var markers = new WeakMap(); var tile = new Tile(...);
var results = [...]; tiles.set(tile, results);
var obj = Proxy.create({ get: function(...) {
... }, set: function(...) { ... }, delete: function(...) { ... }, ... }, proto);
Callbacks: the new goto? (well, no, but... still.)
Pour 1/2 cup water into pan. When you’re done: Bring
water to boil. When that’s done: Lower heat and add rice. After 15 minutes: Turn off heat and serve.
pan.pourWater(function() { range.bringToBoil(function() {
range.lowerHeat(function() { pan.addRice(function() { setTimeout(function() { range.turnOff(); serve(); }, 15 * 60 * 1000); }); }); }); });
pan.pourWater(function() { range.bringToBoil(function() {
range.lowerHeat(function() { pan.addRice(function() { setTimeout(function() { range.turnOff(); serve(); }, 15 * 60 * 1000); }); }); }); }); pyramid of doom
generators a.k.a. coroutines a.k.a. Interruptible functions
function* g() { yield 1;
yield 2; } var obj = g(); obj.next(); // 1 obj.next(); // 2
var task = new Task(function*() { var
text = yield XHR("file.txt"); yield timeout(1000); status.innerHTML = text; }); task.start();
Great languages deserve great libraries and that means modules
None
browser <script></script>
var Collections = (function() { function Dictionary()
{ ... } return { Dictionary: Dictionary }; })();
“The human compiler, at work.” — Paul Graham
module Collections { export function Dictionary() {
... } }
import { $ } from "jquery.js"; import { map, each
} from "underscore.js";
import { $ } from "jquery.js"; import { map, each
} from "underscore.js"; loaded once, before execution
Expressiveness artwork credit: sam flores
Death of a thousand cuts typeof null === "object" //
wtfjs? arguments isn’t an Array #$@?! var hoisting
function f(i, j, ...rest) { return rest.slice(i,
j); }
array.push(thing1, thing2, ...moarThings); var shape = new Shape(...points);
function img(src, width=320, height=240) { ... }
for (i = 0; i < a.length; i++) {
let x = a[i]; x.onclick = function() { x.toggle() }; }
for (i = 0; i < a.length; i++) {
let x = a[i]; x.onclick = function() { x.toggle() }; } block scoped
var { r, g, b } = thing.color; var [x,
y] = circle.center; [a, b] = [b, a];
var obj = { foo: "foo",
bar() { return this.foo }, [getName()]: 17 };
for (x in [3, 4, 5])
// 0, 1, 2 (d’oh) for (x of [3, 4, 5]) // 3, 4, 5 for (x of keys(o)) // keys in o for (x of values(o)) // values of o for ([k, v] of items(o)) // props of o
import iterate from "@iter"; obj[iterate] = function() {
return { next: function() { ... } } } for (x of obj) { ... }
[ x * y for (x of obj1) for (y
of obj2) ]
"<p>\nohai, " + firstName + " " + lastName +
"\n</p>"
`<p> ohai, ${firstName} ${lastName} </p>`
safeHTML`<p> ohai, ${firstName} ${lastName} </p>`
How soon is now?
We (Ecma) are working hard and fast on the spec.
We (vendors) will ship features before the spec is done. Transpilers as language shims: Traceur, Narcissus
None