Why Javascript Doesn’t Suck

or javascript outside the DOM

• 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)

..sometimes it can suck

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)

you too can make it suck less

Module Patternvar 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]

metaprogramming

var barCamp = { sayHello: function(){ alert "Hello"; } }barCamp.sayHello // alerted "Hello"barCamp['sayHello'] // alerted "Hello"barCamp.hasOwnProperty('sayHello') // true//define_method in 3 lines of codeFunction.prototype.define_method = function(name, func){ this.prototype[name] = func; return this;}

Positioning.define_method('deletePositions', function(){...})

“send”

prototype this

prototype inheritancefunction Bar(){ this.member = initializer; return this;}Bar.prototype.sayHello = function(){ alert "Hello I am Bar"; }var barObject = new Bar();barObject.prototype == Bar.prototypebarObject.constructor == Bar()barObject.sayHello() // alerts "Hello I am Bar"function Foo(){ this.member = initializer; return this;}Foo.prototype = new Bar();Foo.prototype.sayHello = function(){ alert "Hello I am Foo"; }var fooObject = new Foo();fooObject.sayHello() //alerts "Hello I am Foo"

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”

hold your arguments to later please

Bar.prototype.setFavoriteDrinks = function(person) { var drinks = Array.prototype.slice.apply(arguments, [1]); alert(person + "'s favorite drinks are: " + drinks.join(', '));}var barCamp = new Bar()// hint ill accept any of these as a thank you later tonightbarCamp.setFavoriteDrinks("the dude", "White Russion", "Red Bull and Vodka", "Irish Car Bomb", "Guiness");//alert "the dude's favorite drinks are White Russion, Red Bull and Vodka, Irish Car Bomb, Guiness"

bye bye browser

//modelContact = function() {}with (modelFor('Contact')) { validatesPresenceOf('first_name'); validatesPresenceOf('last_name');}//controllerContactController = 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>

TrimPath junction

thanks to...

http://video.yahoo.com/video/play?vid=cccd4aa02a3993ab06e56af731346f78.1027823http://video.yahoo.com/video/play?vid=cccd4aa02a3993ab06e56af731346f78.1027832

Doug Crockford Advanced Javascript 1 + 2:

Dustin Diaz Javascript site: www.dustindiaz.com

Douglas Crockford "Javascript - The Good"http://video.yahoo.com/video/play?vid=630959

http://yuiblog.com/blog/2007/06/12/module-pattern/

and of course

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

Eric Allam - last100meters.com

payperpost.com