SlideShare a Scribd company logo
1 of 27
*
SK Manvendra
* Getting and running it
* Variables
* “Interpolation” and “““Heredocs”””
* Statements
* Functions and Splats…
* Collections, Iterations and Comprehensions
* Classes
* Example app

*
* CoffeeScript is just compiled down JavaScript.
* We can write JS the way it should be…
* CS is just Syntactical Sugar for JS.
JS = -> JavaScript
CS = -> CoffeeScript

However, CS is more
than Syntactical
Sugar

* If you love JS, you’ll love CS…
* Let’s get to know this…

*

This is becoming
BUZZ WORD these
days…
* CS depends on Node.js environment to get

installed. However CS doesn’t need Node.js to
run on the machine.

* How can I install the Node.js?
* After node is installed, use NPM

Perhaps, SUROOR’s blog
may rescue you here…

to install the CS.

* npm install –g coffee-script
Pay attention to “-g”

*

Node Package
Manager
* On command prompt type coffee. It will drop
you in REPL mode.

* Compile a file.
* Compile a folder.
* Putting output in

Read Eval Print
Loop
coffee –c file.coffee

different folder.
coffee –c src/
coffee –c src/ -o lib/

*
* You can get compile your Coffee files to
JavaScript whenever you change them,
automatically!

coffee –cw src/ -o lib/

* The –w switch makes it happen.
-w switch also watches
for subdirectories

*
* White space considerations.
* Indent your code properly.
* No need to use special cartoon
like characters in the code.

* Freedom from that semicolon.
You’ll need me when
writing multiple lines of
code in a single shot

*

CS is very sensitive
towards it
Why would I need to do
so?
Those are really
obstructive

Though I’m optional in JS
* Use of the var keyword is strictly prohibited.
* CoffeeScript saves us from creating global
variables.

* What if I need to create one/more?

Then how would I
create one?

We can attach them to the global window
object.
But be cautious!!!
* “Hope if it prints the value of #{interest}.”
* A multiline string which may have
#{} can contain any
interpolation inside it.

* var regEx = /d{3}-d{8}/
This RegEx could
be worse.

*

valid CoffeeScript
inside the string
Use ””” quotes
that’ll even
preserve the space

regEx = ///
d{3}d{8}
///
* # I’ll not be visible in compiled JavaScript.
* ###
I think I may put the license and the
information here, and it’ll be visible in the
compiled JavaScript.
###

*
Equal or Identical (equal
and of the same type)?

* == or ===
* != or !==
*?

Not equal or Not
identical?
Existential operator

3 Usage
• Variable declarations check
• Object existence
• Is member a method

?
?.
?()

*
CoffeeScript
* is
* isnt
* not
* and
* or
* true, yes, no
* false, no, off
* @, this
* ::
* of
* in

JavaScript
===
!==
!
&&
||
true
false
this
prototype
in
N/A

Word of caution!!!
isnt and is not are
not same

*
alert “true” if var

* if var then alert “true”
* if var then alert “true” else alert “false”

That’s ternary ?:

* unless var then alert “false” else alert “true”
If the condition is
false

*
* switch var
when “val1”, “val2”

We don’t need the break
keyword anymore

when “val3”
else

*
I’ll be parsed to
(function() {});

* ->
Instant function
Though I’m Anonymous
* do ->
calling
* funcName = (param1, param2) -> alert “Hi”
Functions can take default
* someFunc = (param = val) ->
arguments

However if you need, you
can return explicitly
always

If you really don’t want to return
anything at the end of ->, use
return null or return undefined

* I’ll always return the last statement.

*

Hope if I could
call the ->
without params
* Variable number of arguments to the function.
* someFunc = (etc…) ->
Believe me it’s one
of the best aroma
of CoffeeScript

*
* Arrays in CoffeeScript are no different than in
JavaScript.

* Searching.
* Swapping.
[x, y] = [y, x]
* Ranges.
* Slicing arrays.
* Splicing/Replacing array values.

Maximum size
is 21

*
* Creating objects with literal syntax.
* Creating objects from variables.
* Getting and setting attributes.

*

