Curso "introductorio" a JavaScript: Temas

29 views
Skip to first unread message

Valentin Starck

unread,
Dec 4, 2012, 7:26:25 PM12/4/12
to javasc...@googlegroups.com
Estoy en tratativas para dictar un cursito de JavaScript a programadores PHP (que por cierto, son bastante monos con JS).

Si bien tengo una idea bastante concreta de los temas a tratar, me gustaría recabar más opiniones.

¿Qué temas consideran que son los más importantes (o los de mejor relación importancia/dificultad)?

Saludos!

gnz/vnk

unread,
Dec 5, 2012, 1:14:51 AM12/5/12
to javasc...@googlegroups.com
Hola
¿Qué temas consideran que son los más importantes (o los de mejor relación importancia/dificultad)?
Yo he tenido que dar uno ultrarrápido y condensado hace unos días pero tuve la suerte de, antes de darlo, poder hacer unas cuantas preguntas a los alumnos sobre lo que sabían y lo que no. Si puedes te lo recomiendo; si no, pues nada.

En cuanto a temas... emmo:
Más importantes: funciones, objetos, thisValue, closures, prototipos...

Probablemente también es bueno hablar de: coerción y conversiones, alcance, algunas cosas básicas. ¿Sintaxis? Pero el problema es que se pierde mucho tiempo con temas tan básicos y es más fácil que miren cualquiera de los miles de sitios que lo explican bien. Una idea que me ha funcionado alguna vez son estos ejercicios: https://github.com/liammclennan/JavaScript-Koans para todos los temas más básicos. Pueden hacerlos por su cuenta y preguntarte en los que no entiendan, o podéis hacerlos juntos, o puedes tú sacar los que creas más interesantes... Depende del tiempo que tengáis.

Un tema que creo que es *necesario* contar y con el que seguro que tienen dificultad: asincronía y eventos. Esto por lo que he visto casi siempre da problemas a alguien. Y muchas veces preguntas y ellos creen que lo saben y que lo entienden, pero no es cierto. Una prueba muy fácil para saber si lo entienden es la de la depuración de un manejador de evento. Les pones un ejemplito sencillo como:

    elemento.addEventLIstener("click", function(e) {
        // algo de código aquí dentro
    }, false);

O incluso mejor aún con una llamada con XHR, les pones una función en el onreadystatechange (o si prefieres, pones el ejemplo usando alguna librería, claro). Entonces, les haces depurar eso poniendo una parada dentro de la función del manejador del evento. Es increíble el número de gente que diciéndote que entienden el tema de la asincronía y los eventos, se sorprenden cuando se ejecuta ese código y el depurador no se para y sin embargo se para luego (cuando recibe la respuesta o cuando ocurre el click). Si no les vas a contar cosas sobre herramientas y depuración, puedes hacer lo mismo poniendo algunos console.log o alert o similar dentro y fuera del manejador.
Yo hice la prueba: Pregunté y todos lo entendían. En lugar de poner el ejemplo y que hicieran el ejercicio, se lo escribí en la pizarra, se lo conté de palabra, y más o menos la mitad (4 de 9) confesaron que no entendían por qué no se paraba inmediatamente y sí después. Uno más preguntó que por qué cuando se paraba no podía ver en el depurador el valor de alguna variable que estaba fuera, justo antes de asignar el manejador.

En fin, que creo que es un tema importante y además es fácil que se crean que lo entienden y en realidad no lo entiendan.


Por lo demás... Todo lo que se te ocurra. Dependiendo del tiempo que tengas.

Ya contarás que tal fue. Espero que bien :)

gz

gnz/vnk

unread,
Dec 5, 2012, 8:11:35 AM12/5/12
to javascript-es
Oh... hay una cosa que he recordado que me han preguntado más de una vez...

No sé si será apropiado para tu curso, pero lo que he recordado responde a la pregunta de ¿Cómo hacer las cosas bien?

Es decir, hay mucha gente que, incluso conociendo algo de Javascript, cuando tiene que hacer algo simplemente lanza ahí un montón de funciones. Con algo de suerte, crea un objeto y le pone todas las funciones dentro y así por lo menos no llena de nombres el alcance global, pero la mayoría no pasa de ahí o poco más.

La idea es contar algo sobre organización del código, sobre cómo estructurar tu aplicación cuando empieza a tener más de dos líneas... Si quieres y te gusta, podrías explicarles temas de modularización, incluso con el uso de alguna librería o alguna herramienta de build. No sé, RequireJS, Ender... lo que más te guste, que hay muchas opciones. Tampoco hay que complicarse mucho, pero como mínimo que sepan que están ahí esas opciones y tengan por lo menos alguna idea de cómo usarlas.

gz


