Tu no sabes JavaScript

Durante el último año, más o menos, me he dado cuenta de un fenómeno irritante en desarrollo de software. He visto un patrón repetitivo en los programadores de inflar sus currículos con tecnologías que no conocen realmente, sino que simplemente las han tocado. Aunque esto parece estar sucediendo con muchos lenguajes, el más comúnmente violado es JavaScript.

Tú No Sabes Que No Sabes

La razón de esto es que casi todos los desarrolladores web necesitan a JavaScript en un momento u otro. Con una falta de entendimiento, el enfoque más común para aprender JavaScript es buscar ejemplos de código caso por caso y realizar algunos copiar y pegar rápidos. El problema con este tipo de "aprendizaje" es que el desarrollador realmente nunca aprende el lenguaje y en su lugar gana la falsa sensación de que lo saben. Lo que he descubierto en el curso de aprendizaje y trabajo con JavaScript desde hace varios años, es que no sabes que no sabes, hasta que realmente sabes. Aunque esto es un poco redundante, lo que realmente se necesita es que alguien te diga que no lo sabes y que es necesario algún aprendizaje real. Muy a menudo entrevisto a alguien que muestra con orgullo a JavaScript en su currículum habiendo simplemente hecho algunos controladores onClick o validaciones de formularios que juntaron desde ejemplos de código. El uso y conocimiento de frameworks como jQuery o Dojo es grandioso, pero no puedes convertirse en un maestro de estos toolkits sin un buen conocimiento del JavaScript detrás de ellos. A fin de presentar los muchos elementos de JavaScript, he dividido sus conceptos en lo que siento que son los niveles de conocimiento básico, intermedio y avanzado:

Un nivel básico de entendimiento de Javascript incluye:

  • Conocer la sintaxis básica de las herramientas del lenguaje tales como loops, declaraciones if, try/catch, etc.
  • Entender la definición de funciones, incluyendo las diferentes formas en que ellas pueden ser definidas y asignadas, así como las funciones anónimas.
  • Entender los principios básicos de scope, global (window) scope versus object scope (excluyendo closures).
  • Entender el rol del contexto y el uso de la variable 'this'.
  • Entender las diferentes formas de instanciar y declarar un objeto así como funciones como objetos.
  • Entender los operadores de comparación de JavaScript '<', '>', '==', '===', qué es falsy, y como trabaja la comparación de objetos y cadenas de texto, así como el casting.
  • Indexado de arrays para atributos de objetos y funciones y como estas difieren de arrays reales (object literals vs. array literals).

Un nivel intermedio de entendimiento incluye:

  • Entendimiento de timers, cómo trabajan estos, y cómo/cuando son útiles como método de ejecución asíncrona.
  • Conocimiento profundo sobre callbacks y la aplicación de funciones tales como 'call' and 'apply', métodos para controlar el contexto y el paso de argumentos a las funciones.
  • Entender la notación JSON y la función 'eval'.
  • Entender closures, cómo estos afectan el rendimiento de tu código, y cómo pueden ser usados para crear variables privadas, junto con la encantadora llamada (function(){})().
  • AJAX ý serialización de objetos
  • Immediately-invoked function expression (IIFE)
  • Patrón módulo

Un nivel avanzado de entendimiento incluye:

  • Entender la variable 'arguments' y cómo puede usarse para sobrecargar funciones a través de arguments.length y hacer llamadas recursivas a través de arguments.callee. Debería tenerse en cuenta que el uso de arguments.callee puede ser peligroso ya que ECMAScript 5 Strict Mode no lo soporta, aunque jQuery (superior a 1.4) and Dojo toman ventaja de él.
  • Closures avanzados tales como funciones self-memoizing, currying, y funciones parcialmente aplicadas.
  • Prototipado de funciones y html, la cadena de prototipado, y cómo usar los objetos y funciones base de Javascript (Array por ejemplo) para minimizar la codificación.
  • Tipo de objetos y el uso de instanceof y typeof.
  • Expresiones regulares y compilado de expresiones.
  • La declaracion with y por qué no deberías usarla.
  • Y la parte más difícil de todas, saber cómo juntar todas estas herramientas de manera limpia, robusta, rápida, mantenible, y con código compatible entre navegadores.
  • Variable and function hoisting
  • Promises