JSON is breeze here
* for val in array
* for key, val of object
own may
come here

Remember the
hasOwnProperty
method?

* while condition
It’s our old and
only friend here

*

You may append
by and when
You may append
when

until is not bad
option either.
* What these are?

Comprehensions are,
essentially, loops and their
code blocks on the same
line.

*
You’ll start to love
CoffeeScript

* class Employee
* The constructor function
* Inheritance

You know how the
constructor works

Mmm… not exactly
But it’s

But there’s some
hack here

* Class level functions
* Prototype
Don’t dare to forget
me

Also known as noninstance functions

*
* <script type=“text/coffeescript”>
// Some CoffeeScript here
</script>

Before it include a reference to the url
http://jashkenas.github.com/coffeescript/extras/coffee-script.js

*
* How can I write jQuery using CoffeeScript?

Please see the
example app

*
* As a JavaScript replacement.
* Writing jQuery in your projects.
* Writing of JavaScript library easily.
* Writing of jQuery plugins easily too.
* At last: The things you expect from JavaScript
you can do in CoffeeScript very easily.

*
*
* Now it’s your turn to make some for yourself.

*
* O’Reilly The Little Book on CoffeeScript By Alex
MacCaw

* PacktPub CoffeeScript Programming with
jQuery, Rails and Node.js By Michael Erasmus

* The Pragmatic Programmers CoffeeScript
Accelerated JavaScript Development By Trevor
Burnham

* O’Reilly Programming in CoffeeScript By Mark
Bates

*

More Related Content

What's hot

Workshop 4: NodeJS. Express Framework & MongoDB.
Workshop 4: NodeJS. Express Framework & MongoDB.Workshop 4: NodeJS. Express Framework & MongoDB.
Workshop 4: NodeJS. Express Framework & MongoDB.Visual Engineering
 
Mongoose: MongoDB object modelling for Node.js
Mongoose: MongoDB object modelling for Node.jsMongoose: MongoDB object modelling for Node.js
Mongoose: MongoDB object modelling for Node.jsYuriy Bogomolov
 
