Los Paradigmas de Programación (Programming Paradigms) son formas diferentes de pensar en cómo se organiza un programa basado en una serie de principios, los cuales resultan en estilos muy distintos y lenguajes muy diversos.
JavaScript es un leguage híbrido, por decirlo de alguna forma, y contiene elementos propios de lenguajes funcionales (por ejemplo funciones como objetos de primera clase, lambdas, ...) pero no estamos limitados al paradigma funcional, si no que en su dinamismo y rareza, JavaScript nos permite programar de forma funcional, orientado a objetos, orientado a eventos, por procedimientos, ...
Como desarrollador Full Stack JS es esencial entender los distintos paradigmas de programación y cómo se traducen al mundo real en proyectos de JavaScript.
Históricamente, el paradigma orientado a objetos (OOP) ha sido el predominante, pero recientemente, y en particular en la comunidad de JavaScript, hay un resurgir del paradigma funcional y sus bondades. JavaScript es un lenguaje de corazón funcional, así que conocer el paradigma, y cómo se compara a la programación orientada a objetos, no sólo te hará una mejor coder, si no que podrás entender cómo se pueden enfrentar los mismos problemas con enfoques distintos, e identificar y adaptarse a bases de código existentes.
En este curso formarás parte de un equipo responsable de extender la funcionalidad de un juego de dos dimensiones escrito en JavaScript. Tu equipo tendrá que dividir tareas, trabajar en parejas y en parelalo y hacer code reviews. Todo el flujo de trabajo será a través de un repositorio alojado en GitHub. Durante la primera semana tu equipo tendrá que extender el juego heredando del prototipo de un constructor ya implementado, mientras que en la segunda semana tendrán que refactorizar el código de la primera semana usando el paradigma funcional.
Este curso está pensado para alumnas que ya se han familiarizado con la programación en JavaScript y quieren llevar su conocimiento sobre el lenguaje a otro nivel, entendiendo diferentes formas de "pensar" en cómo se estructura un programa.
Se asume que las alumnas ya han trabajado con variables, valores (tipos de datos), arreglos, objetos y funciones así como estructuras de control de flujo (bucles, condicionales, ...).
Durante este curso se hará uso de algunas características de ES2015, así que
un mínimo de familiaridad con const, let, arrow-functions,
deconstrucción de objetos y la notación shorthand de objetos son un plus.
- Qué son los paradigmas de programación
- Qué son FP, OOP, EOP y PP y cómo se comparan
- A entender las diferencias entre el estilo imperativo vs declarativo
- Las diferencias entre constructores y factories
- Cómo implementar herencia prototipal
- Los principios básicos de la programación funcional
- A usar composición como alternativa a la herencia
- A trabajar sobre una base de código existente
- A trabajar haciendo pair programming
- A sacarle el jugo a git y GitHub usando issues, milestones, branches, forks y pull requests
El producto en el que trabajarás es un videojuego de ejemplo, con una base de código existente y que funciona. La idea es que un jefe ficticio le ha pedido a tu equipo que añada una serie de personajes y niveles nuevos.
Participar en el proyecto involucra lo siguiente:
- Tener una cuenta en GitHub
- Hacer un fork del repo upstream
- Mapear y dividir el trabajo con tu equipo
- Setear milestones
- Implementar nuevos personajes y mapas usando herencia
- Implementar nuevos personajes y mapas usando composición
- Enviar pull requests
- Hacer code review y merges
El juego está inspirado en el ejemplo de js-tiles de mozdevs.
Unidad 01: Introducción a Paradigmas de Programación
En esta lección aprenderás las características y diferencias entre los paradigmas más relevantes para JavaScript, que es un lenguaje multi-paradigma y nos permite programar en varios estilos: imperativo, por procedimientos, orientado a objetos (OOP), funcional (FP), ...
| # | Tipo | Formato | Duración | Descripción |
|---|---|---|---|---|
| 00 | seminario | guiado | 10min | Apertura |
| 01 | lectura | self-paced | 5min | ¿Qué son los paradigmas de programación? |
| 02 | lectura | self-paced | 5min | Historia |
| 03 | lectura | self-paced | 15min | Declarativo vs Imperativo |
| 04 | práctica | self-paced | 5min | Ejercicio Imperativo |
| 05 | lectura | self-paced | 6min | Por procedimientos |
| 06 | lectura | self-paced | 6min | Modularidad |
| 07 | práctica | self-paced | 10min | Ejercicio por procedimientos |
| 08 | lectura | self-paced | 15min | Orientado a objetos |
| 09 | práctica | self-paced | 10min | Ejercicio OOP |
| 10 | lectura | self-paced | 10min | Funcional |
| 11 | práctica | self-paced | 10min | Ejercicio funcional |
| 12 | seminario | guiado | 45min | Solucionario |
| 13 | seminario | guiado | 10min | Cierre |
Unidad 02: Entorno y metodología de trabajo
Antes de empezar con la teoría o la práctica, en esta unidad se hará una presentación sobre el curso en sí, los objetivos de aprendizaje, el proyecto, la metodología de aprendizaje, requisitos previos y metodología de evaluación.
Durante esta sesión también nos aseguraremos que todas tienen git y node instalado, acceso al repo, su propio fork, ...
| # | Tipo | Formato | Duración | Descripción |
|---|---|---|---|---|
| 00 | seminario | guiado | 10min | Apertura |
| 01 | taller | guiado | 15min | Entorno: Git + GitHub |
| 02 | taller | guiado | 15min | Creación de equipos |
| 03 | taller | guiado | 15min | Tareas y división de trabajo |
Unidad 03: OOP y herencia prototipal
Después de haber completado la introducción a paradigmas, te introdicirás en los detalles de cómo usar contructores y prototipos para crear jerarquías de herencia.
| # | Tipo | Formato | Duración | Descripción |
|---|---|---|---|---|
| 00 | seminario | guiado | 15min | Apertura |
| 01 | lectura | self-paced | 10min | this y bind |
| 02 | lectura | self-paced | 10min | Object.create |
| 03 | lectura | self-paced | 12min | Herencia prototipal |
| 04 | práctica | self-paced | 60min | Ejercicios planetproto |
| 05 | seminario | guiado | 15min | Solucionario |
| 06 | seminario | guiado | 15min | Cierre |
Unidad 04: Proyecto (implementación OOP)
En esta sesión te dedicarás a hackear 🚧! Junto con una compañera, tendrás que extender el video juego añadiendo 2 ó más personajes. La implementación será usando herencia prototipal.
Unidad 05: Hacking (proyecto libre)
Esta sesión la dedicaremos a hacking libre. Tus instructorxs propondrán retos y ejemplos para ver todxs juntxs.
Unidad 06: Object factories and composition
En esta lección veremos en detalle cómo usar composición como una alternativa a las jerarquías de herencia, y así poder comparar el enfoque funcional frente al orientado a objetos en un ámbito concreto de arquitectura y reuso de código.
| # | Tipo | Formato | Duración | Descripción |
|---|---|---|---|---|
| 00 | seminario | guiado | 15min | Apertura |
| 01 | lectura | self-paced | 3min | Closures |
| 02 | lectura | self-paced | 5min | Factories |
| 03 | lectura | self-paced | 5min | Object.assign |
| 04 | lectura | self-paced | 10min | Composition over inheritance |
| 05 | práctica | self-paced | 60min | Ejercicios |
| 06 | seminario | guiado | 15min | Solucionario |
| 07 | seminario | guiado | 15min | Cierre |
Unidad 07: Proyecto (implementación FP)
En esta sesión te dedicarás a hackear 🚧! Junto con una compañera, tendrás que extender el video juego añadiendo 2 ó más personajes. La implementación será usando el estilo funcional (composición).
Unidad 08: Hacking (proyecto libre)
Esta sesión la dedicaremos a hacking libre. Tus instructorxs propondrán retos y ejemplos para ver todxs juntxs.
- Lupo Montero (autor)
- Mariano Crowe (technical review)
- Object-Oriented vs. Functional Programming, Richard Warburton, O'Reilly Media
- Eloquent JavaScript, Marijn Haverbeke, 2014
- You Don't Know JS: this & Object Prototypes, Kyle Simpson, O'Reilly Media, Jul 2014
- Programming Paradigms for Dummies: What Every Programmer Should Know, Peter Van Roy, Université Catholique de Louvain, Bélgica, circa 2010.
Cursos similares que sirven como referencia:
- Fundamentos de la programación: Paradigmas de programación, José Dimas Luján Castillo, video2brain, 8 Mar 2017
- Object-Oriented JavaScript, Hack Reactor en Udacity
- Ejercicio de ejemplo del curso de Hack Reactor
- Overview of the four main programming paradigms, Kurt Nørmarks, Aalborg University, Dinamarca.
Capítulos de libros:
- Eloquent JavaScript - Chapter 3: Functions
- Eloquent JavaScript - Chapter 5: Higher-Order Functions
- Eloquent JavaScript - Chapter 6: The Secret Life of Objects
Blog posts:
- Six programming paradigms that will change how you think about coding, Yevgeniy Brikman, Apr 09 2014
- Understanding JavaScript Constructors, Faraz Kelhini, CSS Tricks, Sep 24 2015
- ECMAScript 6 modules: the final syntax, Axel Rauschmayer, 07 Sep 2014
- JavaScript Modules: A Beginner’s Guide, Preethi Kasireddy (FreeCodeCamp), Jan 22 2016
- Why Learn Functional Programming in JavaScript? (Composing Software), Eric Elliott en Medium, Feb 20 2017
- JavaScript and Functional Programming, Beth Allchurch, 29 of June, 2016
- An introduction to functional programming, Mary Rose Cook
- Introducción a programación funcional en JavaScript — Parte 1, Lupo Montero en Medium, Feb 15 2017
Videos:
- Programming Paradigms,
10:43, Computerphile, 30 Aug 2013 - HTML IS a Programming Language (Imperative vs Declarative),
8:27, Computerphile, Jun 28 2016 - Qué es un paradigma de programación,
5:15, José Dimas Luján Castillo, video2brain, 8 Mar 2017 - Prototypal Inheritance,
8:52, Justin Meyer, Frontend Masters - Playlist: Object Creation in JavaScript,
aprox. 3h, funfunfunction, 2016 - Prototypes in JavaScript - FunFunFunction #16,
11:55, funfunfunction, 25 Jan 2016 - Prototype basics - Object Creation in JavaScript P3 - FunFunFunction #46,
19:19, funfunfunction, 22 ago. 2016 - Learning Functional Programming with JavaScript- JSUnconf,
29:56, Anjana Vakil, JSConf 2016
Otros recursos:
- Definición de Programming_paradigm en Wikipedia
- Comparativa de paradigmas de programación en Wikipedia
- History of programming languages
- Declarative programming
- Procedural programming
- Object-oriented programming
- MDN - instanceof
- MDN - this
- MDN - Function.bind
- MDN - Function.call
- MDN - Arrow functions
- MDN - Array.prototype.map
- MDN - Closures