Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Speaker Deck
PRO
Sign in
Sign up for free
The future of JavaScript
dherman
September 27, 2011
Programming
6
2.3k
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
270
Evolving the World's Most Popular Programming Language
dherman
0
490
Closing iterators
dherman
0
550
A better future for comprehensions
dherman
0
1.7k
Evolution is Awesome
dherman
0
290
Status Report: ES6 Modules
dherman
16
3.6k
Discussion with TC39 about the semantics of symbols
dherman
1
310
September 2013 Modules Status Update
dherman
2
690
Rust: low-level programming without the segfaults
dherman
13
8.5k
Other Decks in Programming
See All in Programming
フロントエンドで 良いコードを書くために
t_keshi
3
1.7k
SwiftPMのPlugin入門 / introduction_to_swiftpm_plugin
uhooi
2
110
Refactor with using `available` and `deprecated`
417_72ki
3
380
Swift Expression Macros: a practical introduction
kishikawakatsumi
2
740
tidy_rpart
bk_18
0
610
Remote SSHで行うVS Codeリモートホスト開発とトラブルシューティング
smt7174
1
520
爆速の日経電子版開発の今
shinyaigeek
2
660
10年以上続くプロダクトの フロントエンド刷新プロジェクトのふりかえり
yotahada3
2
360
フロントエンドで学んだことをデータ分析で使ってみた話
daichi_igarashi
0
190
Prácticas de Seguridad en Kubernetes
pablokbs
0
130
Hatena Engineer Seminar #23「新卒研修で気軽に『ありがとう』を伝え合える Slack アプリを開発した話」
slashnephy
0
390
OIDC仕様に準拠した Makuake ID連携基盤構築の裏側
ymtdzzz
0
590
Featured
See All Featured
Navigating Team Friction
lara
177
12k
Designing for humans not robots
tammielis
245
24k
Statistics for Hackers
jakevdp
785
210k
Bash Introduction
62gerente
601
210k
4 Signs Your Business is Dying
shpigford
171
20k
Done Done
chrislema
178
15k
Intergalactic Javascript Robots from Outer Space
tanoku
261
26k
Designing for Performance
lara
600
65k
Rebuilding a faster, lazier Slack
samanthasiow
69
7.6k
Why You Should Never Use an ORM
jnunemaker
PRO
49
7.9k
5 minutes of I Can Smell Your CMS
philhawksworth
198
18k
Imperfection Machines: The Place of Print at Facebook
scottboms
254
12k
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 #
[email protected]
?! 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