Beautiful code instead of callback hell using ES6 Generators, Koa, Bluebird (...
Beautiful code instead of callback hell using ES6 Generators, Koa, Bluebird (...Beautiful code instead of callback hell using ES6 Generators, Koa, Bluebird (...
Beautiful code instead of callback hell using ES6 Generators, Koa, Bluebird (...andreaslubbe
 
Moving to modules
Moving to modulesMoving to modules
Moving to modulesSean Mize
 
Bundler is the Best
Bundler is the BestBundler is the Best
Bundler is the Bestdead_arm
 
Practical Use of MongoDB for Node.js
Practical Use of MongoDB for Node.jsPractical Use of MongoDB for Node.js
Practical Use of MongoDB for Node.jsasync_io
 
Drupal + selenium
Drupal + seleniumDrupal + selenium
Drupal + seleniumhernanibf
 
Dear JavaScript... - Alessandro Cinelli - Codemotion Amsterdam 2018
Dear JavaScript...  - Alessandro Cinelli - Codemotion Amsterdam 2018Dear JavaScript...  - Alessandro Cinelli - Codemotion Amsterdam 2018
Dear JavaScript... - Alessandro Cinelli - Codemotion Amsterdam 2018Codemotion
 
JRuby @ Boulder Ruby
JRuby @ Boulder RubyJRuby @ Boulder Ruby
JRuby @ Boulder RubyNick Sieger
 
JS Level Up: Prototypes
JS Level Up: PrototypesJS Level Up: Prototypes
JS Level Up: PrototypesVernon Kesner
 
ECMAScript 6 and the Node Driver
ECMAScript 6 and the Node DriverECMAScript 6 and the Node Driver
ECMAScript 6 and the Node DriverMongoDB
 
Node.js et NPM: de la récupération de dépendances à la publication de paquets
Node.js et NPM: de la récupération de dépendances à la publication de paquetsNode.js et NPM: de la récupération de dépendances à la publication de paquets
Node.js et NPM: de la récupération de dépendances à la publication de paquetsFrank Rousseau
 
NodeJS: n00b no more
NodeJS: n00b no moreNodeJS: n00b no more
NodeJS: n00b no moreBen Peachey
 
JavaScript Language Paradigms
JavaScript Language ParadigmsJavaScript Language Paradigms
JavaScript Language ParadigmsJason Harwig
 
Introduction to node.js
Introduction to  node.jsIntroduction to  node.js
Introduction to node.jsMd. Sohel Rana
 
Superfast Automated Web Testing with CasperJS & PhantomJS
Superfast Automated Web Testing with CasperJS & PhantomJS Superfast Automated Web Testing with CasperJS & PhantomJS
Superfast Automated Web Testing with CasperJS & PhantomJS Hervé Vũ Roussel
 
Javascript orientado a testes
Javascript orientado a testesJavascript orientado a testes
Javascript orientado a testesAlexandre Gomes
 

What's hot (20)

Workshop 4: NodeJS. Express Framework & MongoDB.
Workshop 4: NodeJS. Express Framework & MongoDB.Workshop 4: NodeJS. Express Framework & MongoDB.
Workshop 4: NodeJS. Express Framework & MongoDB.
 
Mongoose: MongoDB object modelling for Node.js
Mongoose: MongoDB object modelling for Node.jsMongoose: MongoDB object modelling for Node.js
Mongoose: MongoDB object modelling for Node.js
 
Beautiful code instead of callback hell using ES6 Generators, Koa, Bluebird (...
Beautiful code instead of callback hell using ES6 Generators, Koa, Bluebird (...Beautiful code instead of callback hell using ES6 Generators, Koa, Bluebird (...
Beautiful code instead of callback hell using ES6 Generators, Koa, Bluebird (...
 
Moving to modules
Moving to modulesMoving to modules
Moving to modules
 
TsWorkflow
TsWorkflowTsWorkflow
TsWorkflow
 
Bundler is the Best
Bundler is the BestBundler is the Best
Bundler is the Best
 
Practical Use of MongoDB for Node.js
Practical Use of MongoDB for Node.jsPractical Use of MongoDB for Node.js
Practical Use of MongoDB for Node.js
 
Node.js Introduction
Node.js IntroductionNode.js Introduction
Node.js Introduction
 
Drupal + selenium
Drupal + seleniumDrupal + selenium
Drupal + selenium
 
Dear JavaScript... - Alessandro Cinelli - Codemotion Amsterdam 2018
Dear JavaScript...  - Alessandro Cinelli - Codemotion Amsterdam 2018Dear JavaScript...  - Alessandro Cinelli - Codemotion Amsterdam 2018
Dear JavaScript... - Alessandro Cinelli - Codemotion Amsterdam 2018
 
JRuby @ Boulder Ruby
JRuby @ Boulder RubyJRuby @ Boulder Ruby
JRuby @ Boulder Ruby
 
JS Level Up: Prototypes
JS Level Up: PrototypesJS Level Up: Prototypes
JS Level Up: Prototypes
 
ECMAScript 6 and the Node Driver
ECMAScript 6 and the Node DriverECMAScript 6 and the Node Driver
ECMAScript 6 and the Node Driver
 
Constructor in detail
Constructor in detailConstructor in detail
Constructor in detail
 
Node.js et NPM: de la récupération de dépendances à la publication de paquets
Node.js et NPM: de la récupération de dépendances à la publication de paquetsNode.js et NPM: de la récupération de dépendances à la publication de paquets
Node.js et NPM: de la récupération de dépendances à la publication de paquets
 
NodeJS: n00b no more
NodeJS: n00b no moreNodeJS: n00b no more
NodeJS: n00b no more
 
JavaScript Language Paradigms
JavaScript Language ParadigmsJavaScript Language Paradigms
JavaScript Language Paradigms
 
Introduction to node.js
Introduction to  node.jsIntroduction to  node.js
Introduction to node.js
 
Superfast Automated Web Testing with CasperJS & PhantomJS
Superfast Automated Web Testing with CasperJS & PhantomJS Superfast Automated Web Testing with CasperJS & PhantomJS
Superfast Automated Web Testing with CasperJS & PhantomJS
 
Javascript orientado a testes
Javascript orientado a testesJavascript orientado a testes
Javascript orientado a testes
 

Similar to CoffeeScript - An Introduction

Boxen: How to Manage an Army of Laptops
Boxen: How to Manage an Army of LaptopsBoxen: How to Manage an Army of Laptops
Boxen: How to Manage an Army of LaptopsPuppet
 
Building maintainable javascript applications
Building maintainable javascript applicationsBuilding maintainable javascript applications
Building maintainable javascript applicationsequisodie
 
Automate Yo'self -- SeaGL
Automate Yo'self -- SeaGL Automate Yo'self -- SeaGL
Automate Yo'self -- SeaGL John Anderson
 
A tour on ruby and friends
A tour on ruby and friendsA tour on ruby and friends
A tour on ruby and friends旻琦 潘
 
Angular JS in 2017
Angular JS in 2017Angular JS in 2017
Angular JS in 2017Ayush Sharma
 
Solid And Sustainable Development in Scala
Solid And Sustainable Development in ScalaSolid And Sustainable Development in Scala
Solid And Sustainable Development in ScalaKazuhiro Sera
 
Solid and Sustainable Development in Scala
Solid and Sustainable Development in ScalaSolid and Sustainable Development in Scala
Solid and Sustainable Development in Scalascalaconfjp
 
Angular Weekend
Angular WeekendAngular Weekend
Angular WeekendTroy Miles
 
iOS best practices
iOS best practicesiOS best practices
iOS best practicesMaxim Vialyx
 
Scripting as a Second Language
Scripting as a Second LanguageScripting as a Second Language
Scripting as a Second LanguageRob Dunn
 
CoffeeScript Design Patterns
CoffeeScript Design PatternsCoffeeScript Design Patterns
CoffeeScript Design PatternsTrevorBurnham
 
Beginning Scala with Skinny Framework #jjug_ccc
Beginning Scala with Skinny Framework #jjug_cccBeginning Scala with Skinny Framework #jjug_ccc
Beginning Scala with Skinny Framework #jjug_cccKazuhiro Sera
 
Killing the Angle Bracket
Killing the Angle BracketKilling the Angle Bracket
Killing the Angle Bracketjnewmanux
 
Modeling Tricks My Relational Database Never Taught Me
Modeling Tricks My Relational Database Never Taught MeModeling Tricks My Relational Database Never Taught Me
Modeling Tricks My Relational Database Never Taught MeDavid Boike
 
Real life-coffeescript
Real life-coffeescriptReal life-coffeescript
Real life-coffeescriptDavid Furber
 
Clean Code: Stop wasting my time
Clean Code: Stop wasting my timeClean Code: Stop wasting my time
Clean Code: Stop wasting my timeEdorian
 
CoffeeScript: A beginner's presentation for beginners copy
CoffeeScript: A beginner's presentation for beginners copyCoffeeScript: A beginner's presentation for beginners copy
CoffeeScript: A beginner's presentation for beginners copyPatrick Devins
 

Similar to CoffeeScript - An Introduction (20)

Boxen: How to Manage an Army of Laptops
Boxen: How to Manage an Army of LaptopsBoxen: How to Manage an Army of Laptops
Boxen: How to Manage an Army of Laptops
 
Building maintainable javascript applications
Building maintainable javascript applicationsBuilding maintainable javascript applications
Building maintainable javascript applications
 
Overview of CoffeeScript
Overview of CoffeeScriptOverview of CoffeeScript
Overview of CoffeeScript
 
Automate Yo'self -- SeaGL
Automate Yo'self -- SeaGL Automate Yo'self -- SeaGL
Automate Yo'self -- SeaGL
 
A tour on ruby and friends
A tour on ruby and friendsA tour on ruby and friends
A tour on ruby and friends
 
Angular JS in 2017
Angular JS in 2017Angular JS in 2017
Angular JS in 2017
 
Sprockets
SprocketsSprockets
Sprockets
 
Solid And Sustainable Development in Scala
Solid And Sustainable Development in ScalaSolid And Sustainable Development in Scala
Solid And Sustainable Development in Scala
 
Solid and Sustainable Development in Scala
Solid and Sustainable Development in ScalaSolid and Sustainable Development in Scala
Solid and Sustainable Development in Scala
 
Angular Weekend
Angular WeekendAngular Weekend
Angular Weekend
 
Automate Yo' Self
Automate Yo' SelfAutomate Yo' Self
Automate Yo' Self
 
iOS best practices
iOS best practicesiOS best practices
iOS best practices
 
Scripting as a Second Language
Scripting as a Second LanguageScripting as a Second Language
Scripting as a Second Language
 
CoffeeScript Design Patterns
CoffeeScript Design PatternsCoffeeScript Design Patterns
CoffeeScript Design Patterns
 
Beginning Scala with Skinny Framework #jjug_ccc
Beginning Scala with Skinny Framework #jjug_cccBeginning Scala with Skinny Framework #jjug_ccc
Beginning Scala with Skinny Framework #jjug_ccc
 
Killing the Angle Bracket
Killing the Angle BracketKilling the Angle Bracket
Killing the Angle Bracket
 
Modeling Tricks My Relational Database Never Taught Me
Modeling Tricks My Relational Database Never Taught MeModeling Tricks My Relational Database Never Taught Me
Modeling Tricks My Relational Database Never Taught Me
 
Real life-coffeescript
Real life-coffeescriptReal life-coffeescript
Real life-coffeescript
 
Clean Code: Stop wasting my time
Clean Code: Stop wasting my timeClean Code: Stop wasting my time
Clean Code: Stop wasting my time
 
CoffeeScript: A beginner's presentation for beginners copy
CoffeeScript: A beginner's presentation for beginners copyCoffeeScript: A beginner's presentation for beginners copy
CoffeeScript: A beginner's presentation for beginners copy
 

Recently uploaded

ISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITY
ISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITYISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITY
ISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITYKayeClaireEstoconing
 
Barangay Council for the Protection of Children (BCPC) Orientation.pptx
Barangay Council for the Protection of Children (BCPC) Orientation.pptxBarangay Council for the Protection of Children (BCPC) Orientation.pptx
Barangay Council for the Protection of Children (BCPC) Orientation.pptxCarlos105
 
Inclusivity Essentials_ Creating Accessible Websites for Nonprofits .pdf
Inclusivity Essentials_ Creating Accessible Websites for Nonprofits .pdfInclusivity Essentials_ Creating Accessible Websites for Nonprofits .pdf
Inclusivity Essentials_ Creating Accessible Websites for Nonprofits .pdfTechSoup
 
INTRODUCTION TO CATHOLIC CHRISTOLOGY.pptx
INTRODUCTION TO CATHOLIC CHRISTOLOGY.pptxINTRODUCTION TO CATHOLIC CHRISTOLOGY.pptx
INTRODUCTION TO CATHOLIC CHRISTOLOGY.pptxHumphrey A Beña
 
Full Stack Web Development Course for Beginners
Full Stack Web Development Course  for BeginnersFull Stack Web Development Course  for Beginners
Full Stack Web Development Course for BeginnersSabitha Banu
 
Field Attribute Index Feature in Odoo 17
Field Attribute Index Feature in Odoo 17Field Attribute Index Feature in Odoo 17
Field Attribute Index Feature in Odoo 17Celine George
 
Concurrency Control in Database Management system
Concurrency Control in Database Management systemConcurrency Control in Database Management system
Concurrency Control in Database Management systemChristalin Nelson
 
4.18.24 Movement Legacies, Reflection, and Review.pptx
4.18.24 Movement Legacies, Reflection, and Review.pptx4.18.24 Movement Legacies, Reflection, and Review.pptx
4.18.24 Movement Legacies, Reflection, and Review.pptxmary850239
 
Karra SKD Conference Presentation Revised.pptx
Karra SKD Conference Presentation Revised.pptxKarra SKD Conference Presentation Revised.pptx
Karra SKD Conference Presentation Revised.pptxAshokKarra1
 
Keynote by Prof. Wurzer at Nordex about IP-design
Keynote by Prof. Wurzer at Nordex about IP-designKeynote by Prof. Wurzer at Nordex about IP-design
Keynote by Prof. Wurzer at Nordex about IP-designMIPLM
 
ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...
ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...
ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...JhezDiaz1
 
Choosing the Right CBSE School A Comprehensive Guide for Parents
Choosing the Right CBSE School A Comprehensive Guide for ParentsChoosing the Right CBSE School A Comprehensive Guide for Parents
Choosing the Right CBSE School A Comprehensive Guide for Parentsnavabharathschool99
 
MULTIDISCIPLINRY NATURE OF THE ENVIRONMENTAL STUDIES.pptx
MULTIDISCIPLINRY NATURE OF THE ENVIRONMENTAL STUDIES.pptxMULTIDISCIPLINRY NATURE OF THE ENVIRONMENTAL STUDIES.pptx
MULTIDISCIPLINRY NATURE OF THE ENVIRONMENTAL STUDIES.pptxAnupkumar Sharma
 
ANG SEKTOR NG agrikultura.pptx QUARTER 4
ANG SEKTOR NG agrikultura.pptx QUARTER 4ANG SEKTOR NG agrikultura.pptx QUARTER 4
ANG SEKTOR NG agrikultura.pptx QUARTER 4MiaBumagat1
 
Q4-PPT-Music9_Lesson-1-Romantic-Opera.pptx
Q4-PPT-Music9_Lesson-1-Romantic-Opera.pptxQ4-PPT-Music9_Lesson-1-Romantic-Opera.pptx
Q4-PPT-Music9_Lesson-1-Romantic-Opera.pptxlancelewisportillo
 
Earth Day Presentation wow hello nice great
Earth Day Presentation wow hello nice greatEarth Day Presentation wow hello nice great
Earth Day Presentation wow hello nice greatYousafMalik24
 

Recently uploaded (20)

ISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITY
ISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITYISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITY
ISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITY
 
Barangay Council for the Protection of Children (BCPC) Orientation.pptx
Barangay Council for the Protection of Children (BCPC) Orientation.pptxBarangay Council for the Protection of Children (BCPC) Orientation.pptx
Barangay Council for the Protection of Children (BCPC) Orientation.pptx
 
Inclusivity Essentials_ Creating Accessible Websites for Nonprofits .pdf
Inclusivity Essentials_ Creating Accessible Websites for Nonprofits .pdfInclusivity Essentials_ Creating Accessible Websites for Nonprofits .pdf
Inclusivity Essentials_ Creating Accessible Websites for Nonprofits .pdf
 
INTRODUCTION TO CATHOLIC CHRISTOLOGY.pptx
INTRODUCTION TO CATHOLIC CHRISTOLOGY.pptxINTRODUCTION TO CATHOLIC CHRISTOLOGY.pptx
INTRODUCTION TO CATHOLIC CHRISTOLOGY.pptx
 
Full Stack Web Development Course for Beginners
Full Stack Web Development Course  for BeginnersFull Stack Web Development Course  for Beginners
Full Stack Web Development Course for Beginners
 
Field Attribute Index Feature in Odoo 17
Field Attribute Index Feature in Odoo 17Field Attribute Index Feature in Odoo 17
Field Attribute Index Feature in Odoo 17
 
YOUVE GOT EMAIL_FINALS_EL_DORADO_2024.pptx
YOUVE GOT EMAIL_FINALS_EL_DORADO_2024.pptxYOUVE GOT EMAIL_FINALS_EL_DORADO_2024.pptx
YOUVE GOT EMAIL_FINALS_EL_DORADO_2024.pptx
 
Raw materials used in Herbal Cosmetics.pptx
Raw materials used in Herbal Cosmetics.pptxRaw materials used in Herbal Cosmetics.pptx
Raw materials used in Herbal Cosmetics.pptx
 
Concurrency Control in Database Management system
Concurrency Control in Database Management systemConcurrency Control in Database Management system
Concurrency Control in Database Management system
 
FINALS_OF_LEFT_ON_C'N_EL_DORADO_2024.pptx
FINALS_OF_LEFT_ON_C'N_EL_DORADO_2024.pptxFINALS_OF_LEFT_ON_C'N_EL_DORADO_2024.pptx
FINALS_OF_LEFT_ON_C'N_EL_DORADO_2024.pptx
 
4.18.24 Movement Legacies, Reflection, and Review.pptx
4.18.24 Movement Legacies, Reflection, and Review.pptx4.18.24 Movement Legacies, Reflection, and Review.pptx
4.18.24 Movement Legacies, Reflection, and Review.pptx
 
YOUVE_GOT_EMAIL_PRELIMS_EL_DORADO_2024.pptx
YOUVE_GOT_EMAIL_PRELIMS_EL_DORADO_2024.pptxYOUVE_GOT_EMAIL_PRELIMS_EL_DORADO_2024.pptx
YOUVE_GOT_EMAIL_PRELIMS_EL_DORADO_2024.pptx
 
Karra SKD Conference Presentation Revised.pptx
Karra SKD Conference Presentation Revised.pptxKarra SKD Conference Presentation Revised.pptx
Karra SKD Conference Presentation Revised.pptx
 
Keynote by Prof. Wurzer at Nordex about IP-design
Keynote by Prof. Wurzer at Nordex about IP-designKeynote by Prof. Wurzer at Nordex about IP-design
Keynote by Prof. Wurzer at Nordex about IP-design
 
ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...
ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...
ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...
 
Choosing the Right CBSE School A Comprehensive Guide for Parents
Choosing the Right CBSE School A Comprehensive Guide for ParentsChoosing the Right CBSE School A Comprehensive Guide for Parents
Choosing the Right CBSE School A Comprehensive Guide for Parents
 
MULTIDISCIPLINRY NATURE OF THE ENVIRONMENTAL STUDIES.pptx
MULTIDISCIPLINRY NATURE OF THE ENVIRONMENTAL STUDIES.pptxMULTIDISCIPLINRY NATURE OF THE ENVIRONMENTAL STUDIES.pptx
MULTIDISCIPLINRY NATURE OF THE ENVIRONMENTAL STUDIES.pptx
 
ANG SEKTOR NG agrikultura.pptx QUARTER 4
ANG SEKTOR NG agrikultura.pptx QUARTER 4ANG SEKTOR NG agrikultura.pptx QUARTER 4
ANG SEKTOR NG agrikultura.pptx QUARTER 4
 
Q4-PPT-Music9_Lesson-1-Romantic-Opera.pptx
Q4-PPT-Music9_Lesson-1-Romantic-Opera.pptxQ4-PPT-Music9_Lesson-1-Romantic-Opera.pptx
Q4-PPT-Music9_Lesson-1-Romantic-Opera.pptx
 
Earth Day Presentation wow hello nice great
Earth Day Presentation wow hello nice greatEarth Day Presentation wow hello nice great
Earth Day Presentation wow hello nice great
 

CoffeeScript - An Introduction

  • 2. * Getting and running it * Variables * “Interpolation” and “““Heredocs””” * Statements * Functions and Splats… * Collections, Iterations and Comprehensions * Classes * Example app *
  • 3. * CoffeeScript is just compiled down JavaScript. * We can write JS the way it should be… * CS is just Syntactical Sugar for JS. JS = -> JavaScript CS = -> CoffeeScript However, CS is more than Syntactical Sugar * If you love JS, you’ll love CS… * Let’s get to know this… * This is becoming BUZZ WORD these days…
  • 4. * CS depends on Node.js environment to get installed. However CS doesn’t need Node.js to run on the machine. * How can I install the Node.js? * After node is installed, use NPM Perhaps, SUROOR’s blog may rescue you here… to install the CS. * npm install –g coffee-script Pay attention to “-g” * Node Package Manager
  • 5. * On command prompt type coffee. It will drop you in REPL mode. * Compile a file. * Compile a folder. * Putting output in Read Eval Print Loop coffee –c file.coffee different folder. coffee –c src/ coffee –c src/ -o lib/ *
  • 6. * You can get compile your Coffee files to JavaScript whenever you change them, automatically! coffee –cw src/ -o lib/ * The –w switch makes it happen. -w switch also watches for subdirectories *
  • 7. * White space considerations. * Indent your code properly. * No need to use special cartoon like characters in the code. * Freedom from that semicolon. You’ll need me when writing multiple lines of code in a single shot * CS is very sensitive towards it Why would I need to do so? Those are really obstructive Though I’m optional in JS
  • 8. * Use of the var keyword is strictly prohibited. * CoffeeScript saves us from creating global variables. * What if I need to create one/more? Then how would I create one? We can attach them to the global window object. But be cautious!!!
  • 9. * “Hope if it prints the value of #{interest}.” * A multiline string which may have #{} can contain any interpolation inside it. * var regEx = /d{3}-d{8}/ This RegEx could be worse. * valid CoffeeScript inside the string Use ””” quotes that’ll even preserve the space regEx = /// d{3}d{8} ///
  • 10. * # I’ll not be visible in compiled JavaScript. * ### I think I may put the license and the information here, and it’ll be visible in the compiled JavaScript. ### *
  • 11. Equal or Identical (equal and of the same type)? * == or === * != or !== *? Not equal or Not identical? Existential operator 3 Usage • Variable declarations check • Object existence • Is member a method ? ?. ?() *
  • 12. CoffeeScript * is * isnt * not * and * or * true, yes, no * false, no, off * @, this * :: * of * in JavaScript === !== ! && || true false this prototype in N/A Word of caution!!! isnt and is not are not same *
  • 13. alert “true” if var * if var then alert “true” * if var then alert “true” else alert “false” That’s ternary ?: * unless var then alert “false” else alert “true” If the condition is false *
  • 14. * switch var when “val1”, “val2” We don’t need the break keyword anymore when “val3” else *
  • 15. I’ll be parsed to (function() {}); * -> Instant function Though I’m Anonymous * do -> calling * funcName = (param1, param2) -> alert “Hi” Functions can take default * someFunc = (param = val) -> arguments However if you need, you can return explicitly always If you really don’t want to return anything at the end of ->, use return null or return undefined * I’ll always return the last statement. * Hope if I could call the -> without params
  • 16. * Variable number of arguments to the function. * someFunc = (etc…) -> Believe me it’s one of the best aroma of CoffeeScript *
  • 17. * Arrays in CoffeeScript are no different than in JavaScript. * Searching. * Swapping. [x, y] = [y, x] * Ranges. * Slicing arrays. * Splicing/Replacing array values. Maximum size is 21 *
  • 18. * Creating objects with literal syntax. * Creating objects from variables. * Getting and setting attributes. * JSON is breeze here
  • 19. * for val in array * for key, val of object own may come here Remember the hasOwnProperty method? * while condition It’s our old and only friend here * You may append by and when You may append when until is not bad option either.
  • 20. * What these are? Comprehensions are, essentially, loops and their code blocks on the same line. *
  • 21. You’ll start to love CoffeeScript * class Employee * The constructor function * Inheritance You know how the constructor works Mmm… not exactly But it’s But there’s some hack here * Class level functions * Prototype Don’t dare to forget me Also known as noninstance functions *
  • 22. * <script type=“text/coffeescript”> // Some CoffeeScript here </script> Before it include a reference to the url http://jashkenas.github.com/coffeescript/extras/coffee-script.js *
  • 23. * How can I write jQuery using CoffeeScript? Please see the example app *
  • 24. * As a JavaScript replacement. * Writing jQuery in your projects. * Writing of JavaScript library easily. * Writing of jQuery plugins easily too. * At last: The things you expect from JavaScript you can do in CoffeeScript very easily. *
  • 25. *
  • 26. * Now it’s your turn to make some for yourself. *
  • 27. * O’Reilly The Little Book on CoffeeScript By Alex MacCaw * PacktPub CoffeeScript Programming with jQuery, Rails and Node.js By Michael Erasmus * The Pragmatic Programmers CoffeeScript Accelerated JavaScript Development By Trevor Burnham * O’Reilly Programming in CoffeeScript By Mark Bates *

Editor's Notes

  1. name = “MSK”console.log name isnt “RK”console.log name is not “RK”