1. How
CoffeeScript &
Jasmine made
me a better JS
developer

2. I’m Matt Gauger

3. @mathiasx

4. I work at
Bendyworks

5. My dilemma:

6. Impostor Syndrome

7. I was a
JavaScript
impostor

8. So, what does this
have to do with
CoffeeScript?

9. My thesis:

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

11. CoffeeScript

12. History

13. Today

14. CoffeeScript has
Good Parts?

15. CoffeeScript: JavaScript:

16. CoffeeScript: JavaScript:
^ Major Win ^

17. Criticisms of
CoffeeScript

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

19. Some examples:

20. Coercing the wrong type
if (1 == '1') {
console.log("it's true!");
}

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

22. Scope

23. CoffeeScript scope is
essentially the same
as in JS

24. 1. Every function creates a scope, and
the only way to create a scope is to
define 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.

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

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

27. Define a variable at
a specific scope by
giving it a sensible
initial value

28. a ?= b
is one way to give a default

29. Lastly, wrapping up
your code.

30. Compiled CoffeeScript Example:
(function() {
console.log “hello world!”;
}).call(this);

31. Simpler Looping

32. 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);
}

33. 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

34. Jasmine

35. (My) History
(with Jasmine)

36. Why Jasmine?

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

38. This example sucks!

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

40. How should we test JS?

41. Functions should not
depend on the DOM

42. Our logic needs to
be in separate pieces

43. Easier to test = better code

44. Follow TDD/BDD:
red, green, refactor

45. Jasmine is designed
to be standalone

46. Some really cool
features of Jasmine:

47. Matchers:
•.toBe()
•.toBeNull()
•.toBeTruthy()
•.toBeDefined()
•.toBeUndefined()
•etc.

48. Setup and Teardown:
•beforeEach()
•afterEach()

49. Spies: built-in
mocking & stubbing

50. But what about
legacy codebases?

51. Start simple.

52. Fix one bug.
(red, green, refactor)

53. Rewrite the affected
code in CoffeeScript.

54. Start grouping in
files / modules.

55. Keep improving the
codebase.

56. 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!

57. Thanks!

58. Resources to learn more:
•http://jashkenas.github.com/coffee-script/
•http://pivotal.github.com/jasmine/
•http://pragprog.com/book/tbcoffee/coffeescript
•http://js2coffee.org/