Your SlideShare is downloading. ×
0
Javascript - How to avoid the bad parts
Javascript - How to avoid the bad parts
Javascript - How to avoid the bad parts
Javascript - How to avoid the bad parts
Javascript - How to avoid the bad parts
Javascript - How to avoid the bad parts
Javascript - How to avoid the bad parts
Javascript - How to avoid the bad parts
Javascript - How to avoid the bad parts
Javascript - How to avoid the bad parts
Javascript - How to avoid the bad parts
Javascript - How to avoid the bad parts
Javascript - How to avoid the bad parts
Javascript - How to avoid the bad parts
Javascript - How to avoid the bad parts
Javascript - How to avoid the bad parts
Javascript - How to avoid the bad parts
Javascript - How to avoid the bad parts
Javascript - How to avoid the bad parts
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Javascript - How to avoid the bad parts

4,720

Published on

A five minutes lighting talk presentation how to write Javascript by following the modern best practices and not in that crappy way when you where still studying web development circa HTML3.

A five minutes lighting talk presentation how to write Javascript by following the modern best practices and not in that crappy way when you where still studying web development circa HTML3.

Published in: Technology
0 Comments
5 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
4,720
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
29
Comments
0
Likes
5
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Javascript - Avoiding the bad parts Mikko Ohtamaa mikko@opensourcehacker.com http://opensourcehacker.com http://twitter.com/moo9000Saturday, November 5, 2011
  • 2. Lighting talk of 5 min Turn Python gurus to JS gurus Plone Conference 2011Saturday, November 5, 2011
  • 3. Javascript has become better Don’t write Javascript like it was 1996Saturday, November 5, 2011
  • 4. What your every JS file should look likeSaturday, November 5, 2011
  • 5. /*global require,define,window,console*/ // Main require(["jquery", "domready!", "submodule"], function($, domready, submodule) { "use strict"; $("a").click(function() { var val = submodule.foobar(); window.alert(val); }); });Saturday, November 5, 2011
  • 6. /*global require,define,window,console*/ // Submodule define(["jquery", "myothermodule"], function($, myothermodule) { use strict; // Export public module API return { foobar : function() { return 1+1+myothermodule.func(); } }; });Saturday, November 5, 2011
  • 7. Use require.js • AMD (Asynchronous Module Definition) • a.k.a. import for Javascript • Dependency solving • Automatic compression and merging of needed and only needed JS files using require.js optimizerSaturday, November 5, 2011
  • 8. Use ECMAScript5 • Goodies: this.function.bind(), Array.forEach() • Backwards compatibility (Internet Explorer): http://bit.ly/es5shimSaturday, November 5, 2011
  • 9. “use strict”; Enforces no global variables by default and fixes some other bad language featuresSaturday, November 5, 2011
  • 10. Enforce background JSLint checking in your text editor ... or JSLint modern fork, JSHintSaturday, November 5, 2011
  • 11. Saturday, November 5, 2011
  • 12. // Some JSLint hinting /*global window,console*/Saturday, November 5, 2011
  • 13. Never use Javascript inline in HTMLSaturday, November 5, 2011
  • 14. <a href=”#” onclick=”aargh()”> NoSaturday, November 5, 2011
  • 15. // On page load $("a#handler").click(function() { // do stuff }); // For dynamic content // (AJAX loaded) $("#handler").live(function() { // do stuff });Saturday, November 5, 2011
  • 16. Passing a bound method to an event handler using function.bind()Saturday, November 5, 2011
  • 17. function FooClass(){ } FooClass.prototype.myfunc = function(arg1,arg2) { } var f = new Foo(); // Bind arguments are this, arg1, arg2 setTimeout(f.myfunc.bind(f, "arg1", "arg2"), 10);Saturday, November 5, 2011
  • 18. Finding Javascript info • Use Mozilla Developer Network: “MDN Javascript bind” • Put w3school.com on ban-list - only bad information thereSaturday, November 5, 2011
  • 19. Conclusion • Worst JS farts have been fixed / can be worked around with discipline • Javascript still lacks syntatic sugar, is not wrist friendly (boo!) • Mozilla et. al. are working on to fix that (but Philip didn’t promise do drop curly brackets or semicolons)Saturday, November 5, 2011

×