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
1
590
Fast Forward Javascript
立ち止まってる暇なんてない。 CoffeeScript の紹介です。
Sho Kusano
October 16, 2012
Tweet
Share
More Decks by Sho Kusano
See All by Sho Kusano
ISUCON 反省会
rosylilly
0
210
ISUCON 夏祭り 2023 ハンズオン資料
rosylilly
1
6.1k
今日から始めるリアルタイム配信の裏側
rosylilly
10
7.5k
ISUCON12 事前講習
rosylilly
6
13k
BURST #0
rosylilly
1
190
ISUCON 11 Prior
rosylilly
10
17k
ISUCON 夏期講習 2020
rosylilly
7
10k
真剣.js / shinken-js
rosylilly
1
3.8k
Sustainable Operation
rosylilly
2
3.4k
Other Decks in Programming
See All in Programming
3rd party scriptでもReactを使いたい! Preact + Reactのハイブリッド開発
righttouch
PRO
1
610
OnlineTestConf: Test Automation Friend or Foe
maaretp
0
120
Jakarta EE meets AI
ivargrimstad
0
670
Nurturing OpenJDK distribution: Eclipse Temurin Success History and plan
ivargrimstad
0
960
AI時代におけるSRE、 あるいはエンジニアの生存戦略
pyama86
6
1.2k
3 Effective Rules for Using Signals in Angular
manfredsteyer
PRO
0
120
聞き手から登壇者へ: RubyKaigi2024 LTでの初挑戦が 教えてくれた、可能性の星
mikik0
1
130
Enabling DevOps and Team Topologies Through Architecture: Architecting for Fast Flow
cer
PRO
0
340
距離関数を極める! / SESSIONS 2024
gam0022
0
290
Kaigi on Rails 2024 〜運営の裏側〜
krpk1900
1
240
RubyLSPのマルチバイト文字対応
notfounds
0
120
Figma Dev Modeで変わる!Flutterの開発体験
watanave
0
140
Featured
See All Featured
Rails Girls Zürich Keynote
gr2m
94
13k
Optimising Largest Contentful Paint
csswizardry
33
2.9k
Keith and Marios Guide to Fast Websites
keithpitt
409
22k
Ruby is Unlike a Banana
tanoku
97
11k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
229
52k
Mobile First: as difficult as doing things right
swwweet
222
8.9k
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
Rebuilding a faster, lazier Slack
samanthasiow
79
8.7k
Designing on Purpose - Digital PM Summit 2013
jponch
115
7k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.3k
The Cult of Friendly URLs
andyhume
78
6k
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