Why Javascript Doesn’t Suck
or javascript outside the DOM
..sometimes it can suck

• Cross Browser DOM incompatibilities (and surprisingly its not all IE’s fault)


• Ugly looking ...
but..

• Most widely used functional programming language ever (eat your heart out
  LISP)


• lambda’s FTW


• Objects!!!...
you too can make it suck less

                                                      Module Pattern
var Positioning = func...
metaprogramming
var barCamp = {
                                                           “send”
   sayHello: function(){...
prototype this

                                        prototype inheritance
function Bar(){
    this.member = initialize...
no more new

function object(parentObject){
    //create a dummy constructor function for our new object
    function F(){...
hold your arguments to later please

Bar.prototype.setFavoriteDrinks = function(person) {
    var drinks = Array.prototype...
bye bye browser
//model

                                                     TrimPath junction
Contact = function() {}
wi...
thanks to...

         Doug Crockford Advanced Javascript 1 + 2:
    http://video.yahoo.com/video/play?vid=cccd4aa02a3993a...
and of course




      http://www.amazon.com/JavaScript-Definitive-Guide-David-Flanagan/dp/1565923928
Eric Allam - last100meters.com

payperpost.com
Upcoming SlideShare
Loading in …5
×

Orlando BarCamp Why Javascript Doesn't Suck

2,520 views
2,410 views

Published on

Published in: Business, Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
2,520
On SlideShare
0
From Embeds
0
Number of Embeds
32
Actions
Shares
0
Downloads
21
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

Orlando BarCamp Why Javascript Doesn't Suck

  1. 1. Why Javascript Doesn’t Suck or javascript outside the DOM
  2. 2. ..sometimes it can suck • Cross Browser DOM incompatibilities (and surprisingly its not all IE’s fault) • Ugly looking code (compared to some other languages *cough* ruby *cough*) • Poorly written code • Global Namespace • Lives inside the browser (it doesn’t have to)
  3. 3. but.. • Most widely used functional programming language ever (eat your heart out LISP) • lambda’s FTW • Objects!!! (and JSON) • Metaprogramming goodness (think ruby) • Duck typed • Light and easy (pretty much the opposite of Java)
  4. 4. you too can make it suck less Module Pattern var Positioning = function(){ //private members var _x = 0; var _y = 0; return { //priviledged functions, have access to private members/functions setPosition: function(x,y){ _x = x; _y = y; }, getPosition: function(){ return new Array(_x, _y); } } }(); Positioning.setPosition(50, 100); Positioning.getPosition(); // [50, 100]
  5. 5. metaprogramming var barCamp = { “send” sayHello: function(){ alert quot;Helloquot;; } } barCamp.sayHello // alerted quot;Helloquot; barCamp['sayHello'] // alerted quot;Helloquot; barCamp.hasOwnProperty('sayHello') // true //define_method in 3 lines of code Function.prototype.define_method = function(name, func){ this.prototype[name] = func; return this; } Positioning.define_method('deletePositions', function(){...})
  6. 6. prototype this prototype inheritance function Bar(){ this.member = initializer; return this; } Bar.prototype.sayHello = function(){ alert quot;Hello I am Barquot;; } var barObject = new Bar(); barObject.prototype == Bar.prototype barObject.constructor == Bar() barObject.sayHello() // alerts quot;Hello I am Barquot; function Foo(){ this.member = initializer; return this; } Foo.prototype = new Bar(); Foo.prototype.sayHello = function(){ alert quot;Hello I am Fooquot;; } var fooObject = new Foo(); fooObject.sayHello() //alerts quot;Hello I am Fooquot;
  7. 7. no more new function object(parentObject){ //create a dummy constructor function for our new object function F(){}; // the dummy function's prototype member is now the parentObject F.prototype = parentObject; // return an object with the dummy function's prototype member return new F(); } var bar = { sayHello: function(){...} }; var foo = object(bar); foo.sayHello() // alerts “Hello I am Bar”
  8. 8. hold your arguments to later please Bar.prototype.setFavoriteDrinks = function(person) { var drinks = Array.prototype.slice.apply(arguments, [1]); alert(person + quot;'s favorite drinks are: quot; + drinks.join(', ')); } var barCamp = new Bar() // hint ill accept any of these as a thank you later tonight barCamp.setFavoriteDrinks(quot;the dudequot;, quot;White Russionquot;, quot;Red Bull and Vodkaquot;, quot;Irish Car Bombquot;, quot;Guinessquot;); //alert quot;the dude's favorite drinks are White Russion, Red Bull and Vodka, Irish Car Bomb, Guinessquot;
  9. 9. bye bye browser //model TrimPath junction Contact = function() {} with (modelFor('Contact')) { validatesPresenceOf('first_name'); validatesPresenceOf('last_name'); } //controller ContactController = function() {} scaffold(ContactController, 'Contact'); //view <h1>Contacts</h1> <%= linkToLocal('Create A New Contact', 'contact', 'newInstance') %> <ul> <% for (var i = 0; i < contacts.length; i++) { %> <li><%= linkToLocal(contacts[i].last_name + ', ' + contacts[i].first_name, 'contact', 'show', contacts[i].id) %></li> <% } %> </ul>
  10. 10. thanks to... Doug Crockford Advanced Javascript 1 + 2: http://video.yahoo.com/video/play?vid=cccd4aa02a3993ab06e56af731346f78.1027823 http://video.yahoo.com/video/play?vid=cccd4aa02a3993ab06e56af731346f78.1027832 Dustin Diaz Javascript site: www.dustindiaz.com Douglas Crockford quot;Javascript - The Goodquot; http://video.yahoo.com/video/play?vid=630959 http://yuiblog.com/blog/2007/06/12/module-pattern/
  11. 11. and of course http://www.amazon.com/JavaScript-Definitive-Guide-David-Flanagan/dp/1565923928
  12. 12. Eric Allam - last100meters.com payperpost.com

×