El punto final en la sección avanzada es particularmente importante, y es a la vez el más difícil de lograr. Dada la naturaleza flexible de JavaScript, es muy fácil para tu aplicación convertirse en un mezcla inmantenible de código spaghetti. Una vez aprendes el lenguaje JavaScript en sí mismo, la maestría real viene a ser el ser capaz de estructurarlo y unirlo en el contexto de una gran aplicación web. Este punto final requiere de años de práctica y equivocaciones, y no puede aprenderse de un libro. Yo he estado usando JavaScript varias horas al día por varios años, y continuo encontrando mejores formas de estructurar y escribir mi código. Esta es la razón por la que saltar de inmediato a un framework es peligroso, ya que el código jQuery tiene el hábito de volverse inmantenible. Dojo ofrece algo de ayuda con esto a través de su sistema de clases y paquetes.

Dado que JavaScript justo ahora está ingresando en el back-end con cosas como Node.js, he decidido aislar los requerimientos anteriores de conocimientos web específicos. Estos son aspectos web (llamados el DOM e IE) que han dado a JavaScript un mal nombre y hace que bajen escalofríos por la espalda de cualquier programador. Dicho esto, si estás buscando usar JavaScript en un contexto web hay cosas adicionales que cada buen desarrollador debería saber:

  • DOM y manipularlo de manera eficiente, es decir agregando, quitando y cambiando nodos, así como trabajar con nodos de texto. Esto incluye minimizar los reflujos del navegador mediante el uso de herramientas como fragmentos de documento.
  • Extraer información de elementos del DOM de manera compatible entre navegadores (por ejemplo, estilo, posición, etc.). Estas cosas se pueden hacer de mejor manera con un framewoek como jQuery o Dojo, sin embargo, es importante comprender las diferencias entre la extracción de la información especificada en CSS vs etiquetas de estilo y computar posiciones y tamaños, etc..
  • Manejo de eventos de manera compatible entre navegadores, binding, unbinding, bubbling, capturing y cómo obtener el contexto de callback deseado. De nuevo esto es mejor manejarlo a través de un framework.
  • Expandos vs. definición de atributos, las diferencias de rendimiento entre ellos, y las diferencias de nombrado que existen.
  • Expresiones regulares para extracción de nodos del DOM.
  • Detección efectiva de funcionalidades en el navegador y degradación progresiva.

Como puedes ver en la lista anterior, hay un infierno de cosas en Javascript más allá de alert(myVal) and myBtn.onclick = ... Ciertamente hay un montón de cosas de las que puedes copiar/pegar, y sólo puedes ser un verdadero programador JavaScript a través de la lectura y la práctica. Dos grandes libros que cubren todos estos temas son 'JavaScript: The Good Parts', y 'Secrets of the JavaScript Ninja'. Recordemos que Javascript es quizás el lenguaje más accesible que existe, todos tienen un navegador, y no se necesita tiempo para configurarlo. Crea una simple página html y empieza a jugar con los conceptos anteriores. Y para decorar los currículos, yo diría que si cubres el nivel principiante y te estás aventurando en el nivel intermedio, se justifica listar Javascript. Una vez te encuentres escribiendo tus propias funciones, más allá de copiar y pegarlas, puedes decir que sabes Javascript, hasta entonces, por favor, no lo menciones.

Si hay algún aspecto de JavaScript que he olvidado por favor háganmelo saber en la sección de comentarios. También compartan cualquier experiencia que tengan con personas que claman saber JavaScript u otros lenguajes.

Debería mencionar que no soy un desarrollador de front-end, soy un desarrollador de back-end que ha evolucionado en un desarrollador full-stack. Hoy, cualquier desarrollador de back-end necesita aprender JavaScript y eso es lo que este artículo pretende alentar. No pretendo ser condescendiente mencionando conocer todo lo que existe en Javascript. Lo que me gustaría ver es que más personas se den cuenta que JavaScript es un lenguaje vasto y poderoso, y que hay muchas cosas más que los que sus ojos ven inicialmente.

Artículo original

comments powered by Disqus