Coffeescript - what's good

2,119 views

Published on

JS

Published in: Travel
0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
2,119
On SlideShare
0
From Embeds
0
Number of Embeds
990
Actions
Shares
0
Downloads
12
Comments
0
Likes
3
Embeds 0
No embeds

No notes for slide

Coffeescript - what's good

  1. 1. CoffeeScript What’s good? 2010.10.10 OutsideratFRENDS
  2. 2. “ CoffeeScriptisBeautiful INeverWanttoWritePlain ” JavaScriptAgain SamStephenson (prototype.jscreator)
  3. 3. 좋은것과익숙하지않은것을구별하기가쉽지않다.
  4. 4. ComparingJavaScriptCoffeeScript
  5. 5. FunctionSyntax
  6. 6. $(a).click(function(event){$(this).addClass(busy);})
  7. 7. $(a).click(function(event){$(this).addClassbusy})
  8. 8. $(a).click(function(event){$(@).addClassbusy})
  9. 9. $(a).click(event)-$(@).addClassbusy
  10. 10. LoopSyntax
  11. 11. vardata=[];for(vari=0;i84;i++){data.push(i*10/84);}
  12. 12. data=[]foriin[0..83]data.push(i*10/84)
  13. 13. data=[]data=i*10/84foriin[0..83]
  14. 14. data=i*10/84foriin[0..83]
  15. 15. ListComprehensions
  16. 16. init_board:function(){this.board=newArray(WIDTH);for(varx=0;xthis.board.length;x++){this.board[x]=newArray(HEIGHT)for(vary=0;ythis.board[x].length;y++){this.board[x][y]=false;}}}
  17. 17. init_board:-this.board=newArray(WIDTH)forxinthis.boardthis.board[x]=newArray(HEIGHT)foryinthis.board[x]this.board[x][y]=false
  18. 18. init_board:-@board=forxin[0...WIDTH]this.board[x]=newArray(HEIGHT)foryinthis.board[x]this.board[x][y]=false
  19. 19. init_board:-@board=forxin[0...WIDTH]foryin[0...HEIGHT]false
  20. 20. init_board:-@board=(falseforyin[0...HEIGHT]forxin[0...WIDTH])
  21. 21. SettingFields
  22. 22. constructor:function(keys,tokens){this.keys=keys;this.tokens=tokens;}
  23. 23. constructor:(keys,tokens)-this.keys=keysthis.tokens=tokens
  24. 24. constructor:(keys,tokens)-@keys=keys@tokens=tokens
  25. 25. constructor:(@keys,@tokens)-
  26. 26. DefensiveProgramming
  27. 27. varcountry=null;if(typeofmodel!==undefinedmodeltypeofmodel.profile===function){varprofile=model.profile();if(profileprofile.locationprofile.location.country){country=profile.location.country.toString();}}
  28. 28. country=nulliftypeofmodelisntundefinedmodeltypeofmodel.profileisfunctionprofile=model.profile()ifprofileprofile.locationprofile.location.countrycountry=profile.location.country.toString()
  29. 29. country=nulliftypeofmodelisntundefinedmodeltypeofmodel.profileisfunctionprofile=model.profile()ifprofileprofile.locationcountry=profile.location.country?.toString()
  30. 30. country=nulliftypeofmodelisntundefinedmodeltypeofmodel.profileisfunctionprofile=model.profile()ifprofilecountry=profile.location?.country?.toString()
  31. 31. country=nulliftypeofmodelisntundefinedmodeltypeofmodel.profileisfunctionprofile=model.profile()country=profile?.location?.country?.toString()
  32. 32. country=nulliftypeofmodelisntundefinedmodelprofile=model.profile?()?country=profile?.location?.country?.toString()
  33. 33. country=nullprofile=model?.profile?()?country=profile?.location?.country?.toString()
  34. 34. profile=model?.profile?()?country=profile?.location?.country?.toString()
  35. 35. profile=model?.profile?()?country=profile?.location?.country?.toString()
  36. 36. country=model?.profile?()?.location?.country?.toString()
  37. 37. BareObjects
  38. 38. $.ajax({url:path,timeout:5,data:{from:workspace},dataType:html,success:function(data){return$(#result).html(data);}});
  39. 39. $.ajax({url:path,timeout:5,data:{from:workspace},dataType:html,success:(data)-return$(#result).html(data)})
  40. 40. $.ajax{url:pathtimeout:5data:{from:workspace}dataType:htmlsuccess:(data)-$(#result).htmldata}
  41. 41. $.ajaxurl:pathtimeout:5data:from:workspacedataType:htmlsuccess:(data)-$(#result).htmldata
  42. 42. FunctionBinding
  43. 43. functionrequest(){$.get(this.person.url,(function(data){$(this.el).html(data);}).bind(this))}
  44. 44. request=()-$.get(this.person.url,((data)-$(this.el).html(data);).bind(this))
  45. 45. request=()-$.get(this.person.url,((data)-$(@el).htmldata).bind(@))
  46. 46. request=()-$.get(this.person.url,(data)=$(@el).htmldata)
  47. 47. request=()-$.getthis.person.url,(data)=$(@el).htmldata
  48. 48. BadThings
  49. 49. Compile isinconvenience
  50. 50. Debugging ishard
  51. 51. ButIt’sComing
  52. 52. ShortSourceMap Demohttp://www.youtube.com/watch?v=UAGAB-yT0lQ
  53. 53. ToolsforCoffeeScript
  54. 54. js2coffeeconvertJavaScripttoCoffeeScripthttp://js2coffee.org/
  55. 55. CoffeeTableBookmarkletforCoffeeScriptConsolehttp://code.alecperkins.net/coffeetable/
  56. 56. cakeSimpleBuildSystemlikeMakehttps://github.com/jashkenas/coffee-script/wiki/[HowTo]-Compiling-and-Setting-Up-Build-Tools
  57. 57. CoffeeKupMarkupasCoffeeScripthttp://coffeekup.org/
  58. 58. Thankyou. @Outsideris outsideris@gmail.com http://blog.outsider.ne.kr
  59. 59. Resourceshttp://www.flickr.com/photos/41754875@N00/5942994577http://www.flickr.com/photos/61172365@N00/481680379

×