CoffeeScript & Jasmine - MadJS February 2012

How
CoffeeScript &
Jasmine made
me a better JS
developer

So, what does this
have to do with
CoffeeScript?

How CoffeeScript & Jasmine
made me a better JS
developer
(and how it can help you,
too)

CoffeeScript: JavaScript:

^ Major Win ^

That isn't to say that
CoffeeScript
eliminates all bugs.

Coercing the wrong type

if (1 == '1') {
console.log("it's true!");
}

CoffeeScript:
if 1 is ‘1’
console.log ‘never true!’

Compiles to:
if (1 === ‘1’) {
console.log("never true!");
}

CoffeeScript scope is
essentially the same
as in JS

1. Every function creates a scope, and
the only way to create a scope is to
deﬁne a function.

2. A variable lives in the outermost
scope in which an assignment has been
made to that variable.

3. Outside of its scope, a variable is
invisible.

The neat thing is that
CoffeeScript’s compiler
places the vars for
each scope at the top
of that scope

For example, this
compiled CoffeeScript:
var singCountdown;
singCountdown = function(count) {
var singBottleCount, singDecrement;
singBottleCount = function(specifyLocation) {
var bottleStr, locationStr;
// ...
}
// ...
}

Deﬁne a variable at
a speciﬁc scope by
giving it a sensible
initial value

a ?= b
is one way to give a default

Lastly, wrapping up
your code.

Compiled CoffeeScript Example:

(function() {
console.log “hello world!”;
}).call(this);

Jeremy Ashkenas’s Example
Loop over every item in a list, in CoffeeScript:
for item in list

process item

Intention gets obscured by managing the loop, in JS:
for (var i = 0, l = list.length; i < l; i++) {

var item = list[i];

process(item);

}

CoffeeScript will help you:
•Write OO, Prototype-based code
•Avoid bugs in comparisons
•Stop using ==, only use ===
•Manage scope and avoid state through
scope creep

•Reduce off-by-one errors in looping, and
generally write better loops than you were
writing before

The example on the site:
describe("Jasmine", function() {
it("makes testing awesome!", function() {
expect(yourCode).toBeLotsBetter();
});
});

describe ('addition', function () {
    it('adds two numbers', function () {
        expect(1 + 2).toEqual(3);
    });
});

Functions should not
depend on the DOM

Our logic needs to
be in separate pieces

Follow TDD/BDD:
red, green, refactor

Jasmine is designed
to be standalone

Some really cool
features of Jasmine:

Matchers:
•.toBe()
•.toBeNull()
•.toBeTruthy()
•.toBeDeﬁned()
•.toBeUndeﬁned()
•etc.

Setup and Teardown:

•beforeEach()
•afterEach()

Spies: built-in
mocking & stubbing

But what about
legacy codebases?

Fix one bug.
(red, green, refactor)

Rewrite the affected
code in CoffeeScript.

Start grouping in
ﬁles / modules.

Keep improving the
codebase.

Lessons Learned:

•These tools can help you learn JS better.
•Legacy codebases can slowly grow
better through using CoffeeScript &
Jasmine.

•Taking advantage of these is up to you!

Resources to learn more:

•http://jashkenas.github.com/coffee-script/
•http://pivotal.github.com/jasmine/
•http://pragprog.com/book/tbcoffee/coffeescript
•http://js2coffee.org/

CoffeeScript & Jasmine - MadJS February 2012

More Related Content

Viewers also liked (8)

Similar to CoffeeScript & Jasmine - MadJS February 2012 (20)

Recently uploaded (20)

CoffeeScript & Jasmine - MadJS February 2012

Editor's Notes