miércoles, 16 de marzo de 2011

En el jardín del buen y del mal JavaScript

Better JS Docs

Dos especialmente dedicados miembros de la comunidad de desarrolladores StackOverflow, Ivo Wetzel (23 años, trabajando en Zynga Alemania) y Yi Jiang (17 años, estudiante de Singapur) , han construido el sitio JavaScript Garden, dedicado a corregir errores de interpretación y mejorar el entendimiento sobre este fantástico lenguaje.

Además de ser un ejemplo de sobriedad y buen diseño (noten la fluidez de la navegación desde el menú a la derecha), me parece un gran trabajo de difusión, cubriendo por áreas las particularidades de JavaScript que suelen confundir a algunos programadores proveniendo de entornos bastante diferentes.

Algunos ejemplos que tomo del sitio:

Objetos y propiedades

En JS todo es u objeto, excepto null y endefined.

false.toString() // 'false'
[1, 2, 3].toString(); // '1,2,3'

function Foo(){}
Foo.bar = 1;
Foo.bar; // 1 

Es común pensar que los números literales no pueden tratarse como objetos porque no se puede acceder a sus miembros de la manera tradicional, pero esto es un defecto histórico del parser, que puede subsanarse fácilmente utilizando doble punto o espacios, como se muestra aquí:

2.toString(); // arroja SyntaxError

2..toString(); // el segundo punto hace que se interprete bien
2 .toString(); // o se puede dejar un espacio antes
(2).toString(); // o el uso de paréntesis también

En JS los objetos están implementados como hashmaps, o listas de elementos clave-valor, con lo que es posible crear objetos utilizando esta notación:

var foo = {}; //  objeto vacío (hereda de object.prototype)

// un nuevo objeto con la propiedad 'test' y valor 12
var bar = {test: 12}; 

Y las propiedades también pueden accederse como tales o como índices. Incluso al usar la notación con corchetes se pueden soportar propiedades que no serían posibles utilizando puntos, como en:

var foo = {name: 'Mafalda'}
foo.name; // Mafalda
foo['name']; // Mafalda

var get = 'name';
foo[get]; // Mafalda

foo.1234; // SyntaxError
foo['1234']; // funciona

Prototipos

Esta es una de las facetas más "raras" para muchos programadores provenientes de una cultura de orientación a objetos "canónica. De hecho escuché varias veces el argumento de que "JavaScript no es orientado a objetos porque no tiene clases ni herencia". Esto es totalmente falaz: JS es orientado a objetos, sólo que tiene herencia por prototipos, y no por clases. En este sitio tienen estos buenos ejemplos de cómo mantener una jerarquía tradicional utilizando cadenas de prototipos.

Hay mucha más información y no es mi objetivo repetir todo el sitio, por lo que les recomiendo dedicarle una hora a leerlo y hacer algunas pruebas. No lleva mucho más que eso y para muchos ahorrará muchos dolores de cabeza, o les permitirá valorar JavaScript como el lenguaje merece.