You Dont-know-js-traducido-hasta-parte-del-tercerlibro.pdf

Table of Contents Introducción 1.1 I- Up & Going 1.2 0- Prefacio Prefacio 1.2.1 1- En la programac programación ión...

Table of Contents Introducción 1.1 I- Up & Going 1.2 0- Prefacio Prefacio 1.2.1 1- En la programac programación ión 1.2.2 1.1 Código Código 1.2.2.1 1.2 Inténtalo tú mismo 1.2.2.2 1.3 Operadore Operadoress 1.2.2.3 1.4 Valores Valores y Tipos 1.2.2.4 1.5 Comenta Comentarios rios del Código 1.2.2.5 1.6 Variables Variables 1.2.2.6 1.7 Bloques 1.2.2.7 1.8 Condicionales Condicionales 1.2.2.8 1.9 Bucles Bucles 1.2.2.9 1.10 Funciones 1.2.2.10 1.11 Scope (Ámbito) (Ámbito) 1.2.2.11 1.12 Práctica 1.2.2.12 1.13 - Revisión Revisión 1.2.2.13 2- En Javascript Javascript 1.2.3 2.1 Valores y Tipos 1.2.3.1 2.2 Variables 1.2.3.2 2.3 Condicionales 1.2.3.3 2.4 Modo estricto 1.2.3.4 2.5 Funciones como Valores 1.2.3.5 2.6 Identificador This 1.2.3.6 2.7 Prototypes 1.2.3.7 2.8 Lo Viejo y Lo Nuevo 1.2.3.8 2.9 Non-JavaScript 1.2.3.9 2.10 Revisión 1.2.3.10 3- En YDKJS 1.2.4  3.2 This & Object Prototypes 1.2.4.2 3.3 Tipos & Gramática 1.2.4.3 3.4 Async & Performance 1.2.4.4 3.5 ES6 & Más allá 1.2.4.5 3.6 Revisión 1.2.4.6 II- Scope & Closures 1.3 0- Prefacio 1.3.1 1- ¿Qué es el Scope? 1.3.2 1.1 Teoría del Compilador 1.3.2.1 1.2 Entendiendo el Scope 1.3.2.2 1.3 Scopes Anidados 1.3.2.3 1.4 Errores 1.3.2.4 1.5 Revisión 1.3.2.5 2- Lexical Scope 1.3.3 2.1 Tiempo de Lex 1.3.3.1 2.2 Trucos léxicos 1.3.3.2 2.3 Revisión 1.3.3.3 3- Function vs. Block Scope 1.3.4 3.1 Ámbito de las funciones 1.3.4.1 3.2 Ocultación en el ámbito común 1.3.4.2 3.3 Funciones como ámbitos 1.3.4.3 3.4 Bloques como ámbitos 1.3.4.4 3.5 Revisión (TL; DR) 1.3.4.5 4- Hoisting 1.3.5 4.1 ¿El Huevo o la Gallina? 1.3.5.1 4.2 El compilador pega de nuevo 1.3.5.2 4.3 Funciones Primero 1.3.5.3 4.4 Revisión 1.3.5.4 5- Scope Closure 1.3.6 5.1 Ilustración 1.3.6.1 5.2 Nitty Gritty 1.3.6.2 5.3 Ahora puedo ver 1.3.6.3 5.4 Loops + Closure 1.3.6.4  5.6 Revisión 1.3.6.6 6- Scope Dinámico 1.3.7 7- Ámbito de bloque de Polyfilling 1.3.8 7.1 Traceur 1.3.8.1 7.2 Bloques implícitos vs. explícitos 1.3.8.2 7.3 Rendimiento 1.3.8.3 8- Lexical-this 1.3.9 III- this & Object Prototypes 1.4 0- Prefacio 1.4.1 1- this o That? 1.4.2 1.1 ¿Porque this? 1.4.2.1 1.2 Confusiones 1.4.2.2 1.3 ¿Que es this? 1.4.2.3 1.4 Revisión 1.4.2.4 2- this, todo tiene sentido ahora! 1.4.3 2.1 Sitio de llamada 1.4.3.1 2.2 Nada más que reglas 1.4.3.2 2.3 Todo en orden 1.4.3.3 Introducción Javascript Avanzado en Español Esta es una traducción de la serie de libros de You Don't Know JS (book series), series) , la cual es una serie de 6 libros que navegan profundamente en los mecanismos básicos bá sicos y avanzados del lenguaje JavaScript. La primera edición de la serie está ahora completa. Porque realizo este trabajo? Mi nombre es Daniel Morales, Morales, este es mi perfil perfil de GitHu GitHub b, y soy un apasionado de Ruby y Ruby On Rails y de Javascript. Soy co-fundador de HelpCode.co una plataforma para brindar Mentorías uno a uno con programadores Senior de Ruby On Rails y Javascript. Inicié la traducción de estos libros para comprender mejor el funcionamiento de Javascript, por tanto era un deseo tener la documentación traducida para mi, pero de paso pensé "Nadie ha realizado una traducción COMPLETA al español, porqué no hacerlo?". La publico para que todos los programadores de habla hispana puedan aprovecharse de este material. Si deseas hacer alguna corrección o aporte (ya que seguro podría t ener errores de traducción o interpretación), puedes hacer un fork al repo principal y solicitar un pull- request, apreciaré dicha ayuda! Quien es el Autor detrás de la Serie de Libros? Como mencioné anteriormente, no soy el creador de la serie de libros, solo el traductor al español. El creador es Kyle Simpson, Simpson, cuyo trabajo esta bajo licencia Creative Commons Attribution-NonCommercial-NoDerivs 4.0 Unported License. License. ¿Por Donde Empezar? Aunque ésta es una serie serie de libros de Javascript Avanzado, Avanzado, tambien puede puede empezarlos con con un nivel básico. Si usted tiene nivel básico en Programación y/o en Javascript = Vaya al Libro # 1 - Up & Going Si usted tiene un nivel básico/medio/avanzado básico/medio/avanzado en Programación y/o en Javascrip = Introducción I- Up & Going I- Up & Going Prefacio ¿Cuál fue la última cosa nueva que aprendiste? Tal vez fue una lengua extranjera, como italiano o alemán. O tal vez un editor de gráficos, como Photoshop. O una técnica de cocción o carpintería o una rutina de ejercicios. Quiero que recuerdes esa sensación cuando finalmente lo conseguiste: el momento que alumbró tu bombilla. Cuando las cosas pasaban de borrosas a cristalinas, cuando lo dominabas veías o entendías la diferencia entre sustantivos masculinos y femeninos en francés. ¿Como se sintió? Bastante asombroso, ¿verdad? Ahora quiero que vayas un poco más lejos en tu memoria antes de que aprendieras una nueva habilidad. ¿Cómo se sintió eso? Probablemente un poco intimidante y tal vez un poco frustrante, ¿verdad? En un momento, no sabíamos las cosas que sabemos ahora y eso está bien; Todos empezamos en alguna parte. Aprender material nuevo es una aventura emocionante, especialmente si usted está buscando aprender el tema de manera eficiente. Enseño muchas clases de codificación a principiantes. Los estudiantes que toman mis clases a menudo han tratado de aprender por sí mismos temas como HTML o JavaScript por medio de la lectura de blogs o copiar y pegar código, pero no han sido capaces de dominar realmente el material que les permita codificar el resultado deseado. Y debido a que no comprenden realmente los entresijos de ciertos temas de codificación, no pueden escribir código de gran alcance o depurar su propio trabajo, ya que realmente no entienden lo que está sucediendo. Siempre creo en enseñar mis clases de la manera correcta, es decir, enseño estándares web, marcado semántico, código bien comentado y otras buenas prácticas. Cubro el tema de una manera minuciosa para explicar los comos y los porqués, sin sacar el código para copiar y pegar. Cuando te esfuerzas en comprender tu código, creas mejor trabajo y te vuelves mejor en lo que haces. El código ya no es solo tu trabajo, es tu oficio. Esta es la razón por la que amo Up & Going. Kyle nos lleva a una inmersión profunda a través de la sintaxis y la terminología para dar una gran introducción a JavaScript sin cortes. Este libro no navega sobre la superficie del lenguaje, sino que realmente nos permite entender los conceptos que estaremos escribiendo. Debido a que no es suficiente poder duplicar fragmentos jQuery en su sitio web, de la misma manera no es suficiente aprender a abrir, cerrar y guardar un documento en I- Up & Going podría crear y compartir un diseño que se hace. Pero sin conocer legítimamente las herramientas y lo que hay detrás de ellas, ¿cómo puedo definir una cuadrícula, crear un sistema de tipo legible u optimizar los gráficos para el uso de la web. Lo mismo ocurre con JavaScript. Sin saber cómo funcionan los bucles, o cómo definir variables, o qué alcance tiene, no estaremos escribiendo el mejor código que podamos. No queremos conformarnos con nada menor a ésto - esto es, después de todo, nuestro oficio. Cuanto más se exponen a JavaScript, más claro se vuelve. Palabras como closures, objetos y métodos pueden parecer fuera de alcance para usted ahora, pero este libro ayudará a entender estos términos con claridad. Quiero que mantenga esos dos sentimientos en mente antes y después de que aprenda algo al comenzar este libro. Puede parecer desalentador, pero has elegido este libro porque estás empezando un viaje impresionante para perfeccionar tu conocimiento. Up & Going es el comienzo de nuestro camino hacia la comprensión de la programación. Disfrute de los momentos bombilla! Jenn Lukas Jennlukas.com, @jennlukas Consultora de front-end 1.2 Inténtalo tú mismo Para mantener las cosas simples mientras estamos aprendiendo conceptos básicos de programación, los ejemplos en este libro no requerirán entrada. Pero ahora que has visto cómo usar el prompt (..), si quieres desafiarte puedes intentar usar la entrada en tus exploraciones de los ejemplos. 1.3 Operadores 1.3 Operadores Los operadores son la forma en que realizamos acciones sobre variables y valores. Ya hemos visto dos operadores de JavaScript, el = y el *. El operador * realiza la multiplicación matemática. Lo suficientemente simple, ¿no? El operador = igual se utiliza para la asignación - primero calculamos el valor en el lado derecho (valor fuente) de la = y luego ponerlo en la variable que especificamos en el lado izquierdo (variable objetivo). Advertencia: Esto puede parecer un orden inverso extraño para especificar asignación. En lugar de a = 42, algunos podrían preferir voltear el orden para que el valor de origen esté a la izquierda y la variable de destino a la derecha, como 42 -> a (JavaScript no válido). Desafortunadamente, la forma ordenada a = 42, y variaciones similares, es bastante frecuente en los lenguajes de programación modernos. Si se siente antinatural, sólo pase algún tiempo ensayando y el orden en su mente lo acostumbrará a ella. Considere: a = 2; b = a + 1; Aquí, asignamos el valor 2 a la variable a. A continuación, obtenemos el valor de la variable a (todavía 2), agregamos 1 a ella resultando en el valor 3, luego almacenamos ese valor en la variable b. Si bien técnicamente no es un operador, necesitará la palabra clave var en cada programa, ya que es la forma principal de declarar (aka crear) variables (consulte "Variables"). Siempre debe declarar la variable por nombre antes de usarla. Pero sólo es necesario declarar una variable una vez para cada ámbito (ver "Alcance"); Se puede utilizar tantas veces como sea necesario. Por ejemplo: var a = 20; a = a + 1; a = a * 2; console.log( a ); // 42 1.3 Operadores Éstos son algunos de los operadores más comunes en JavaScript: Asignación: = como en a = 2. Matemáticas: + (adición), - (sustracción), * (multiplicación) y / (división), como en a * 3. Asignación Compuesta : + =, - =, * =, y / = son operadores compuestos que combinan una operación matemática con asignación, como en a + = 2 (igual que a = a + 2). Incremento / Decremento: ++ (incremento), - (decremento), como en a ++ (similar a a = a + 1). Acceso a la propiedad del objeto:. Como en console.log (). Los objetos son valores que contienen otros valores en determinadas ubicaciones denominadas propiedades. obj.a significa un valor de objeto llamado obj con una propiedad del nombre a. Las propiedades se pueden acceder alternativamente como obj ["a"]. Consulte el Capítulo 2. Igualdad: == (suelto-igual), === (estricto-igual),! = (Suelto no-igual),! == (estricto no igual), como en a == b. Consulte "Valores y Tipos" y el Capítulo 2. Comparación: (mayor que), = (mayor que o suelto-igual), como en a