2012/12/5 gnz/vnk <gnz.g...@gmail.com>

Valentin Starck

unread,
Dec 5, 2012, 8:18:10 AM12/5/12
to javasc...@googlegroups.com
La verdad es que me interesa bastante que incorporen buenas prácticas, porque todo el scripting que hacen es abrir una vista y meter JS en cualquier lugar.

Gracias por los consejos :)


2012/12/5 gnz/vnk <gnz.g...@gmail.com>



--
Valentin Starck
blog.aijoona.com

Andrés Muñoz

unread,
Dec 4, 2012, 9:19:03 PM12/4/12
to javasc...@googlegroups.com
Hola Valentin,

muy buena la iniciativa que estas tomando, espero que esteas considerando lo básico que es:
- Declaración de variables tanto como es común, como en el estilo shorthand.
- Scopes de variables.
- Introducción a patrones en javascript.

Y algo también muy importante: las buenas prácticas que se deben tener para hacer un code entedible y mantenible,

saludos,
--

Andrés Muñoz.


Juan Ignacio Dopazo

unread,
Dec 6, 2012, 4:25:09 PM12/6/12
to javasc...@googlegroups.com
Ya lo dijeron muy bien
- Capaz arrancaría con ejemplos del dinamismo en JS y para qué sirve. Callbacks sin los dramas de PHP y patrones como funciones lazy[1]. No me metería con coerción de tipos si no lo preguntan. Sólo aclararía que es distinta a la de PHP
- Debug punto numero 1. Las herramientas hoy en día son fantásticas. Mostralas.
- Asincronía punto número 2. Es lo que más les cuesta a todos.
- Eventos como estrategia de decoupling. Es una de las cosas que más cambia tu manera de escribir código. Y se pueden hacer asincrónicos si te enamoraste (futuro == setImmediate)
- Módulos. Es lo que se escribe hoy en día, es la re posta y cada día vamos a escribir más porque habrá sintaxis para ello. Estrategias para entregar al cliente muchos modulos/scripts concatenados

Agregaría, porque la idea es que le pongas un poco de flair, de punch:
- Templates y MV* en el cliente. Es el otro tema candente del momento. Escribir APIs REST en el server y comunicarlas con Backbone, YUI, etc. Templates precompilados y sus ventajas. Compartir templates entre cliente y servidor? Existe algo en PHP?

[1]
var fn = function () {
  if (foo) {
    fn = function () {};
  } else {
    fn = function () {};
  }
  return fn();
};

Juan

Valentin Starck

unread,
Dec 7, 2012, 1:09:37 PM12/7/12
to javasc...@googlegroups.com
La verdad Juan, para lo que es el nivel general de JS en los devs de la oficina es demasiado ambicioso ese "plan de estudios" :p


2012/12/6 Juan Ignacio Dopazo <dopaz...@gmail.com>



--
Valentin Starck
blog.aijoona.com

Ivan Castellanos

unread,
Dec 7, 2012, 4:03:49 PM12/7/12
to javasc...@googlegroups.com
Pero el debugger de Chrome si muestrelo; cualquiera que este
aprendiendo Javascript deberia saber lo facil que es probar sus nuevos
conocimientos y todo el feedback que da para la exploracion de
propiedades,objetos , metodos, etc la consola de Chrome.

2012/12/7 Valentin Starck <valenti...@gmail.com>:

Juan Ignacio Dopazo

unread,
Dec 7, 2012, 8:59:57 PM12/7/12
to javasc...@googlegroups.com
Pero también mostrá Firebug, los nuevos de Firefox y el de IE. Las herramientas de IE zafan hoy en día. Y mil veces necesitás sí o sí debuggear en IE.

gnz vnk

unread,
Dec 8, 2012, 4:58:54 AM12/8/12
to javasc...@googlegroups.com
Cuántos días hay de curso?
Juan Ignacio Dopazo <dopaz...@gmail.com> escribió:

Valentin Starck

unread,
Dec 10, 2012, 7:48:13 AM12/10/12
to javasc...@googlegroups.com
Propuse 3 dias de hora / hora y media.

Igual es super charlable.


2012/12/8 gnz vnk <gnz.g...@gmail.com>



--
Valentin Starck
blog.aijoona.com

gnz/vnk

unread,
Dec 10, 2012, 8:08:54 AM12/10/12
to javasc...@googlegroups.com

> Propuse 3 dias de hora / hora y media.

4-5 horas en total. Uhm, pues con eso tienes que ir a lo m�s b�sico y
directo. Yo ir�a a funciones, objetos, eventos y asincron�a... Un poco
de organizaci�n de c�digo en general y si tienes tiempo herramientas.
Pero no creo que tengas tiempo para m�s.
Reply all
Reply to author
Forward
0 new messages