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
Fast Forward Javascript
Search
Sho Kusano
October 16, 2012
Programming
680
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Fast Forward Javascript
立ち止まってる暇なんてない。 CoffeeScript の紹介です。
Sho Kusano
October 16, 2012
More Decks by Sho Kusano
See All by Sho Kusano
ISUCON 反省会
rosylilly
1
350
ISUCON 夏祭り 2023 ハンズオン資料
rosylilly
1
6.7k
今日から始めるリアルタイム配信の裏側
rosylilly
10
9.1k
ISUCON12 事前講習
rosylilly
6
17k
BURST #0
rosylilly
1
280
ISUCON 11 Prior
rosylilly
9
18k
ISUCON 夏期講習 2020
rosylilly
7
11k
真剣.js / shinken-js
rosylilly
1
4.4k
Sustainable Operation
rosylilly
2
3.8k
Other Decks in Programming
See All in Programming
メールのエイリアス機能を履き違えない
isshinfunada
0
230
【やさしく解説 設計編・中級 #4】ルールの寿命と、システムの年輪
panda728
PRO
2
180
『コードを書く以外の』エンジニアリング〜課金基盤移行プロジェクト推進のためのTips4選
yuriko1211
0
590
Terraform標準の組織で AWS CDKをどう使うか
mu7889yoon
1
490
React本体のコードリーディング
high_g_engineer
1
140
仕様駆動開発へのトライを機に チームに適合する手法を模索し続けている話
freee
PRO
0
450
プロポーザルを書いてもらう
pvcresin
0
280
【QA Test Talk Vol.8】AI-DLC による Whole Team Approach の加速
pkshadeck
PRO
0
120
Claude Code全社展開のためにやったことn選~プラグイン302個・コミッター271人を支えるために~
kenchan
5
1.4k
PHP初心者セッション2026 〜生成AIでは見えない裏側を知る:今だからLAMPを通して仕組みを学ぶ〜
kashioka
0
860
AI時代、エンジニアはどう育つのか -未経験エンジニアの成長を間近で見て考えたこと-
thasu0123
0
220
【やさしく解説 設計編・中級 #1】一つの車に、運転手は一人 ~ある倉庫システムの事例から~
panda728
PRO
0
210
Featured
See All Featured
Facilitating Awesome Meetings
lara
57
7.1k
Building a A Zero-Code AI SEO Workflow
portentint
PRO
0
660
Skip the Path - Find Your Career Trail
mkilby
1
180
Designing Experiences People Love
moore
143
24k
Imperfection Machines: The Place of Print at Facebook
scottboms
270
14k
The State of eCommerce SEO: How to Win in Today's Products SERPs - #SEOweek
aleyda
2
11k
The innovator’s Mindset - Leading Through an Era of Exponential Change - McGill University 2025
jdejongh
PRO
1
230
Fantastic passwords and where to find them - at NoRuKo
philnash
52
3.8k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
49
10k
Art, The Web, and Tiny UX
lynnandtonic
304
22k
The Cost Of JavaScript in 2023
addyosmani
55
10k
The Hidden Cost of Media on the Web [PixelPalooza 2025]
tammyeverts
2
440
Transcript
Forward Fast Javascript Sho Kusano / rosylilly
Profile Sho Kusano rosylilly Facebook: sho.kusano Twitter: rosylilly Mail:
[email protected]
Profile Works Dwango/Qteras Model (স) 10/28(Fri) Numero Tokyo
―― Too Many Works ࣄࣺͯΔ΄Ͳ͋Δ
Q. Javascript͕؆୯ͩͱࢥ͏ํ ஏ͔͕ͣ͠ΒͣڍखΛ͓ئ͍͠·͢
A. ʹͱ͍ͬͯ͠ Ͱ͖ΔݶΓॻ͖ͨ͘ͳ͍
ָ͕ग़དྷΕͦΕ͕Ұ൪
ָͯ͠ ͓͕ۚ ཉ͍͠
CoffeeScript is a little language that compiles into JavaScript. http://coffeescript.org/
Fast Forward Javascript ߴʹ લਐΉͨΊͷ CoffeeScript
Javascript ʹ᠘͕ଟ͍ this scope, Prototypical Object, Object forEach
ʰલਐ͢Δ͜ͱʱʹूதग़དྷͳ͍
Let’s try CoffeeScript!
Example Cases
Example Case: This binding var object = { name: 'obj',
func: function(){ console.log(this.name); } } object.func(); // → obj var f = object.func; f(); // → undefined var other = {name: 'other', func: f}; other.func(); // → other
Example Case: This Binding class Example name: 'obj' func: ()=>
console.log @name object = new Example object.func() # → obj f = object.func f() # → obj other = { name: 'other' func: f } other.func() # → obj
Example Case: Prototypical Object var Abstruct = function() { this.prop
= 'property'; } Abstruct.prototype.func = function(){}; var Class = function() { } Class.prototype = {}; for(var method in Abstruct.prototype) { Class.prototype[method] = Abstruct.prototype[method]; }
Example Case: Prototypical Object class Abstruct prop: 'property' func: ()->
class Class extends Abstruct
Example Case: Object forEach var object = { a: 1,
b: 2, c: 3 } for(var key in object) { if(object.hasOwnProperty(key)) console.log(object[key]); }
Example Case: Object forEach object = { a: 1 b:
2, c: 3 } for key, val of object console.log val
Many Features! Destructuring Assignment, Function binding, Embedded JavaScript, Switch/When/Else, Try/Catch/Finally,
Chained Comparisons, String Interpolation, Block Strings, and Block Comments, Block Regular Expressions, Cake, and Cakefiles, "text/coffeescript" Script Tags
Don’t worry!!
֮͑Δͷ͕େมͦ͏... Javascript Ͱۤ͠Ή࣌ؒͱ CoffeeScript Λ֮͑Δ࣌ؒ ͲͪΒ͕͍͔ ↓
͏Ұݸݴޠ֮͑Δͷͪΐͬͱ…… ͋͘·Ͱ JS ͷγϯλοΫεγϡΨʔͱ ଊ͑ͯΑ͍ (JSX, HeXe ͳͲͱൺͯ) ↓
ಋೖ͕େมͦ͏…… Rails3 ͕ WebFront ͳΒࠓ͔Β͑·͢ɻ ͦͷଞɺ Coffee ͔Β JS ʹมͰ͖Δ͠
ϒϥβ্Ͱ Coffee ಈ͔͢Έ͋Δ ↓
ϝϯόʔͷઆಘ͕…… ͕ࣗࣾͰΤϰΝϯδΣϦετʹͳΔνϟϯεʂ ↓
Thank you for listening. rosylilly Fin Fast Forward Javascript