JavaScript: fundamentos de ES6 | Emma Williams | Skillshare

Velocidad de reproducción


1.0x


  • 0.5x
  • 0.75x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 1.75x
  • 2x

JavaScript: fundamentos de ES6

teacher avatar Emma Williams

Ve esta clase y miles más

Obtenga acceso ilimitado a todas las clases
Clases enseñadas por líderes de la industria y profesionales activos
Los temas incluyen ilustración, diseño, fotografía y más

Ve esta clase y miles más

Obtenga acceso ilimitado a todas las clases
Clases enseñadas por líderes de la industria y profesionales activos
Los temas incluyen ilustración, diseño, fotografía y más

Lecciones en esta clase

    • 1.

      Introducción

      1:14

    • 2.

      let y const

      2:15

    • 3.

      Alcance

      9:16

    • 4.

      Elevación

      3:58

    • 5.

      para... of y para... in

      3:31

    • 6.

      Introducción de literales de plantilla

      2:49

    • 7.

      Más literales de plantilla

      1:56

    • 8.

      Funciones de flecha

      3:20

    • 9.

      Abreviatura de propiedades de objetos

      3:25

    • 10.

      Congelación de objetos

      4:03

    • 11.

      Más información sobre objetos de congelación

      1:28

    • 12.

      Desestructuración de matrices

      4:30

    • 13.

      Desestructuración de objetos

      3:46

    • 14.

      Más desestructuración de objetos

      2:41

    • 15.

      Desestructuración de objetos anidados

      2:28

    • 16.

      Más desestructuración de objetos anidados

      3:02

    • 17.

      Parámetros de la función de desestructuración

      2:34

    • 18.

      Más desestructuración de parámetros de función

      1:53

    • 19.

      Parámetros predeterminados

      3:37

    • 20.

      Más parámetros predeterminados

      3:07

    • 21.

      Distribución en funciones

      3:28

    • 22.

      Más difusión en las funciones

      2:08

    • 23.

      Introducción de la propagación en objetos

      2:29

    • 24.

      Dispersión en objetos

      3:18

    • 25.

      Más difusión con objetos

      2:10

    • 26.

      Distribución en matrices

      4:21

    • 27.

      Introducción del parámetro rest

      3:52

    • 28.

      Uso del parámetro rest

      3:16

    • 29.

      Introducción de forEach

      3:39

    • 30.

      Uso de forEach

      3:04

    • 31.

      Introducción al mapa

      3:46

    • 32.

      Uso del mapa

      7:57

    • 33.

      Uso de filtro

      7:13

    • 34.

      Uso de find

      7:19

    • 35.

      Uso de algunos y cada

      6:40

    • 36.

      Notación de constructor de objetos

      8:48

    • 37.

      Introducción de prototipos

      4:08

    • 38.

      Más prototipos

      4:25

    • 39.

      Introducción a las clases

      3:06

    • 40.

      Más información sobre clases

      4:16

    • 41.

      Uso de clases

      1:39

    • 42.

      Introducción de promesas

      3:18

    • 43.

      Trabajo con promesas

      4:06

    • 44.

      Módulos

      6:31

  • --
  • Nivel principiante
  • Nivel intermedio
  • Nivel avanzado
  • Todos los niveles

Generado por la comunidad

El nivel se determina según la opinión de la mayoría de los estudiantes que han dejado reseñas en esta clase. La recomendación del profesor o de la profesora se muestra hasta que se recopilen al menos 5 reseñas de estudiantes.

90

Estudiantes

--

Proyectos

Acerca de esta clase

Este curso te enseñará los conceptos básicos de ES6 en el lenguaje de programación JavaScript.

Hay mucho contenido para aprender ES6, pero gran parte de esto no enseña el porqué de los conceptos. A través de ejemplos de código, este curso te enseñará todos los conceptos básicos de ES6 y te mostrará cómo se hacían las cosas antes. Al hacer esto, podrás trabajar con confianza y actualizar proyectos antiguos.

Comprender ES6 es una habilidad que te ayudará a obtener empleo en la industria hoy en día. ¡También es muy divertido trabajar con él! Si quieres trabajar con bibliotecas como React, es una habilidad fundamental y parte de tu viaje de aprendizaje.

Tomar este curso te permitirá sumergirte rápidamente en la sintaxis y comenzar a usar ES6 rápidamente. Uso ejemplos visuales y aplico los conceptos al día a día para que puedas recordar el conocimiento rápidamente.

Abordaremos los conceptos básicos, como el uso de let y const y for... de y for... en bucles. A continuación, analizaremos temas como la desestructuración y el uso del operador de propagación. Luego, veremos los métodos de ayuda de arreglos para dejar de escribir bucles y comprender cómo usar las clases de ES6. Terminaremos el curso analizando las promesas.

A través de videos divertidos y concisos y ejemplos de código seguidos de desafíos de código, completarás el curso con la confianza de que podrás escribir ES6 por tu cuenta.

Tanto si eres relativamente nuevo en la programación, como si solo quieres aprovechar algunos de los conocimientos que tienes, este curso te ayudará a obtener una caja de herramientas para convertirte en un mejor desarrollador.

Conoce a tu profesor(a)

Teacher Profile Image

Emma Williams

Profesor(a)

Habilidades relacionadas

Desarrollo Desarrollo web
Level: All Levels

Valoración de la clase

¿Se cumplieron las expectativas?
    ¡Superadas!
  • 0%
  • 0%
  • Un poco
  • 0%
  • No realmente
  • 0%

¿Por qué unirse a Skillshare?

Mira las galardonadas Skillshare Originals

Cada clase tiene lecciones cortas y proyectos prácticos

Tu membresía apoya a los profesores de Skillshare

Aprende desde cualquier lugar

Ve clases sobre la marcha con la aplicación de Skillshare. Progresa en línea o descarga las clases para verlas en el avión, el metro o donde sea que aprendas mejor.

Transcripciones

1. Introducción: Hola, bienvenidos a este curso sobre ES6 JavaScript. Javascript es uno de los lenguajes de programación más demandados en la actualidad. Y las habilidades ES6 son altamente demandadas. Si quieres trabajar con bibliotecas como React, learning, ASL es una parte esencial de tu viaje. En nuestro recorrido por ES6, a través de ejemplos, comenzaremos con lo básico como trabajar con let y const. Luego pasaremos a temas como D estructuración funciones de flecha y clases. Terminaremos el curso mirando promesas. Uno de los aspectos confusos cuando estabas aprendiendo ESX es entender dónde encaja con el código más antiguo. Este curso, te mostraremos dos ejemplos, cómo se hacían las cosas antes y ayudaron a responder el porqué detrás de los cambios y la sintaxis. Mi nombre es Emma, y he trabajado como programadora en el día de las industrias. Me encanta trabajar con JavaScript. Me encanta ayudar a otros a aprender el idioma. Espero que disfruten este curso. 2. dejar y const: En este video, vamos a ver let and const. Javascript tiene tres formas de crear una variable desde ES6, las dos primeras son mediante el uso de la palabra clave left o const Los comps latinos fueron introducidos en ES6. Antes de ES6, la única forma de crear una variable era usar la barra de palabras clave. Por lo que aún puede ver el código que usa esto y eso está bien. Pero en el futuro es mejor pegarse con diferencia de dominio const lateral entre usar ese o const es que las variables creadas con la palabra clave constante no se pueden cambiar una vez que se han creado. Si estás creando una variable y sabes el valor de esa variable no cambiará, entonces es mejor usar const. Algunos ejemplos pueden incluir los días de la semana o el año. Crearemos algunas variables en la consola usando const. Empezaremos creando una variable llamada days. Voy a asignar a esto una matriz que contenga lunes, martes, miércoles. Recordemos días. Vemos la matriz de nuestro día. Vamos a crear otra variable usando el código const de mi edad. Lo que le asignó el valor 100. Recordemos ahora la variable de edad. Podemos ver 100 se ha almacenado con éxito en la variable. Si sabes que el valor de la variable cambiará, entonces debes usar left cuando declares la variable. De lo contrario, obtendrás una conferencia de error, un ejemplo de esto al cambiar el valor de mi edad a nueve. Obtenemos un error de tipo no detectado con la asignación de mensaje a variable constante. Por lo que ahora vamos a crear una variable llamada Cambiar edad usando y le asignaremos a esto el valor dos. Ahora recordaremos la variable. Podemos ver que el valor de dos se ha almacenado con éxito en la variable. Ahora intentemos actualizar esto a tres. Por lo que decimos cambiar de edad equivale a tres. Ahora recordemos la variable de edad cambiante. Podemos ver que se ha actualizado con éxito. 3. Alcance: Hola. En este video, vamos a introducir alcance en JavaScript. En tu casa, es posible que tengas artículos, quizás en la cocina o en el pasillo, que son accesibles para cualquiera que viva allí. Entonces en tu habitación, es posible que tengas algunos artículos más personales que prefieras solo ser utilizados por ti mismo. Este ejemplo es esencialmente cómo funciona el alcance en JavaScript. Se trata de una definición de roles, la forma en que se puede acceder a variables , objetos y funciones cuando se ejecuta el código. Alcance en JavaScript define el contexto actual del código. Entonces en un nivel básico, hay dos ámbitos dentro de JavaScript, alcance global y alcance local. Y esencialmente, el estándar define qué variables son accesibles y visibles cuando el código se está ejecutando. Empecemos respondiendo a la pregunta, ¿cuál es el alcance global en los programas JavaScript tienen un alcance global, variables que están dentro del ámbito global o accesibles, cambiables y visibles desde cualquier lugar dentro de nuestro código. Variables en el ámbito global también están disponibles para toda la vida útil que ejecuta nuestro programa. Variables que se declaran fuera de una función o un bloque aparte del alcance global, es importante ser conscientes cuando estamos declarando variables en el ámbito global en cuanto a por qué lo estamos haciendo, declarar variables en el ámbito global puede comer memoria cuando se ejecuta el programa. Y la instancia de nomenclatura puede ocurrir cuando variables con el mismo nombre declaradas por separado dentro de diferentes ámbitos de nuestro código. Vamos a seguir adelante y escribir algún código. Empezaremos declarando una variable usando la cual llamaremos nuestra variable global. Se inicializará esto con la cadena Hola. Siguiente. A continuación, crea una declaración de función, que llamaremos alguna función. La función simplemente devolverá el valor de nuestra variable global. Por último, invocaremos esta función. Envolvamos esto en un registro de consola y ejecutaremos el código. Obtenemos el valor de la variable todo global devuelta, que es la cadena Hola. Todo esto es posible porque la variable son globales está en el ámbito global. Por lo tanto, es accesible desde cualquier lugar. Entonces, ¿cuál es el alcance local? Cuando entras a una habitación de tu casa, estás ingresando un ámbito local específico en la programación, cada vez que se crea un nuevo alcance dentro del ámbito global, por ejemplo, cada vez que creas una función y entonces se crea un nuevo ámbito local, cualquier variable creada dentro de este ámbito local solo será accesible desde dentro de esta función. Se podría pensar en esto un poco como decir, sólo se puede abrir y cerrar una ventana desde dentro de la habitación. Las ventanas de tu casa, los parámetros de función también se clasifican como estar dentro del ámbito local. Si intentas acceder a ellos desde fuera de la función, JavaScript arrojará un error. Desde ESX, podemos dividir el alcance local en dos partes, la función y el alcance del bloque. Cuando estamos utilizando variables hoy en día, generalmente usamos left o const, pero dada la cantidad de código escrito antes A6 aún vale la pena estar familiarizado con. Cada una de estas variables utiliza diferentes reglas de ámbito. Éstas son las siguientes. Lejos es el ámbito de la función, const es de ámbito de bloque y a la izquierda es de alcance de bloque. Empecemos respondiendo a la pregunta, ¿qué es el alcance de la función? Pero cuando se define una variable dentro de una función, podemos decir que la variable es el ámbito de la función. Si intenta acceder a una variable local desde fuera de la función desde donde se definió. Un error, específicamente un error de referencia, se lanzará al ejecutar el código. Las variables definidas con las palabras clave let and const se comportarán de la misma manera en ámbito de la función que lo hacen en bloque scape. Echemos un vistazo a algún código. Empezaremos creando una declaración de función llamada función sum. Dentro de esta función, vamos a seguir creando una variable usando let llamada nuestra variable local. Se inicializará esto con la cadena hola. Por último, queremos devolver la variable local de la función. Ahora fuera de la función, vamos a ver qué sucede cuando la consola cerramos la sesión del valor de la variable local. Ejecutaremos este código. Nos devuelven al error de referencia porque estamos tratando de acceder a una variable de ámbito local desde el ámbito global. Ahora repitamos nuevamente los mismos pasos, pero esta vez cambiaremos la variable para usar const como constante. Vamos, eh, ambos bloques cabra, nos golpeamos el mismo problema. Pasemos a mirar el alcance del bloque. En JavaScript, un bloque es una pieza de código que se anida dentro de un par de llaves rizadas. Las declaraciones condicionales y los bucles son ambos ejemplos de un bloque. Alcance de bloqueo significa que cada vez que se crea un bloque como un nuevo alcance local. Cuando creamos una variable dentro de un bloque, esa variable entonces se encamina a ese bloque. Esto significa que las variables entonces no son accesibles desde fuera del bloque. Si intenta acceder a una variable que se define dentro del bloque de código desde fuera del bloque. Javascript arrojará un error, específicamente un error de referencia. Pero tenga en cuenta que el alcance de bloque no se aplica cuando definimos variables con la palabra clave var. Entonces veamos algún código. Empezaremos creando una declaración de función, y esta vez lo llamaremos nuestro ejemplo de alcance. Dentro de esto, usaremos una declaración if. Diremos si es cierto. Dentro del bloque declarará una variable usando var. Y llamaremos a éste, inicializará esto con la cadena que fui creado usando la sentencia after the if. Consola registraremos la variable una. Entonces también ejecutará la función, ah, ejemplo de ámbito. Cuando se ejecuta el código, obtenemos la cadena de la variable una impresa a nuestra pantalla. El motivo por el que esto funciona es que la barra es el ámbito de la función, no se aplican tableros de alcance de bloque. Vamos a intentar esto de nuevo. Pero cambiaremos la variable de var a usar. Let también cambiaría el nombre de esta variable por ser dos. También actualicemos nuestro registro de consola se ejecutará de nuevo este código. Esta vez obtenemos un error de referencia. Esto se debe a que LET es de ámbito de bloque y no se puede acceder desde fuera del bloque que fue creado. Si quisiéramos hacer funcionar este código, necesitaríamos mover nuestro registro de consola al mismo bloque que la variable. Ahora obtenemos la cadena que fui creado usando impreso a la pantalla. Alternativamente, podríamos traer a la izquierda fuera del alcance del bloque e ingresar al alcance exterior de la función. alcance léxico es la forma en que un ámbito de función puede acceder a variables desde un ámbito externo o padre. La función interna o hijo está líxicamente vinculada a la función principal externa. Esto significa que una función puede acceder a todos los ámbitos desde suyos y luego hasta e incluyendo el alcance global. Entonces echemos un vistazo a un ejemplo. Empezaremos creando una declaración de función llamada padre externo. Dentro del cuerpo de la función creará una variable llamada una. Se inicializará esto con la cadena que fui creado con var. Luego crearemos otra variable. Pero esta vez usaremos left. Vamos a inicializar esto con la cadena con la que fui creado con left. A continuación, crearemos otra función llamada niño interno. Dentro del cuerpo de esta función se creará un registro de consola. Dentro de esto pondrá la variable una, pero también creará otro registro de consola. Esta vez vamos a poner la variable a fuera de esta función, llamaremos a la función hijo interior. Luego fuera de la función padre externa, llamaremos a la función padre externa. Pausa el video y mira si puedes adivinar qué se imprimirá a la consola. Ahora vamos a ejecutar este código. Cuando ejecutamos este código, obtenemos los dos registros de consola impresos en la consola. La función hijo interior está tratando de acceder a variables desde el ámbito externo cerrado. Esto significa que podemos acceder a los valores de estas variables sin un error. También podríamos mover las variables al alcance global, y esto funcionaría. También funcionaría si cambiamos la variable declarada usando led to use const. 4. ¡Levantamiento!: En este video, vamos a ver el levantamiento. Cuando usamos la palabra polipasto en el idioma inglés, estamos describiendo la acción de levantar o tirar algo hacia arriba. Podemos decir que una bandera es izada sobre un edificio o su automóvil con levantado fuera de un río. Hosting en JavaScript describe cuando las variables y las declaraciones de función el nombre a levantado o levantado a la parte superior de su ámbito local antes de que se ejecute el código. Así que solo para ser claros, ningún código se mueve físicamente, pero es la forma en que el compilador de JavaScript lee el código. Empecemos por mirar un ejemplo básico. Entonces en nuestro editor de texto, vamos a empezar por crear un log de consola, que generará el resultado de una variable que aún no hemos creado, pero se llamará MyDog. En la siguiente línea, vamos a seguir adelante y crear esta variable, que hará usando var. Vamos a decir bar, mi perro. Voy a asignar a esto el panecillo de cuerda. Ahora vamos a ejecutar este código. Nos quedamos indefinidos. Hosting es la razón detrás de por qué no recibimos un error cuando ejecutamos este código, el JavaScript y toque simplemente dividir la declaración y las etapas de asignación de la creación de la variable. La declaración es el VAR, parte de mi perro, y la asignación es el método equals. La parte de declaración se levanta a la parte superior del alcance actual antes de que se ejecute el código y inicialmente se le asigne el valor undefined. Esto significa que la variable myDog se puede usar antes de que se inicialice. Pero ¿qué pasa con let and const? Hemos mirado un ejemplo de cuándo se declara una variable con var. Ahora veamos lo que sucede cuando declaramos una variable con lead o const. Al declarar una variable con lead o const, hecho aún se levantan dos variables. No obstante, la diferencia es que cuando usamos bar, la declaración se le asigna el valor de undefined inicialmente hasta que ocurra la línea donde se produce la asignación que definimos. En ese punto se asigna a la variable el valor que asignamos con let, la variable no se le asigna inicialmente ningún valor. Si repetimos el ejemplo que hemos usado antes de usar left, podemos ver cómo funciona esto. Vamos a probar esto en nuestro editor de texto. Crearemos un registro de consola, que dará salida a mi perro. A continuación usando left, crearemos la variable myDog y asignaremos a esto el muffin de cadena. Ahora vamos a ejecutar esto. Obtenemos un error de referencia no capturado. Esta vez cuando el código ejecuta la declaración, la parte que dice deja que mi perro sea levantado a lo alto del alcance por el compilador. Pero la variable es inicialmente sin inicializar. A diferencia de la barra, cuando inicialmente se inicializó con undefined. Cuando el código se ejecuta, el código se ejecuta, el registro de la consola sucede antes de que hayamos asignado algún valor a la variable. Obtenemos el error de referencia arriba. Disuadir variables con const funciona de la misma manera. El motivo detrás de este hecho se conoce como la zona muerta temporal. La zona muerta temporal describe un estado temporalmente inactivo donde no se pueden utilizar las variables. Esto sucede porque JavaScript compila el código antes de ejecutar el código. Si eres un checkout de supermercado, eres admitido estado entre haber compilado en tus comestibles, que probablemente tengas espacio listo para en casa. No obstante, aún no las poseas físicamente, por lo que no puedes usarlas hasta que hayas completado la fase de checkout en el supermercado. Terminemos con algunos ejemplos. 5. El tiempo en el que se trata...: Antes de ESX, si quisiéramos iterar a través de algunos datos, como una matriz, podríamos usar un bucle for. Esta sigue siendo una buena opción para nosotros, Pero desde ES6, tenemos algunas opciones adicionales cuando estamos iterando a través de cualquier cosa que sea iterable. Entonces las cadenas son matrices, por ejemplo, podemos usar un for de loop. Esto evita la necesidad de utilizar índices para incrementar el uso de variables como contador. Cuando usamos cuatro de la variable en sí pitones el elemento, no el índice. Echemos un vistazo. Declarar una variable llamada bebidas. Asignará a esto una matriz. Dentro de la matriz, agregaremos las cadenas. Cola, té, portero, y refresco. Ahora usará un bucle for para imprimir cada elemento en la matriz. Utilizamos la palabra clave para y dentro de los paréntesis, creamos una variable llamada i. decimos que menos que bebidas longitud de punto. Después incrementamos i. Dentro del cuerpo del bucle, consolamos las bebidas de registro de AI usando corchetes. Guardemos esto y ejecutemos el código. Recibimos todas nuestras bebidas impresas a la consola. Volvamos a nuestro código, vamos a comentar nuestro bucle for. Ahora vamos a implementar esto de nuevo usando un for de loop. Entonces usamos la palabra clave para y un conjunto de paréntesis dentro los paréntesis dirá que no se puede beber bebidas. Dentro del bucle. Decimos registro de consola, bebida. Guardemos esto y ejecutemos el código. Seguimos obteniendo cada bebida impresa a la consola para que los bucles no funcionen si quieres iterar a través de un objeto. Si quisieras hacer esto, debes usar para n, vamos a cambiar nuestra matriz de bebidas para que sea un objeto. Agregaremos las bebidas. También voy a fijar algunos precios. Ahora vamos a usar para n. decimos cuatro. Después entre paréntesis, const, bebe, en bebidas. Dentro de la bebida de registro de consola dúplex. Guardaremos esto y ejecutaremos el código. Obtenemos la llave impresa a la consola. Si quisiéramos imprimir el valor de cada propiedad, podemos usar corchetes en el cuerpo del bucle. Esta vez decimos bebidas, que es el nombre del objeto, corchetes, bebida. Guardemos esto y ejecutemos el código. Obtenemos el valor de cada clave devuelta como nota al margen en la caída y caída en bucles. Debido a ESX, podemos usar const para la variable en el bucle. Esto se debe a que cada vez que el bucle itera, se crea un nuevo alcance, lo que significa que podemos usar lead o contenido en estos bucles. Y constante es agradable porque no solemos cambiar el valor de lo iterable. Sin embargo, esto no funcionará en un bucle estándar. 6. Presentando literales de plantilla: Bienvenido de nuevo. En este video, vamos a ver qué literales de plantilla son en JavaScript, cuáles son nuestros literales de plantilla. Pues bien, en la versión ES6 de JavaScript, se introdujeron literales de plantilla antes de ES6. Si tuviéramos una variable que quisiéramos usar dentro de nuestras cadenas, tendríamos que usar concatenación. Echemos un vistazo rápido a esto. Vamos a crear una declaración de función podría imprimir bebida. Dentro de la función usando var, crearemos una variable llamada bebida. Asignaremos a esto la cadena t Ahora vamos a devolver una cadena de nuestra función. Diremos que mi bebida favorita es. Entonces usa el operador de concatenación para agregar un espacio. Y luego usa nuevamente el operador de concatenación para anexar la variable de bebida. Llamemos a la función print drink dentro de un registro de consola guardaremos esto y ejecutaremos el código. Recibimos mi bebida favorita es T impresa a la consola. Entonces esto funciona. Pero los literales de plantilla ofrecen una forma limpia de interpelar o inyectar las variables o expresiones en la cadena, lugar de tener que hacer la concatenación. Un literal de plantilla está encerrado en Bautistas en lugar de las habituales comillas dobles o simples. interpolación de cadenas describe cuándo se inyectan variables en una cadena. La variable que deseas interpelar está envuelta dentro de llaves rizadas, luego comenzó con un signo de dólar. La variable en sí se coloca dentro de los tirantes rizados. Veamos el ejemplo anterior, pero esta vez usando un literal de plantilla, cambiará nuestra variable para usar left. A pesar de que esto funcionaría con barra. Ahora vamos a cambiar nuestra cuerda. Eliminará todo después de la primera cadena, luego cambiará la cadena para usar ticks back para que sea un literal de plantilla. Ahora, vamos a interpelar en la variable bebida. Utilizamos el signo del dólar y un conjunto de llaves rizadas. Dentro de los tirantes rizados, agregamos el nombre de la variable que queremos inyectar. Guardemos esto y ejecutemos el código. Cuando se invoca la función, obtenemos el mismo valor de retorno. Pero nuestro código es mucho más limpio. 7. Más plantillas literales: Otra característica útil de los literales de plantilla es que podemos abarcar austriacos sobre múltiples líneas. Antes de ES6, tendría que usar la concatenación de cadenas o un carácter de nueva línea para lograr esto. Veamos un ejemplo rápido. Dirigiría nuestro código. Luego usando var agregará una variable llamada nuestra cadena. Asignaría a esta cadena dirá primera línea. Después agregaremos el nuevo carácter de línea. Segunda línea. El nuevo carácter de línea, tercera línea, el carácter de nueva línea. Ahora agreguemos un registro de consola para la variable descendencia. guardaremos y ejecutaremos el código. Vemos cada parte de la cadena impresa sobre múltiples líneas. Tenemos literales de plantilla. Ya no tenemos que preocuparnos por esto. Si queríamos crear una cadena multilínea, podemos hacerlo encerrando la cadena y las ticks de atrás y separando las líneas, vamos a actualizar nuestro código. Empezaremos eliminando todos los caracteres de nueva línea. Actualizaremos nuestra variable para usar. Entonces envolveremos la cuerda en backticks. Vamos a guardar esto y vamos a ejecutar el código. Nada ha cambiado. Obtenemos el mismo resultado. Pero de nuevo, voy a codificar es mucho más limpio. 8. Funciones de flecha: En este video, vamos a ver las funciones y parámetros de flecha en JavaScript. Primero sin embargo, demos un paso atrás y discutamos las expresiones de función. ¿ Qué es una expresión de función? Bueno, una expresión de función describe cuando una función se almacena dentro de una variable. Podemos declarar una expresión de función con nombre donde la función tenga un nombre. Pero generalmente una expresión de función no tiene nombre. Nos referimos a esto como una función anónima. Las funciones anónimas son especialmente útiles cuando nuestro principal uso para la función es pasar la función como argumento a otra función. El motivo detrás de por qué esto es posible es porque las funciones son objetos en JavaScript. Al invocar o llamar a una expresión de función, se utiliza el nombre de la variable, no el nombre de la función. Cuando se utiliza una expresión de función, el intérprete de JavaScript no hará nada con la función hasta que llegue a la línea donde se inicializa la función. Veamos un ejemplo de expresiones de función. Vamos a crear una función que tomará como cadena el nombre de un juego. Y usando una plantilla literal, imprimirá el nombre del juego en la pantalla. Pero empecemos creando la variable para mantener la función, que llamaremos mi juego favorito. A continuación, usamos el signo igual. La palabra clave function establecerá el parámetro como juego. Dentro del cuerpo de la función, queremos devolver una plantilla literal, que acabamos de decir. Mi juego favorito es. Y luego interpolaremos el juego. Llamará a la función dentro del registro de la consola. Y pasaremos en el monopolio de cuerdas como argumento. Digamos esto y dale una oportunidad. Cuando ejecutamos la función, obtenemos nuestra cadena impresa a la pantalla con el monopolio del juego que pasamos como argumento donde encajan las funciones de flecha. Es6 introdujo la sintaxis de la función de flecha, lo que significó que podemos omitir la función de palabra clave. Volvamos a nuestro código y actualizado eliminando la palabra clave function agregará la sintaxis de la función de flecha. Seguimos obteniendo la misma cadena devuelta. Si sólo necesitamos devolver un valor de la función, podemos simplificar esto aún más y omitir las llaves rizadas y el retorno de la palabra clave. Sólo estamos usando una sentencia de una sola línea. Esto se conoce como una función de flecha de línea única. Volvamos a nuestro código y actualizemos esto. Por lo que se convierte en una sola función de flecha de línea. Guardaremos esto y ejecutaremos el código. Seguimos obteniendo el mismo valor de retorno. 9. Propiedad de objetos: En este video, vamos a ver la taquigrafía propiedad del objeto. Imaginemos que estamos escribiendo un programa que nos requirió modelar algunos datos sobre alguna ropa. Para ello, podemos usar un objeto. Veamos cómo podemos resolver este problema si lo estuviéramos haciendo antes de ES6, empezaremos creando una declaración de función, que llamaremos create wardrobe. Dentro de la función se crearán cuatro variables usando var. Y tendrán los artículos de ropa y el número de esos artículos que tenemos en nuestro armario. Empecemos creando una variable llamada hat. Vamos a establecer esto igual a uno. Vamos a crear otra variable llamada shots. Vamos a establecer esto igual a cinco. Crearemos una variable para jumper. Vamos a establecer esto igual a ocho. Por último, vamos a crear una variable para calcetines, y vamos a establecer esto es igual a dos. A continuación, crearemos un objeto literal, que llamaremos mi vestuario. Tendrá las mismas claves que las variables anteriores. Y establece cada valor a las variables anteriores. Se pondrá sombrero Para sombrero, pantalones cortos. Para aparecer. Saltador, jumper, calcetines. Calcetines. Entonces devolverá el objeto. Consola registra el valor de retorno de ejecutar el create water y la función ejecutará este código. Obtenemos cada ítem con los valores que establecemos en las variables ítems. Cuando se creó ES6, introdujo la abreviatura de la propiedad del objeto. La abreviatura propiedad del objeto nos permite simplemente pasar el nombre de la claveen el nombre de la clave lugar de repetir el nombre y la clave. Nada ha cambiado en la forma funciona el código bajo el capó. Pero la taquigrafía nos ayuda a escribir menos código. Esto es lo que se conoce como azúcar sintáctica. Tomemos la función create wardrobe y veamos otra vez. Pero esta vez usaremos la abreviatura propiedad del objeto. Empezaremos cambiando la función para que sea una expresión de función ES6. A continuación, actualizará nuestras variables para utilizarlo. A continuación, actualizaremos nuestro objeto literal para usar left. También podemos eliminar los pares clave-valor y simplemente pasar los nombres de las variables. Volvamos a ejecutar este código. La salida del registro de la consola es la misma, pero el código en sí es mucho más simple. 10. Congelación de objetos: Hola. En este video vamos a ver el congelamiento de objetos. Es6 introdujo let and const para declarar variables. Cuando declaras una variable usando const, entonces no puedes reasignar la variable. Echemos un vistazo rápido a un ejemplo de esto en la consola. Crearemos una variable usando const. Lo llamaremos un valor. Vamos a inicializar esto con el valor uno. A continuación, trataremos de cambiar esto al valor dos. Obtenemos un error de tipo no capturado basado en la asignación a una variable constante. Veamos otro ejemplo. Esta vez en nuestro editor de texto. Vamos a utilizar un objeto literal va a crear un objeto usando CONST, y llamaremos a esto, nuestro objeto, va a crear una propiedad llamada animal. Uno. Le dará a esto el valor, el gato de cuerda creará una segunda propiedad llamada animal para darle a este el perro de cuerda. Por último, vamos a crear una tercera propiedad llamada Animal tres, le dará a este el valor la forma de las cuerdas. Posteriormente. Intentaremos usar el signo igual para reasignar el objeto para que sea un objeto vacío. Vamos a ejecutar este código. Nuevamente. Obtenemos un error de tipo no capturado. Tratemos de entender por qué obtenemos este error más profundamente. Cuando usamos el término mutable, estamos describiendo algo que se puede cambiar. Objetos en JavaScript que se asignan a una variable usando const un mutable. Esto incluye objetos, matrices y funciones. Es importante entender esto porque el uso const solo detiene el nombre de la variable, el identificador de variables se reasigne, no el objeto en sí. Si queríamos cambiar el animal una propiedad para ser vaca, podemos hacer lo siguiente. Usaríamos el nombre del objeto, que es nuestro objeto. La clave de la propiedad que queremos cambiar, que es animal uno. Entonces usando el signo igual, ponemos esto igual a la vaca de cuerda. Vamos a ejecutar esto. Obtenemos el objeto R impreso a nuestra consola y animal uno se ha cambiado con éxito a vaca. Sea claro, esto no funcionaría con uno de los tipos de datos primitivos, como cadenas, porque las cadenas son inmutables. Echemos un vistazo rápido a esto en la consola. Crearemos una variable usando CONST y la llamaremos nuestra cadena. Vamos a inicializar esto con la cadena Hola. Ahora, vamos a tratar de cambiar el segundo elemento de la cadena para que sea la letra O. Entonces diremos nuestra cadena y luego corchetes con el índice uno. Vamos a la consola de registro nuestra cadena. Nada ha cambiado y la cuerda sigue siendo alta. Entonces para resumir, puedes cambiar o mutar el objeto en sí, pero no puedes cambiar el nombre ni el identificador de la variable en la que se almacena el objeto. Esto es como decir, puedes cambiar la declaración de tu casa, pero no puedes cambiar su dirección. En el siguiente video, vamos a ver cómo podemos dejar de mutar objetos. 11. Más sobre objetos congelados: Bienvenido de nuevo. ¿Cómo dejamos de mutar objetos? Petrificamos que no se puede simplemente detener que los datos dentro de un objeto se muten con solo usar const. Sin embargo, puedes usar un método proporcionado por el congelamiento de código JavaScript. Este método es parte del objeto estándar de objeto incorporado. Una vez que haya utilizado este método, no podrá cambiar el objeto. Y si estás ejecutando tu código usando el modo estricto, se lanzará una flecha. El valor de retorno del método será objeto, que fue pasado a la función. La sintaxis para esto es la siguiente. Objeto frase punto, paréntesis, luego el nombre de tu objeto. Tratemos de usar esto con el objeto de arte creado en el último video. Después de que se haya creado el literal del objeto, usaremos el método de congelación de puntos objeto y pasaremos en el objeto. Salvemos esto y ejecutemos esto. Obtenemos el objeto R devuelto a nosotros. Pero ahora intentemos cambiar el animal una propiedad para ser vaca de nuevo, igual que lo hicimos en el último video. Guardaremos esto e intentaremos volver a ejecutar el código. Nada ha cambiado y se devuelve el objeto original. 12. Desestructuración de matrices: El objetivo de este video es introducir un raid, la estructuración y JavaScript. Imagina que visitas un supermercado, recoges algunos artículos y los empacas en bolsas. Cuando llegas a casa, uno por uno, desempacas estos artículos y los guardas. Cuando estamos escribiendo código, podemos usar la estructuración como una forma de desempaquetar, escogeremos ciertos elementos de estructuras de datos, como objetos y matrices. Y luego podemos colocar estos elementos en sus propias variables independientes. Antes de ES6, si queríamos escoger ciertos elementos de una estructura de datos, como una matriz, tenemos que usar el índice del elemento y luego guardarlo en una variable. Veamos cómo abordaríamos esto. Empezaremos declarando una variable llamada Days y asignada a esta y matriz. Esta matriz reemplazará los siete días de la semana como cadenas. A continuación, declararemos tres variables. Primero, segundo. Tercero. Queremos conseguir el primer segundo, tercer elementos de la Deseret. Dentro del primero, usando notación de corchete, obtendremos el primer elemento, el elemento en el índice de 0. El segundo obtendrá el segundo elemento. Esto está en el índice de uno. El tercero obtendrá el tercer elemento, el elemento del índice de dos. Ahora agreguemos registros de consola para la primera segunda, tercera variables, y vamos a seguir adelante y ejecutar esto. Obtenemos los tres primeros elementos de la matriz del día, imprimirlo a nuestra pantalla. Si bien este enfoque funciona, hay una forma mucho más sencilla de resolver este problema. Y esto usa una estructuración radiofónica. Utilizando la estructuración, podemos escoger los elementos requeridos en una línea de código. Para ello, creamos una matriz. Y dentro de la matriz, colocamos los nombres a los que deseamos llamar a las variables para los elementos a asignar. A continuación, utilizamos el operador equals y lo configuramos el nombre de la matriz donde desea escoger los elementos. Las variables en la matriz se establecerán en el valor equivalente del elemento en la matriz inicial función de la posición de ese elemento. Echemos un vistazo al ejemplo original, pero esta vez usando la estructuración, todavía tenemos nuestros días de distancia. Pero ahora usando la estructuración, crearemos una matriz usando const. Vamos a establecer esto igual a la matriz del día. Dentro de la matriz, agregaremos las variables primero, segundo, tercero, estos serán los nombres de las variables a las que deseamos asignar nuestros elementos. Volvamos a ejecutar este código. Obtenemos el mismo valor de retorno. Hay algunas características adicionales de una estructuración de radio que vale la pena entender. La estructuración también nos permite omitir un índice y el elemento mediante el uso de una coma. Si quisiéramos escoger los elementos primero, segundo, cuarto de la matriz del día. Utilizaríamos este enfoque. Volvamos a nuestro ejemplo y probemos esto. Agregará una coma donde estaba nuestro tercer elemento, y luego agregará una variable para el cuarto elemento. También agreguemos un registro de consola para esta variable. Vamos a ejecutar esto otra vez. Ahora como se puede ver, obtenemos el jueves impreso a la pantalla para el cuarto elemento. Otra cosa que podemos hacer con una estructuración de radio es usar el operador resto para recolectar los valores restantes de la matriz inicial en una variable. Vamos a darle una oportunidad a esto. Eliminaremos todo menos la variable primero. Y ahora usando el operador de descanso para recoger todo lo demás en una variable llamada días restantes. También actualiza nuestros registros de consola. Entonces vamos a ejecutar este código. Esta vez obtenemos el lunes como primer elemento. La variable de días restantes ahora contiene todo lo demás en la matriz excepto el lunes. 13. Destructuración de objetos: Bienvenido de nuevo. Vamos a introducir la estructuración del objeto d. Empecemos respondiendo a la pregunta. ¿ Cuál es la estructuración? Qué Imagina que visitas un supermercado, recoges algunos artículos y bolsas Pac-Men. Cuando llegas a casa uno por uno, desempacas estos artículos y los guardas. Cuando estamos escribiendo código, podemos usar la estructuración como una forma de desempaquetar o escoger ciertos elementos o elementos de estructuras de datos, como objetos y matrices. Y luego podemos colocar estos valores en sus propias variables independientes cuando estamos usando estas estructurando con objetos, el nombre de las variables para las que se asignan los valores del objeto se basa en el nombre de la propiedad objeto en contraposición al índice del elemento. Cuando hacemos una estructuración lista, cuando te interrumpimos eres una matriz, usamos corchetes. Pero cuando D estructuramos un objeto, usamos llaves rizadas. Empecemos con un ejemplo muy básico. Crearemos una variable usando const, la que llamaremos objeto R. Será un objeto literal dentro del objeto tendrá dos propiedades. El primero usaremos el clave, y tendrá el valor uno. El segundo usaremos la clave para, y tendremos el valor dos. Ahora podemos usar la estructuración dirá const, luego usar llaves rizadas. Y vamos a establecer esto igual al objeto. Dentro de los tirantes rizados sumarán 12. Ahora vamos a la consola log 12. guardaremos y ejecutaremos el código. Obtenemos los valores de las 12 propiedades de nuestro objeto. Al seleccionar las propiedades del objeto que desea elegir, el pedido no importa. Si el nombre de la propiedad se encuentra en el objeto, entonces una variable con ese valor se almacenará en la memoria usando el mismo nombre. Echemos un vistazo a un ejemplo más concreto. Empezaremos creando una nueva variable usando const. Llamaremos a este gato, va a crear otro objeto literal. Estableceremos una propiedad name y obtendremos este valor de cadena. Molly entonces establecerá una propiedad propietaria y obtendrá esta cuerda mal. Tú Fred bloqueando. A continuación vamos a poner el color, le daremos a esta la cuerda marrón. Vamos a establecer una propiedad de edad y darle a este el valor diez. Por último, vamos a crear una propiedad gatitos, le dará a este el valor 0. A continuación, podemos utilizar alguna estructuración D para obtener el nombre y el propietario. Entonces empezaremos usando un conjunto de llaves rizadas. Y vamos a establecer esto igual a nuestro objeto, que se llama gato. Dentro de los tirantes rizados colocarán los nombres de la propiedad. Agreguemos registros de consola para estos. Diremos console.log, nombre, console.log. Vamos a salvar esto. Y vamos a ejecutar el código. Obtenemos Mali por el nombre impreso a la pantalla, y Fred bloqueando para el propietario impreso en la pantalla. En el siguiente video, veremos esto un poco más. 14. Más destructuración de objetos: Bienvenido de nuevo. ¿ Qué pasa de las propiedades indefinidas? Bueno, si intenta seleccionar una propiedad que no existe en el objeto original, se creará una variable con ese nombre, pero el valor de la variable será indefinido. No habrá ningún error arrojado menos extender nuestro último ejemplo para mostrar esto. Eliminaría nombre y propietario del destructor. Durante este tiempo, agregaremos pies. Pies no es una propiedad en el objeto gato. Pero vamos a tratar de consola de registro. Esto. Ahorrará esto. Y le daremos una oportunidad. Nos imprimimos indefinidos a la pantalla. No hay propiedad pies en el objeto cat, por lo que no hay valor que asignar a la variable. Ahora veamos el cambio de nombre de las propiedades. Si desea nombrar las variables algo diferente a lo que está la propiedad en el objeto. Es necesario establecer esto cuando estructura la propiedad desde el objeto. Para ello, se utiliza el nombre de la propiedad que desea seleccionar de los dos puntos del objeto y el nombre de la variable en la que desea almacenar este valor. Veamos un ejemplo dejaría pies de la estructuración. Esta vez trataremos de acceder a los gatitos, pero cambiaremos el nombre de esto a niños. Diremos gatitos, niños de colon. Ahora agreguemos un registro de consola para niños. Ahorrará esto y le dará una oportunidad. Obtenemos 0 impreso a la pantalla, que es el valor de la propiedad gatitos dentro del objeto cat. Al igual que cuando hacemos una estructuración de radio, podemos usar el operador de descanso para recoger todo lo que queda en una nueva variable. Vamos a extender nuestro último ejemplo para recoger todas las propiedades restantes en una variable llamada restante civil keep children. Pero hablar con esto usando el operador de descanso. Agregará una variable llamada restante. A continuación, también agregará un registro de consola para la variable restante. Vamos a salvar esto. Y vamos a ejecutar el código. Vemos 0 por los niños regresaron. Después de esto, vemos todas las demás propiedades y valores del objeto gato, excepción de la propiedad gatitos impresa a nuestra pantalla. 15. Destructuración de objetos anidados: Entonces en este video vamos a ver destructor de objetos anidados. En el último video, miramos el destructor de objetos y también podemos usar la estructuración cuando estamos trabajando con estructuras de datos anidadas como objetos anidados. Comencemos mirando la estructuración un objeto anidado que está encerrado dentro de una matriz. Crearemos una colección de gatos, declararemos una variable llamada gatos y asignada a esta matriz. A continuación, crearemos un objeto. Dentro de este objeto se establecerá el nombre a la cadena Molly, la cadena Fred luck en color. La cadena marrón, el valor diez, y gatita los valores 0. Luego crearemos un segundo objeto. Dentro de este objeto. Establecer nombre, bombilla a Sally, color a negro, y gatitos a 0. Vamos a crear un objeto más. Esta vez pondremos nombre a Poppy, phono, a Alice green. Color. Tapping. Tres gatitos. 16. Más destructuración de objetos anidados: Si quisiéramos escoger el nombre del gato en el segundo objeto, que es Bob. Podemos utilizar la estructuración para lograr esto, dado que el objeto se almacena dentro de una matriz, comenzamos con los corchetes que utiliza la matriz. Establecemos esto igual al nombre de la estructura de datos a partir de la cual estamos tratando de escoger las propiedades. Queremos acceder al segundo objeto. Así que al igual que cuando estamos estructurando matrices planos, podemos usar una coma para omitir un elemento. Luego usamos llaves rizadas porque queremos ir dentro del objeto y usamos el nombre de la propiedad que queremos escoger del objeto, al igual que cuando deestructuramos valores de un objeto. Vamos a darle una vuelta a esto. Por lo que usamos const y luego un conjunto de corchetes. Ponemos esto igual al nombre de nuestro objeto anidado, que son gatos. Dentro de los corchetes. Empezamos usando una coma. Hacemos esto porque queremos saltar al segundo objeto. A continuación, agregamos un conjunto de llaves rizadas. Dentro de los tirantes rizados, usamos el nombre de la propiedad que queremos, que es nombre. Ahora agreguemos un registro de consola para el nombre. Vamos a salvar esto. Y vamos a ejecutar el código. Nos devuelve Bob, que es el valor de la propiedad name del segundo objeto. Entonces al igual que con el objeto la estructuración, también podemos darle a la variable un nombre diferente al nombre de la propiedad. Actualicemos nuestro código para lograr esto. Y usaremos el nombre del gato, el nombre, colon de la escalera después del nombre, y luego agregaremos el nombre del gato. También cambiemos nuestro registro de consola al nombre de cat. guardaremos y ejecutaremos el código. Seguimos consiguiendo que Bob regresara. Si estuviéramos trabajando con un objeto anidado encerrado dentro de un objeto, no usaríamos corchetes cuando realizamos la estructuración D. En cambio usaríamos llaves rizadas y el nombre del objeto del que queremos escoger el elemento, seguido del nombre de la propiedad que queremos escoger. Actualicemos nuestra estructura de datos, eliminaremos los corchetes, los cambiaremos por llaves rizadas. También agregará uno antes del primer objeto a antes del segundo objeto y tres antes del tercer objeto. Ahora en nuestra reestructuración también cambiaría los corchetes para ser llaves rizadas porque ahora estamos trabajando con objetos y objetos. A continuación añadimos la clave del objeto, que en nuestro caso son dos, seguido de dos puntos. Guarda esto y ejecuta el código. Seguimos consiguiendo que Bob regresara. Este es el nombre de la propiedad en el segundo objeto. 17. Parámetros de función de destructuración: Hola. En este video vamos a ver los parámetros de la función de estructuración y JavaScript. Estas Estructuración se pueden utilizar dentro de los paréntesis de la definición de función, donde se colocan los parámetros. Lo haces con el fin de escoger valores de los argumentos pasados a una función. Esto es muy útil cuando solo se desea utilizar ciertas propiedades de un objeto dentro de la función. No marca la diferencia qué tipo de función usas. Pero vamos a echar un vistazo a un ejemplo que usa una función de flecha. Entonces dos d estructuran un objeto dentro de parámetros de funciones. Colocamos un conjunto de llaves rizadas dentro de los paréntesis de la función. Dentro de los tirantes rizados sustituyen las propiedades del objeto que deseamos escoger. Empezaremos declarando una variable usando const, que llamaremos bebidas, le asignará a esto un objeto literal. Dentro de este objeto se creará una propiedad llamada cola. Consigue esto. El valor dos. Agregará limonada con el valor uno, leche. El valor tres. T. Con el valor dos. Café con el valor dos, y vino con el valor ocho. A continuación, crearemos una función de flecha. Llamaremos a esto precios de bebidas calientes. El cuerpo de la función devolverá el total de agregar té y café de las bebidas. Objeto. Para escoger las propiedades del té y el café, utilizamos los tirantes rizados dentro de los parámetros de la función, y luego escogemos las propiedades del té y el café. Ahora llamemos a la función. Pasaremos en todo el objeto de bebidas como argumento. Vamos a salvar esto. Muévete por el código. Obtenemos cuatro devueltos porque T tenía el valor dos, y el café también tenía el valor dos. Entonces sumando estos juntos, obtenemos para el siguiente video, pasaremos a mirar la estructuración una matriz dentro de parámetros de funciones. 18. Más función de destructuración de parámetros: Bienvenido de nuevo. Entonces, mientras que la estructuración dentro de los parámetros de funciones se usa más comúnmente con objetos, pero también es capaz de usar el mismo enfoque cuando pasamos en una matriz a una función. La única diferencia es que dentro de los paréntesis de la función, encerramos los ítems que queremos escoger dentro de una matriz. Orden importa aquí. Al igual que cuando realizamos una estructuración lista fuera de los parámetros de la función. Si queremos omitir un elemento, entonces podemos usar una coma. Veamos un ejemplo. Empezaremos declarando una variable llamada nombres. Asignado a esto una matriz. Dentro de la matriz. Agregaremos las cuerdas, Frank, ben, Tony y Pete. Ahora vamos a crear una función de flecha, que llamaremos print name. Esta función devolverá un literal de plantilla con los segundos terceros nombres de la matriz Names. Dentro de los paréntesis de la función. Nos detuvimos usando una coma porque queremos saltar al segundo elemento array. A continuación, declaramos variables a los segundos terceros elementos que se almacenarán en. Ahora llamemos a la función de nombre de impresión. Pasaremos en toda la matriz de nombres como argumento. Vamos a guardar esto y vamos a ejecutar el código. Conseguimos que Luke y Ben regresen. El segundo, los terceros nombres de la matriz de nombres. 19. Parámetros predeterminados: Bienvenido de nuevo. En este video vamos a introducir parámetros predeterminados. Si definimos una función que requiere que utilicemos algunos parámetros, cuando invocamos o llamamos a la función, necesitamos pasar los valores para los parámetros como argumentos. Así que echemos un vistazo rápido a un ejemplo básico. Crearemos una declaración de función llamada mi nombre. La función tomará dos parámetros, FirstName y LastName. Dentro del cuerpo de la función devolverá una plantilla literal. Necesitamos usar ticks back, interpelar los parámetros FirstName, LastName. Ahora invoquemos la función. Pasaremos dos argumentos, la cadena Bob para el parámetro firstName y la cadena para el parámetro apellido. Guardemos esto y ejecutemos el código. Conseguimos que Bob MF regresara. Esto funciona muy bien, pero ¿qué pasa si olvidamos pasar en uno de los argumentos? Echemos otro vistazo. Vamos a eliminar el segundo argumento de la llamada a la función. Vamos a guardar esto, volveremos a ejecutar el código. Esta vez conseguimos que Bob undefined regresara. No pasamos en un segundo argumento a la llamada de función. Cuando la función se ejecuta undefined se devuelve para el segundo parámetro. Si estuviéramos haciendo algunos cálculos matemáticos, esto causaría mayores problemas porque no podemos usar undefined para realizar ningún cálculo. Por lo tanto, conseguiríamos a NAn no un número devuelto. Veamos, esto en acción. Eliminará nuestro código. Crearemos una nueva función, que llamaremos Awesome. Esto tomará dos parámetros, tau1 y tau2. Dentro de la función devolverá el total de sumar por uno y tau dos. Vamos a ejecutar la función. Pero lo que sólo pasa en un argumento para pow1, pasaremos en el valor uno. Vamos a guardar esto y vamos a ejecutar el código. No nos devuelve un número. Javascript no puede agregar undefined a un número, por lo que sucede esto. ¿ Cómo nos protegemos de esto? Bueno, antes de ES6, podríamos establecer parámetros predeterminados para las funciones nosotros mismos. Si volvemos a usar el ejemplo impresionante, podemos ver cómo funciona esto. Dentro de la función impresionante creará una declaración if. Utilizará el tipo de operador para verificar usando estricta igualdad. Si el parámetro Baotou es igual a undefined. pena señalar aquí que el tipo de operador devuelve una cadena, razón por la cual al usar igualdad estricta, necesitamos verificar la cadena indefinida en lugar de simplemente indefinido. Si lo hace igual a undefined, vamos a establecer archivo para igualar el valor tres. Vamos a guardar esto y vamos a ejecutar el código. Cuando ejecutamos la función, obtenemos cuatro devueltos. Sólo pasamos en el argumento para val1. Val2 se establece en el valor predeterminado de tres. El total equivale a cuatro. Ahora entendemos el porqué en el siguiente video, pasaremos a mirar cómo usar los parámetros predeterminados de ES6. 20. Más parámetros predeterminados: Bienvenido de nuevo. Entonces desde CS6, hemos podido usar parámetros predeterminados, todo lo que se requiere es que establezcamos el valor predeterminado para el parámetro. Cuando definimos el parámetro dentro de los paréntesis de la función, si se pasa el valor para ese parámetro, cuando se llama a la función, entonces no se utilizará el valor predeterminado. Pero si no se pasa ningún argumento para ese parámetro que se utilizará el valor predeterminado. Prueba echa un vistazo al último ejemplo, pero esta vez usaremos parámetros predeterminados usando el mismo código del ejemplo anterior. Vamos a establecer el parámetro val2 para usar un valor predeterminado de tres. Podemos entonces eliminar la declaración if del último ejemplo. Guardemos esto y ejecutemos el código. Conseguimos cuatro de nuevo. No pasamos un argumento para el parámetro Baotou. Entonces se utiliza el valor predeterminado de tres y el retorno total es cuatro. Vamos a intentar esto de nuevo. Pero esta vez pasaremos en un argumento para el parámetro Baotou. Vamos a pasar en cinco. Vamos a guardar esto y vamos a ejecutar el código. Obtenemos seis es el valor de retorno. Como no pasamos en ningún argumento para ambos parámetros, no necesitamos retroceder a parámetros predeterminados como los valores de los argumentos que pasamos en los que se usan uno más cinco es igual a seis. Podemos utilizar parámetros predeterminados para diferentes tipos de valores, incluyendo cadenas y matrices. Volvamos a nuestro código. Revisitaremos un ejemplo anterior. Vamos a cambiar nuestra función para que nos llamen mi nombre. Cambiará los parámetros para ser FirstName. Y LastName cambiará el cuerpo de la función para devolver una plantilla literal. Entonces usaremos backticks. Interpelar los parámetros FirstName y LastName. Vamos a establecer un parámetro predeterminado para el apellido. Lo pondremos igual a. Ahora llamemos a la función Mi nombre. Pasaremos un argumento para el parámetro firstName. Pasaremos en Bob. No pasaremos nada por el parámetro de segundo nombre. Guardemos esto y ejecutemos el código. Conseguimos que Bob Murphy tonifique. No pasamos un argumento para el segundo parámetro. Se utiliza el parámetro predeterminado. Si tuviéramos una función que necesitara usar una matriz, entonces podemos usarla como parámetro predeterminado para, eliminemos nuestro código. Crearemos una función llamada nuestra matriz. Dentro de los parámetros se establecerá un parámetro llamado R le dará a este el valor predeterminado de una matriz que contiene uno. 23 dentro de la función devolverá el parámetro r. Llamemos a nuestra función. No pasaremos nada por el argumento. Guardemos esto y ejecutemos el código. Obtenemos la matriz de parámetros por defecto devuelta conteniendo 123. 21. Difusión en funciones: Bienvenido de nuevo. En este video, vamos a ver cómo usar spread en funciones JavaScript. Pero empecemos respondiendo a la pregunta, ¿qué se propaga? El operador de spread fue introducido por ES6. Consta de tres puntos. Dependiendo de dónde y cómo uses spread, puedes lograr una serie de cosas. Los tres usos principales para spread o dentro de funciones, objetos y matrices. La mayoría de las definiciones de estado de propagación, es decir, le permite expandir un iterable a otro lugar como una variable. Un iterable es una estructura de datos que puedes iterar. Por ejemplo, cuando hacemos un bucle a través de cada elemento en una matriz, estamos iterando sobre la matriz. Echemos un vistazo a por qué podría usar pan. Javascript tiene un conjunto de métodos adjuntos al objeto matemático incorporado, que nos permiten encontrar el número mínimo y máximo de un conjunto de valores pasados. Cuando usamos estos métodos. Estos métodos y math.max y Math.min. Si quisiéramos encontrar el valor mínimo de un conjunto de números, podríamos usar el método Math.min. Echemos un vistazo a cómo funciona esto. Empezamos con el objeto matemático. Llamamos al método Min. Usa punto y di Min. Dentro de los paréntesis, pasamos en algunos argumentos, pasaremos en 10987. Vamos a ejecutar esto. Nos devuelven siete. Debajo del capó. Javascript itera a través de estos valores y devuelve el valor más bajo. Esto es genial. Pero, ¿y si nuestros valores se almacenan en una matriz? Vamos a intentar esto de nuevo. Pero esta vez crearemos una matriz y la pasaremos como argumento. Usando const ocurriría una variable llamada valores asignados a este y array con los valores 10987. Ahora volvamos a usar el método Min. Esta vez pasamos en valores como argumento. Obtenemos a NAn no regresó un número. El motivo detrás de esto es que la función recibirá toda la matriz como un solo argumento. Necesita los valores desde dentro de la matriz como argumentos separados. Aquí es donde podemos usar spread porque la matriz se romperá en elementos individuales. Vamos a probar el mismo ejemplo, pero esta vez usando el operador spread, volverá a llamar al método principal. Esta vez utilizando el operador de spread. Pasamos en valores. Ahora nos devuelven siete. Si se usa spread dentro los paréntesis de una función cool, como argumento, entonces el iterable pasado a los parámetros de función se dividirá en argumentos individuales. Cuando usamos spread con nuestro ejemplo, la función recibe entonces cuatro argumentos separados. 22. Más extendido en funciones: Bienvenido de nuevo. En el último video, presentamos al operador de spread. También podemos usar spread dentro de la función. Echemos un vistazo a esto. Si enumeramos los parámetros estarán utilizando dentro los paréntesis de la función y pasamos en un iterable usando spread. Cuando llamamos a la función, podemos acceder a los elementos individuales. Echemos un vistazo a esto. Empezaremos usando una declaración de función. Para una función llamada total. Esto tomará tres parámetros. llamaremos rápido. Segundo. Tercero, dentro del cuerpo de la función. Sumaremos estos juntos. Después de la función. Vamos a crear una matriz que asignará a una variable usando contenido. Dentro de la matriz, colocará los valores 123. Ahora llamemos a la función total dentro de un registro de consola. Usando el operador de propagación pasará en la matriz de vocales. Vamos a guardar esto y vamos a ejecutar el código. Obtenemos seis como valor de retorno. Cuando se llama a la función total, la matriz de valores se pasa a la función total como argumento. Utiliza el operador de spread. Entonces la matriz se divide en elementos individuales. Cuando se ejecuta la función. Primero se establece en uno, el segundo se establece en, y el tercero se establece en tres. Por lo tanto, se devuelve seis. 23. Introduce la propagación en objetos: Bienvenido de nuevo. En este video, vamos a ver el uso spread en objetos JavaScript. Empecemos con una introducción rápida. Cuando usamos el operador spread dentro de un objeto, podemos copiar sobre propiedades de un objeto a otro, y podemos combinar juntos varios objetos en un objeto de destino. También podemos dar esto un paso más allá y extender el objeto de destino para que contenga los objetos copiados y también propiedades adicionales. Entonces echemos un vistazo a un ejemplo. Usando const. Crearemos una variable llamada Alien. daremos a esto una propiedad de especie con el valor de cadena. Alien también le dará a esto una propiedad de armas con el valor cinco. A continuación, crearemos otro objeto al que llamaremos OVNI. Dentro del objeto OVNI, usaremos el operador spread para copiar sobre el objeto alienígena. También agregaría una propiedad piernas con el valor cinco. Ahora agreguemos un registro de consola para UFO. guardaremos y ejecutaremos el código. Cuando ejecutamos el código, obtenemos un objeto que tiene todas las propiedades del objeto alienígena y la propiedad patas adicionales. Había algunas cosas a tener en cuenta cuando se utiliza el operador de propagación con objetos. Cuando el objeto en el que se extendió y el objeto padre tienen propiedades conflictivas, vale la pena recordar que la propiedad se sobrescribirá. El valor final del inmueble será el último que fue rojo cuando se ejecute el programa. Echemos un vistazo a esto. Agreguemos una propiedad de hazaña a nuestro objeto alienígena. Vamos a conseguir esto el valor nueve. Añadamos también una propiedad de hazaña a nuestro objeto OVNI. Esta vez le daremos el valor de seis. Vamos a salvar esto. Y vamos a ejecutar nuestro código. Cuando se ejecuta el código, el objeto devuelto tiene los pies de propiedad con el valor seis. Esto se debe a que cuando se ejecutó el código, OVNI fue el último objeto en establecer la propiedad pies. 24. Difusión en objetos: Cuando se trabaja con el operador de propagación y los objetos, puede copiar objetos copiados. Echemos un vistazo a un ejemplo. Mantendremos nuestros objetos alienígenas y OVNI a la misma, pero agregaremos otro objeto llamado OVNI copiado. Dentro de este objeto usando spread, copiaremos el objeto OVNI. Actualizaremos nuestro registro de consola para mostrar el objeto OVNI copiado. Guardemos esto y ejecutemos el código. El objeto UF copiado simplemente devuelve una copia del objeto UFO. Por lo que obtenemos las mismas propiedades devueltas cuando usamos un registro de consola para el objeto UFO copiado. Vale la pena señalar aquí sin embargo, que el operador de spread con objetos solo hace una copia poco profunda del objeto. Se copia la dirección del objeto. Los dos objetos no serán estrictamente iguales ya que se almacenan por referencia, no por valor. Podemos aclarar esto cambiando nuestro registro de consola para comprobar si el OVNI es estrictamente igual al OVNI copiado. Guardemos esto y ejecutemos el código. Nos pongamos falsos. Debido a esto las instancias anidadas del objeto no serán copiadas. Echemos un vistazo a un ejemplo de cómo funciona la copia superficial. Después del objeto OVNI copiado. Cambiemos los objetos OVNI como propiedad a igual a uno. Actualizaremos nuestro registro de consola para imprimir el objeto OVNI copiado. También agregaremos un registro de consola para mostrar el objeto OVNI. Guardemos esto y ejecutemos el código. Cuando actualizamos la propiedad legs en el objeto UFO y la consola registramos el objeto OVNI copiado. Podemos ver que la propiedad piernas del objeto OVNI no se ha visto afectada. Cuando consolemos cerrar sesión el objeto OVNI, podemos ver que este es ahora uno. No obstante, si cambiamos la propiedad dentro de un objeto anidado, ambos objetos serían cambiados. Echemos un vistazo. Agreguemos una nueva propiedad a nuestro objeto OVNI llamado viaje. Hará de esto un objeto. Dentro de esto, estableceremos una propiedad de longitud. daremos a esto el valor 9 mil. Después de actualizar la propiedad piernas OVNI, también vamos a actualizar nuestra propiedad recorrido longitud. Decimos longitud de punto de viaje OVNI, y lo pondremos igual a diez. Solo vamos a la consola registramos el OVNI copiado esta vez. Guardemos esto y ejecutemos el código. Cuando se ejecuta el código, podemos ver que mientras las piernas no se cambian en el OVNI copiado, la propiedad length sí. 25. Más propagación con objetos: Por lo que ahora estamos familiarizados con el operador de spread en objetos. Echemos un vistazo a cómo funciona esto con diferentes estructuras de datos. Sólo se pueden difundir objetos en objetos. No se puede extender un objeto en una matriz. Limpiemos nuestro código. Entonces nos queda sólo con el objeto alienígena. Ahora, vamos a crear una variable usando const. Podría nuestra matriz. Asignaremos a esto una matriz. Usando spread intentará copiar el objeto alienígena. Guardemos esto y ejecutemos el código. Obtenemos un error de tipo no capturado con el mensaje alienígena no es iterable. Lo que podemos hacer es difundir un objeto en un objeto en una matriz. Así que intentemos esto y arregle nuestro código. Dentro de nuestra matriz. Envolveremos al operador de spread dentro de llaves rizadas. Guardemos esto y ejecutemos el código. Esto funciona. Obtenemos una matriz con el objeto alienígena devuelto. También puedes extender una matriz en un objeto, pero terminarás con pares de clave y valor basados en los índices de los elementos. Eliminemos todo nuestro código. Crearemos una variable usando const llamadas letras. Dentro de esta matriz se agregarán a, B y C. A continuación vamos a crear otra matriz llamada Alphabet. Asignaremos a esto un objeto usando spread. Copiaremos cartas. También agreguemos un registro de consola para Alphabet. guardaremos y ejecutaremos el código. Obtenemos pares de clave y valor devueltos con cada letra. 26. Diseminación en matrices: Hola. En este video vamos a ver cómo usar spread en matrices JavaScript. Ahora que hemos aprendido a usar el operador de spread con funciones, echemos un vistazo a cómo usar el operador de spread con matrices. Cuando se trabaja con matrices, si desea hacer una copia de una matriz o combinar múltiples matrices, entonces el operador de propagación es muy útil. Cuando se utiliza el operador de propagación dentro de una matriz. Se extenderá el contenido en otra matriz. La matriz o matrices originales permanecen sin cambios. Veamos un ejemplo básico. Empezaremos usando const para crear una variable llamada primero. Vamos a inicializar esto con una matriz que contiene 13. A continuación, crearemos otra variable usando código de codones. Segundo, inicializar esto con una matriz que contiene 456. Ahora vamos a crear una variable llamada count six. Vamos a inicializar esto con una matriz. Pero dentro de esta matriz usará spread para copiar en el ayuno. Y también el segundo borrado. Agreguemos un registro de consola para contar hasta seis. guardaremos y ejecutaremos el código. Obtenemos una sola matriz que contiene todos los elementos tanto de la primera como de la segunda matrices. Al usar el operador de spread con el aumento vale la pena señalar que el orden sí importa dependiendo de cómo desee que se ordenen los elementos de la matriz. También podemos agregar elementos adicionales junto a los que utilizamos el operador de spread. Echemos un vistazo a esto en nuestro siguiente ejemplo. En nuestro código, cambiaremos nuestro recuento a seis array, se llamen recuento a siete. Dentro de la matriz, agregaremos el valor siete. Actualicemos nuestro registro de consola guardaremos esto y ejecutaremos el código. Esta vez. Obtenemos los siete valores enumerados en la matriz de contador siete. Si usa spread para copiar las matrices, entonces no serán iguales entre sí porque matrices se almacenan por referencia, no por valor. Entonces es una referencia a la matriz almacenada en la memoria de la computadora. No los valores de las matrices mismas. Pero esto no se aplica a las estructuras de datos anidadas. Volvamos a nuestro código y eliminemos todo. Empezaremos declarando una variable usando el código const. Matriz inicial asignaría a esto una matriz que contendrá las letras a, b, y c. A continuación, crearemos otra variable, esta vez código copia matriz inicial. Le asignaremos a esto una matriz. Usando el operador de spread, copiará la matriz inicial en ella. Ahora usando el operador de igualdad estricta, comparemos la matriz inicial y la matriz inicial de copia dentro de un registro de consola guardará esto y ejecutaremos nuestro código. Nos pongamos falsos. Y esto se debe a que las matrices se almacenan por referencia, no por valor. Es una referencia a la matriz almacenada en la memoria de la computadora, no a los valores de la matriz en sí. 27. Introduciendo el parámetro de descanso: Bienvenido de nuevo. En este video vamos a ver el uso de parámetros de descanso, pero empecemos por mirar los argumentos de función. Cuando creamos una función, a menudo establecemos parámetros para usar dentro del cuerpo de la función, pasamos los valores para estos parámetros cuando llamamos o invocamos la función, llamamos a estos valores argumentos. Echemos un vistazo a un ejemplo básico. Empezaremos creando una declaración de función llamada Add. Esto tomará dos parámetros por uno. Y val2. Dentro del cuerpo de la función devolverá el total de sumar por L1 y L2. Entonces llamaremos a la función. Pasaremos en uno. Y por los argumentos. Vamos a salvar esto. Y vamos a ejecutar el código. Obtenemos cinco retorno ¿ el total de sumar 14 juntos? Javascript proporciona un objeto llamado objeto arguments, que es accesible desde el interior de una función. El objeto argumento parece similar a una matriz, pero no es una matriz. Si no puede usar métodos re a menos que lo convierta en una matriz, el objeto arguments es una lista. Los elementos sí tienen índices, y por lo tanto podemos recorrer los elementos usando un for-loop. Echemos un vistazo usando el ejemplo anterior. En lugar de sumar los parámetros se agregará un registro de consola para el objeto arguments. Guardemos esto y ejecutemos el código. Esta vez vemos los argumentos objeto impresos a la consola. Cuando se invoca la función add, pasamos dos argumentos. Podemos ver estos en los argumentos objeto impreso desde el bloqueo de consola en la función. Si queríamos acceder a los argumentos, podemos hacerlo utilizando los índices de los argumentos. Vayamos a implementar esto. Dentro de la consola, log utilizará los índices 01 para acceder a los elementos. Ahora guardemos esto y ejecutemos el código. Esta vez podemos ver los argumentos que pasamos a la función add 14 impresos a la consola. También podríamos usar un bucle para iterar sobre los argumentos, igual que lo haríamos con una matriz. Vamos a implementar esto en nuestro cuerpo de función agregará un bucle, por lo que usamos la palabra clave completa. Usaremos la variable I, y la configuraremos igual a 0. Vamos a decir que es menor que argumentos longitud de punto, y luego vamos a incrementar i Cada vez que se ejecute el bucle. El cuerpo del bucle, vamos a consola log argumentos de I. Vamos a guardar esto y ejecutaremos el código. Obtenemos cada argumento impreso a la consola, uno y luego cuatro. En nuestro caso, podríamos agregar algunos argumentos adicionales a la llamada a la función. Entonces a pesar de que estos no están en los parámetros de función, todavía se imprimirán en la consola. Agreguemos 56 más. Guarde esto. Estoy corriendo el código. Obtenemos todos los argumentos que pasamos impresos a la consola. Vale la pena señalar que no podemos acceder al objeto arguments cuando usamos una función de flecha. Si tratamos de hacer esto, vamos a obtener un error. Veamos un ejemplo rápido. Entonces cambiaremos nuestra función para ser una función de flecha. Ahora guardemos esto y ejecutemos el código. Esta vez obtenemos un error de referencia que dice que los argumentos no están definidos. En el siguiente video, pasaremos a mirar el parámetro rest. 28. Uso del parámetro de descanso: Bienvenido de nuevo. Es6 introdujo el parámetro rest. Esto nos permite resolver los mismos problemas que los argumentos objeto, pero es mucho más simple. La sintaxis para el parámetro rest es la misma que el operador de spread. Entonces usamos tres puntos, pero funciona de manera muy diferente. El parámetro rest recogerá todo en una sola matriz si queremos usar una función que acepte cualquier número de argumentos, o si tenemos una larga lista de argumentos para pasar a una función como el alfabeto. Es muy útil usar el parámetro rest. Lo colocamos dentro de los paréntesis de función usando tres puntos seguidos de un nombre para que podamos acceder a la matriz desde el interior de la función. Echemos un vistazo a un ejemplo. Cambiemos nuestra función add del último video a ser una declaración de función. Ahora, vamos a usar el parámetro rest, que llamaremos valores dentro de los paréntesis de función. También agregaremos un registro de consola para valores en el cuerpo de la función. Vamos a salvar esto. Y vamos a ejecutar el código. Cuando se ejecuta el código, obtenemos una matriz. Existen algunas diferencias con el parámetro rest en comparación con el objeto arguments. El parámetro rest solo devolverá los argumentos restantes que aún no se han emparejado con el parámetro anterior. Por lo tanto, si tuviéramos que establecer un parámetro para el valor uno, los valores de distancia ahora solo contendrán un elemento. Echemos un vistazo a esto. Dentro de los parámetros de función add agregarán valor uno para el primer parámetro. Entonces mantengamos el parámetro rest para el segundo parámetro. Salvemos esto. Y vamos a ejecutar el código. Esta vez. Cuando se ejecuta el código, solo obtenemos cuatro como el valor de retorno porque el argumento uno se establece como valor un parámetro. Por lo tanto, el único argumento restante es para si desea establecer parámetros y usar el parámetro rest, es importante considerar que es necesario establecer los parámetros antes de utilizar el parámetro rest, dado que el retorno del parámetro rest son los valores restantes. Si utiliza primero el parámetro rest y luego establece el parámetro valor uno, obtendría un error de sintaxis. Vamos a cambiar nuestro código, mostrar cómo sucedería esto. Cambiaremos el orden de nuestros parámetros. El parámetro rest se usa primero. Vamos a salvar esto. Y vamos a ejecutar el código. Obtenemos un error de sintaxis no detectado, que dice que el parámetro rest debe ser el último parámetro formal. Por último, también podemos usar el parámetro rest dentro de una función de flecha. A diferencia del objeto argumentos, vamos a cambiar nuestro código para implementar esto. Cambiará la declaración de función para ser una función de flecha que cambiará los parámetros para usar solo el parámetro rest. Guardemos esto y ejecutemos el código. Esta vez obtenemos todos los argumentos que hemos pasado cuando el código corre 14 impreso a nuestra pantalla. 29. Presentando para cada uno: En este video, vamos a introducir el método forEach. Javascript tiene una colección de métodos de ayuda de matriz que se introdujeron en ES6. Si estás familiarizado con bibliotecas como el guión bajo o el guión bajo, algunos de estos métodos pueden ser familiares para ti ya. En ES6, se introdujeron en el lenguaje JavaScript. Los métodos de un ayudante correcto nos ayudan a manipular y trabajar con datos almacenados dentro de una matriz. En este video, vamos a introducir uno de estos métodos que se llama para-cada uno. ¿ Qué es para cada uno? Bueno, para cada uno llamado una función una vez por cada elemento dentro de una matriz que empiece con un ejemplo muy básico de usar para cada uno, comenzaremos declarando una variable usando const le dará a este identificador. Nuestros números inicializarán esto con una matriz. Y en la matriz pondremos algunos números. A continuación, utilizamos el método forEach. Llamamos a ForEach en la matriz de nuestros números. Dentro de los parámetros de método, pasamos en una función anónima. Podemos nombrar el parámetro de función anónima todo lo que queramos, pero representa el elemento individual. Llamaremos al parámetro en nuestro número de ejemplo. Dentro del cuerpo, vamos a registrar la consola el valor del parámetro número. Guardemos esto y ejecutemos el código. Cuando se ejecuta el código, obtenemos cada elemento de la matriz de números impares, imprimirlo a nuestra pantalla. Vamos a recapitular algunos puntos antes de seguir adelante. Cuando usamos para cada uno, la función de devolución de llamada que el método acepta se llama una vez por cada elemento dentro la matriz que usa el método forEach. Por lo general, tiene sentido usar una función anónima para la devolución de llamada porque el código no va a ser reutilizado. Pero podríamos pasar el método una función con nombre si queríamos. Veamos cómo haríamos esto, guardaremos nuestro código actual, pero después de crear la matriz de números impares usaremos una declaración de función, que llamaremos número de impresión. Más conjunto de parámetros numéricos. Dentro de la función, vamos a registrar la consola el parámetro número. Ahora cuando llamemos para cada uno, simplemente pasaremos el número de impresión ya que el parámetro eliminará todo lo demás. Guardemos esto y ejecutemos el código. Obtenemos el mismo valor de retorno. Como nota al margen, pasamos una referencia a la función para, para cada uno. Recuerda que no usamos paréntesis cuando pasas en la función así. Pero ¿qué pasa con los bucles? Podríamos lograr el mismo resultado que lo hicimos en nuestro ejemplo usando un bucle. Comparemos algunos ejemplos. Crearemos un for de bucle después de la matriz de números. Entonces diremos por eso dentro los paréntesis se declarará una variable usando left llamada nums. Entonces diremos de los números. Dentro del bucle, vamos a la consola de registro nums. Guardemos esto y ejecutemos el código. Obtenemos el mismo resultado tanto del cool también para cada uno y de nuestro bucle usando tanto un bucle for como un for de bucle proporciona la misma salida que está usando para cada uno. La elección de cuál usar realmente se reduce a lo que estás tratando de lograr. Pero usar para cada uno suele ser menos propenso a errores porque tienes menos configuración de la que preocuparte. A menudo usar forEach también es más legible. En el siguiente video, seguiremos a ver algunos ejemplos adicionales de uso para cada uno. 30. Usando para cada uno: En este video, vamos a ver algunos ejemplos adicionales de usar ForEach usará el mismo código que el ejemplo anterior. Pero esta vez vamos a añadir uno a cada elemento. De vuelta en nuestro código. Simplemente decimos número más uno. Guardemos esto y ejecutemos el código. Obtenemos cada elemento de nuestros números con uno agregado a cada valor. Si quisiéramos acceder al índice del elemento, podríamos simplemente pasarlo otro parámetro después del parámetro numérico. Vamos a darle una oportunidad a esto. Agregaremos el parámetro index tras numero, y luego iremos el número de registro de la consola y el índice. Guardemos esto y ejecutemos el código. Obtenemos cada número de la matriz de números impares impreso y luego el índice de cada elemento también. Tal vez nos gustaría obtener la suma total de la matriz de números impares usando para cada uno que pudiéramos lograr esto. Vamos a ir. Después de haber creado la matriz de números impares, crearemos una variable usando LED, que llamaremos a algunos, inicializará esto con los valores 0. Podemos pensar en esto un poco como un rastreador, que sostendrá el total corriente de nuestros elementos ya que cada elemento se suma. Dentro de para cada uno, luego agregamos el número que representa el elemento actual al sol. A continuación, la consola registramos el total de la suma, que es el total de todos los elementos de matriz de números impares agregados juntos. Guardemos esto y ejecutemos el código. Obtenemos el total de todos los elementos agregados para cada uno es particularmente útil cuando estamos trabajando con datos anidados. Veamos un ejemplo. Declararemos una variable llamada estudiantes. Asignaría a esto una matriz dentro de la llegada colocar tres objetos. El objeto rápido que le pusimos nombre a Anna a los 50 años. En el segundo objeto establecerá el nombre Pete, edad a 20. El tercer objeto establecerá el nombre. Api, edad a 12 años. Luego usará para cada uno en los alumnos. Por lo que decimos estudiantes. Para cada uno. Pasamos en la devolución de llamada. Y establecemos el parámetro como estudiante. Vamos a registrar la consola el nombre del estudiante usando el método TOupperCase. A continuación, deslice esto y ejecute el código. Obtenemos cada nombre impreso a la pantalla de la estructura de datos de los estudiantes con cada nombre en mayúsculas. 31. Mapa de presentación: En este video, vamos a ver mapa. ¿ Qué hace el mapa? Cuando usamos map, podemos crear una nueva matriz a partir de una matriz preexistente. Pasamos una función de devolución de llamada, y esta función es llamada en cada elemento dentro de la matriz. Usando el método, puede construir una nueva matriz haciendo algo a los elementos originales. Algunos ejemplos de lo que puedes hacer con el mapa incluyen elegir ciertos elementos, simplemente duplicar la matriz. Aunque la propagación podría ser más simple para esto, o manipular los datos de la matriz de alguna manera. Hay algunos puntos clave cuando estás trabajando con el mapa de forma rápida, debes devolver algo. De lo contrario obtendrá una nueva matriz poblada con undefined para cada elemento. También debes almacenar la llamada para mapear en una variable. De lo contrario no tendrás ninguna referencia a la nueva matriz. El array inicial no se cambia, pero se crea una nueva matriz cuando usamos map. Veamos algunos ejemplos. Si tuvieras una matriz de valores, pero querías duplicar cada uno de los valores. Mapa nos permite hacer esto. Empezaremos declarando una variable llamada valores. Y le asignaremos a esto una matriz que contenga diez, 20304050. A continuación, declararemos otra variable llamada duplicada. Esto almacenará el valor de retorno desde el uso de matemáticas. Llamará mapa en la matriz de valores. Decimos Valores mapa de puntos. Después pasamos en la devolución de llamada. Estableceremos el parámetro para que cada elemento sea valor. Luego devolvemos el valor multiplicado por dos. Ahora vamos a los valores de registro de consola. También se duplicó el registro de consola. Guardemos esto y ejecutemos el código. se ha cambiado nada en la matriz de valores porque el método no mutará ni cambiará la matriz original. No obstante, cuando nos fijamos en el doble, que es la matriz devuelta de usar map, podemos ver que los elementos de la matriz de valores se ha duplicado. Vale la pena señalar que pasamos una función anónima es la devolución de llamada al mapa. Podrías pasar aquí una función con nombre. Pero como solo estamos usando esta vez, una función anónima suele ser más adecuada. Por lo que podríamos lograr fácilmente el mismo resultado con un for-loop. Pero el código será mucho más complicado y por lo tanto propenso a errores. Pero echemos un vistazo a cómo hacemos esto. Comentaremos el primer ejemplo. Mantendremos la matriz de valores también creará una variable llamada duplicada. Asignaremos a esto una matriz vacía. A continuación, vamos a crear un for-loop. Dentro del bucle, empujará cada elemento multiplicado por dos en la matriz duplicada. Guarda esto y ejecuta el código. Obtenemos la misma salida que antes, pero el código es un poco más complejo. En el siguiente video, volveremos a mirar mapa. 32. Usando mapa: Bienvenido de nuevo. En este video, vamos a ver algunos ejemplos más de uso de mapa. Podemos usar map para manipular una matriz de cadenas misma facilidad que cuando trabajamos con una matriz de números. Vamos a tomar una serie de saludos en mayúsculas y devolverlos todos en minúsculas. Empezaremos creando una variable llamada saludos. Voy a asignar a esto una matriz que contenga las cadenas en mayúsculas. Por lo que pasa. A continuación, crearemos otra variable llamada saludos formateados. Asignado a esto el resultado de llamar a mapa en la matriz de saludos. Decimos saludos mapa de puntos. Después pasamos en la devolución de llamada. Vamos a establecer el parámetro es saludo. Entonces voltearemos el saludo usando el método de dos minúsculas. Agreguemos registros de consola a saludos. Y también saludos formateados. Guardaremos esto y ejecutaremos el código. Nada ha cambiado para la matriz de saludos porque esta matriz no se muta. El array de saludos formateado, que es el array return from map, contiene cada saludo de la matriz de saludos, pero con cada cadena en minúscula, si no hubiéramos anidado la estructura de datos y quería escoger una de las propiedades y luego crear una matriz con estos valores. Mapa también es ideal. Echemos un vistazo a esto. Crearemos una variable usando const, que llamaremos estudiantes asignarán a esto y array. Esta matriz contendrá tres objetos. En el primer objeto, establecemos una propiedad name. Conseguimos esto el valor. Anna también establecería una propiedad de edad y le daría a este el valor 50. El segundo objeto que ponemos nombre a Pete y edad a 20 años. El tercer objeto, pusimos nombre a Abby y edad a 12 años. Ahora crearemos una variable usando const code edades estudiantiles. Asignaremos a esto el resultado del uso de mapa. La estructura de datos de los alumnos. Establecemos el parámetro de la devolución de llamada como estudiante. Entonces devolvemos el valor del alumno. Agreguemos un registro de consola para edades estudiantiles. Guardaremos esto y ejecutaremos el código. Obtenemos una matriz que contiene las edades de la estructura de datos de los estudiantes. También podríamos devolver una matriz de objetos desde el uso de map. Vamos a usar la matriz de estudiantes de nuevo. Pero el formato de los valores cambiará el nombre para que sea todo minúsculas. Y agregaremos uno a cada una de las edades de los alumnos. Cambiemos la variable de edades de los estudiantes para ser estudiantes actualizados. Eliminemos la devolución. Cambiaremos esto para devolver un objeto. Dentro del objeto, agregaremos el nombre de la clave en minúscula. Estableceremos el valor de esto para ser estudiante. Nombre de punto, punto dos minúsculas. También pondremos otra clave para ser h más una. Estableceremos el valor de esto para ser estudiante dot más uno. Cambiemos nuestro registro de consola para mostrar a los estudiantes actualizados. Guardaremos esto y ejecutaremos el código. Obtenemos una matriz que contiene tres objetos con las propiedades que configuramos dentro nuestra devolución de llamada cuando usamos el método map, nombre minúsculas, y la edad más uno. Hablé de no devolver nada al interior del murciélago fresco para mapear. Hace que se devuelva una matriz de valores indefinidos. Veamos un ejemplo de esto. Llevaría todo nuestro código. Crearemos una variable llamada letras. Le asignó una matriz, que contendrá las cadenas a, b, y c. Vamos a crear otra variable llamada uppercased. Esto almacenará nuestra matriz devuelta desde el uso del mapa. Llamaremos a las letras mapa de puntos. Pasaremos en la devolución de llamada. Estableceremos el parámetro como letra. Entonces diremos punto de letra. Touppercase. Sepa que no estamos usando volver aquí. Agreguemos un registro de consola para letras. También agreguemos un registro de consola para mayúsculas. Guardaremos esto y ejecutaremos el código. Obtenemos la matriz de letras como se esperaba, porque map no muta la matriz original. Sin embargo, para mayúsculas, obtenemos una matriz devuelta poblada con undefined para cada elemento. No usamos el retorno, por lo que se espera esto. Agreguemos el regreso de nuevo a nuestra devolución de llamada. Guardaremos esto y ejecutaremos el código. Esta vez obtenemos la matriz poblada con las letras mayúsculas. 33. Usando filtro: Bienvenido de nuevo. En este video, vamos a ver el uso del método filter en JavaScript cuando estamos trabajando con matrices, una de las tareas comunes que podemos encontrar que necesitamos lograr es filtrar algunos datos de la matriz. Quizás solo queremos devolver el elemento impar o par dentro de una matriz de números. Tal vez solo queremos que la matriz devuelva cadenas que contiene ciertos caracteres cuando tenemos este tipo de escenario, el método de filtro de matriz puede ser extremadamente útil. ¿ Cómo usamos foto para usar el método de filtro, pasamos al método una devolución de llamada. Por lo general se trata de una función anónima, aunque podemos pasar en una referencia a una función, la función callback que pasamos en actúa como una función de prueba y necesita devolver un booleano tan verdadero o falso. Si el elemento pasa esta función de prueba y más verdadero devuelto, entonces el elemento se agregará a la matriz devuelta. Si el elemento no pasa la función de prueba que el elemento no se agregará a la matriz devuelta. El array original no se muta cuando se utiliza el método filter. Al igual que con los otros métodos de salud de rayos, posible que podamos lograr nuestro resultado deseado mediante el uso de un for-loop. Por lo general, sin embargo, el método de salud de la matriz nos permite escribir código que es más legible y extensible. Empecemos sin embargo mirando un ejemplo que devuelve los números pares de una matriz de valores. Empezaremos haciendo esto con una tabla para bucle. Declarar una variable usando const, que llamaremos valores, inicializará esto con una matriz. Dentro de la matriz, agregaremos algunos números. A continuación, inicializamos otra variable, la que llamaremos resultados. Pasamos a usar un bucle for, que itera a través de la matriz de valores. Dentro del for-loop, si el elemento es par que el elemento será empujado en la matriz de resultados. Agreguemos un registro de consola para la matriz de resultados fuera del bucle. Guardaremos esto y ejecutaremos el código. Vemos la matriz que contiene sólo los elementos pares. Esto funciona, pero si usamos el método de filtro, entonces algunos de los legwork se harían por nosotros y tendríamos código que era probable que fuera menos propenso a errores. Veamos el mismo ejemplo, pero esta vez usando el método filter, usaremos la misma matriz almacenada dentro de la variable values, pero eliminaremos el resto del código. Pues entonces crea otra variable llamada resultados. Esto almacenará la nueva matriz que se devolverá desde el uso de filtro. Llamamos al método de filtro en los valores y verificamos si el valor es par. Guardemos esto y ejecutemos el código. Cuando la consola registramos los resultados, obtenemos la misma matriz devuelta que cuando usamos el bucle for. Hay algunas cosas que tener en cuenta cuando estás usando este método vale la pena recordar que cuando usamos filter, la matriz original no se muta, por lo que no se cambia. Podemos comparar las matrices originales y nuevas del ejemplo anterior, y veremos que son muy diferentes. Desk vuelve a nuestro código y agrega un registro de consola para valores. Guardaremos y ejecutaremos nuestro código. Obtenemos la matriz de resultados. Y ahora también podemos ver la matriz de valores originales que no se ha cambiado. Entonces podemos referirnos a esto ya que no ha sido mutado. También debemos asegurarnos cuando pasamos el cool nuevo al método de filtro que sí devolvemos algo. De lo contrario, la nueva matriz obtendrá una matriz vacía devuelta. Eliminemos devuelto de nuestro código y también el registro de la consola de valores. Guardaremos esto y ejecutaremos el código. Obtenemos una matriz vacía devuelta porque no devolvimos nada. Podríamos usar filtro en una matriz de cuerdas con la misma facilidad. Veamos un ejemplo de esto, devolveremos una matriz de cadenas que contienen la letra a. volvamos a nuestro código y eliminemos todo. Crearemos una variable llamada nombres. Asignado a esto una matriz. Dentro de la matriz colocarán las cuerdas Sally, Bob, Lauren y Ted. A continuación crearemos una variable llamada nombres filtrados. Esto almacenará la matriz devuelta desde el filtro. Entonces diremos nombres filtro de puntos. Entonces pasaremos en una devolución de llamada establecerá un parámetro de nombre. Después devolveremos todos los nombres que incluyen la letra a. así decimos nombre. Dot incluye pasar en la cadena a. agreguemos un registro de consola para nombres filtrados. Guardaremos y ejecutaremos nuestro código. Obtenemos una matriz que contiene Sally y Lauren, porque estos son los elementos de la matriz Names que contienen la letra a. por último, veamos el uso del método filter en una estructura de datos anidada tomaremos una matriz que contiene objetos y devolveremos los objetos donde la propiedad escolar es superior a 90. Empezaremos creando una variable llamada results, y lo estableceremos igual a una matriz. Dentro de la matriz se crearán cinco objetos. El primer objeto establecerá una propiedad name, le dará el valor. Billy también establecería una propiedad de puntuación y le daría a este el valor 90. En el siguiente objeto establecerá un nombre y puntuación 100. El siguiente le pondremos nombre Laura y le daremos un puntaje de nueve. Entonces pondremos nombre a Alice con un puntaje de 100. Entonces en el último vamos a poner nombre a peta con una puntuación de 98. A continuación crearemos una variable llamada pasado. Vamos a establecer esto igual a resultados. filtro de puntos utilizará una sola función de error de línea aquí y luego devolverá implícitamente resultado puntaje de punto inferior a 90. Agreguemos un registro de consola para el pasado. Guardaremos esto y ejecutaremos el código. Obtenemos una matriz que contiene todos los objetos donde la escuela era mayor a 90. 34. Usando el hallazgo: En este video, vamos a ver el método find en el pasado antes de ES6. Si quisieras encontrar un elemento de una matriz que coincida con algo específico, podrías usar un for-loop. Echemos un vistazo rápido a cómo haríamos esto. Si quisiéramos encontrar la manzana de cadena a partir de una matriz de cuerdas, comenzaremos declarando una variable llamada fruits. Asignará a esto una matriz que contenga las cuerdas falsas, naranja, limón, manzana. Kiwi. A continuación crearemos una variable usando left llamada fruit. Utilizará esto en nuestro bucle for, pasará a crear el for-loop. Dentro del bucle usando una declaración if comprobará usando estricta igualdad. Si la fruta es igual a manzana. Si hace igual fruta de manzana al elemento frutal, entonces usaremos break, porque ya no necesitaríamos seguir corriendo un bucle. Agreguemos un registro de consola para fruta. Ahorrará esto. Y vamos a ejecutar el código. La variable frutal se ha ajustado a Apple porque los frutos están listos contiene la cuerda de manzana. Esto funciona, pero es un enfoque bastante largo para lograr nuestro objetivo de encontrar el elemento apple. El método array helper find nos ayuda a lograr el mismo resultado, pero mucho más fácilmente, mediante el uso del método find, podemos devolver el valor del primer y sólo el primer elemento dentro de una matriz dada que coincide con el resultado de la función callback que pasamos, el método entonces devolverá ese elemento. Cuando usamos find, la función callback debe devolver un booleano true o false. Cuando llamamos al método find, se ejecutará una vez por cada uno y cada elemento de la matriz en la que se llamó. Pero cuando encuentre un partido, dejará de ejecutarse y simplemente devolverá el valor del elemento. Para aclarar, aunque la matriz que estamos usando find on tenga múltiples coincidencias, solo se devolverá el primer elemento que devuelva true. Los otros elementos ni siquiera se equivocaron. Vamos a reimplementar el ejemplo inicial, pero esta vez usando fund peep off fruit array, pero eliminará todo lo demás. A continuación, crearemos una variable usando const. Código fruta. Asignaría a esto el resultado de usar el método find. Pasamos una función anónima como devolución de llamada. En definido. Vamos a establecer un parámetro de fruta. Utilizamos tu lengua y verificamos si fruta es estrictamente igual a manzana. Agreguemos un registro de consola para fruta. Guardaremos y ejecutaremos nuestro código. Obtenemos Apple devuelto porque la matriz freqs contiene el elemento apple. El fruto a Ray no contenía Apple que indefinido, será devuelto. Vamos a quitar las manzanas, mi matriz de frutas. Vamos a guardar y ejecutar el código de nuevo. Nos ponemos indefinidos tu tienden, porque Apple ya no está en la matriz de frutas. Si estuviéramos trabajando con una estructura de datos anidada con objetos que contenían usuarios, podríamos usar find para escoger al usuario que logre algo. Veamos un ejemplo donde tenemos tres usuarios, pero queremos devolver el nombre del usuario rápido que anotó 0 en una prueba lideraría todo nuestro código. Crearemos una variable llamada resultados. Y vamos a establecer esto igual a una matriz. Dentro de la matriz se crearán cinco objetos. El objeto rápido establecerá una propiedad name. Y le daremos a esto el valor del vientre. Pero también satisfacer su propiedad, obtendrá este el valor 90. El siguiente objeto establecerá el nombre para probar. Puntaje 100. El siguiente que ponga nombre a Laura y le dé un puntaje de nueve, le enviará nombre. Alice con un puntaje de 100. Entonces en el último vamos a poner el nombre Peter con una puntuación de 98. Entonces crea una variable llamada ganador. Estableceremos esto igual al valor de retorno de usar find. Decimos resultados dot find. Y luego pasa en la devolución de llamada. Establecemos el parámetro a resultado, devolverá el resultado. El marcador de resultados equivale estrictamente a 100. Agreguemos un registro de consola para el ganador. Nombre del punto. Guarda esto y ejecutaremos el código. El primer puntaje de contenedores de objetos de 100 tiene el tat de usuario. Consolamos registramos el nombre de este objeto. Entonces obtenemos TED devuelto ya que estamos usando ES6 ya que este curso es sobre ESX menos completo este video con un ejemplo de usar una función de flecha con un retorno implícito. No usar la palabra clave return actualizará el ejemplo que acabamos de hacer. Actualicemos nuestra función ganadora. Quita los paréntesis. El retorno cambiará la función para que sea una función de flecha. Vamos a guardar esto y volveremos a ejecutar el código. Seguimos obteniendo el mismo valor de retorno. 35. Usando algunos y todos: En este video, vamos a ver la suma y todos los métodos ayudantes de matriz. Ambos métodos de ayuda fueron introducidos en ES6. Ambos métodos devuelven valores booleanos, verdaderos o falsos. Empezaremos mirando todos. Cuando usamos cada, pasamos un método de devolución de llamada, que suele ser una función anónima. El método de devolución de llamada necesita devolver un booleano. Podemos pensar en esto un poco como un método de prueba. El método se ejecutará una vez por cada elemento dentro de la matriz, lo que se llame. Si todos los elementos pasan el método de devolución de llamada de prueba, entonces se devolverá true. Si uno o más elementos no pasan el método de devolución de llamada de prueba que false será devuelto. Veamos un ejemplo básico. Empezaremos declarando una variable usando const, que llamaremos nombres, asignaría a esto en array que contiene tres cadenas, API, Anna y Alice. A continuación, vamos a usar todos en la matriz Names. Decimos nombres dot cada pase en la devolución de llamada. Establecemos un parámetro de nombre. El parámetro Name representará cada elemento de la matriz Names. Volveremos si el elemento name incluye la letra a. decimos nombre dot incluye. Pasamos en la letra mayúscula a como argumento. Guardemos esto y ejecutemos el código. Los elementos de la matriz Names contienen la letra a. así que se devuelve true. Como estamos trabajando con ES6, actualicemos la función para que sea una función de flecha. Hemos eliminado las llaves rizadas, la palabra clave return, y agregamos una función de flecha. Guardemos esto y ejecutemos el código. Nada ha cambiado así que nos volvemos verdaderos. Si tuviéramos algún elemento dentro nuestra matriz de nombres que no contenía la letra a, nos devolveríamos false. Esto se debe a que sólo se necesita un elemento no pasar la función de prueba para que todo no pase. Vamos a añadir el nombre Bob a la matriz Names. Guardemos esto y ejecutemos el código. Nos devuelven falsos. Si estuviéramos trabajando con una estructura de datos anidada, el método de cada método puede ser muy útil para evaluar ciertas piezas de datos. Por ejemplo, si tuviéramos una lista de los resultados de las pruebas de estudiantes y queríamos saber si todos nuestros alumnos que aprueban la prueba podíamos usar todos. Implementemos esto. Declarará una variable usando const. Lo llamaremos resultados. Asignaremos a esto una matriz que contenga tres objetos. Los objetos contendrán el nombre y la puntuación de un estudiante. El primer objeto que establecemos nombre a Billy. Y anotar 90. El segundo objeto que establecemos nombre para puntear puntaje a 100. Y en el último objeto, nombre, Laura, puntaje a 80, ahora declarará otra variable usando const, que llamaremos pase muerto. Asignaremos a esto el resultado de llamar a todos en nuestra matriz de resultados. Decimos resultados. Cada. Pasamos en la devolución de llamada. Y vamos a establecer un parámetro estudiantil y comprobar si el puntaje de puntos del alumno fue mayor a 50. Vamos a agregar un registro de consola para did pass. Guarda esto y ejecuta el código. ¿ Cuál será el alumnado en nuestro conjunto de resultados de objetos anotó más de 50. Entonces nos devuelve el árbol. Si alguno de los alumnos hubiera anotado menos de 50, nos devolveríamos falsos. Así que pasemos a algunos. Cuando usamos algunos, pasamos un método de devolución de llamada, también generalmente una función anónima, el método callback necesita devolver un booleano. Al igual que con todos, podemos pensar en esto como un método de prueba. El método se ejecutará una vez por cada elemento dentro de la matriz, qué canción se llama si alguno de los elementos pasa el método de devolución de llamada de prueba que true será devuelto. Si ninguno de los elementos pasó el método de devolución de llamada de prueba, se devolverá false. Para aclarar, algunos devolverán true si alguno de los elementos pasó la función de prueba, mientras que cada devuelve true solo si todos los elementos pasan la función de prueba. Si no estás buscando todo para pasar la función de prueba y solo un elemento, entonces algunos son un método útil de usar. Veamos un ejemplo básico de algunos borrará todo nuestro código. Crearemos una variable usando CONST, y la llamaremos edades. Lo que se asignó a esto. Y ya. Dentro de la matriz, se colocan los valores uno a 101. Ahora vamos a crear otra variable usando const llamado superior a cinco, almacenará en esto el resultado de usar algunos en la edad es array. Decimos ages dot sum, y dentro de los paréntesis, establecemos el parámetro age. El uso de un retorno implícito comprobará si la edad es mayor de cinco años. Ahora agreguemos un registro de consola por más de cinco. Guardemos esto y ejecutemos el código. Un elemento desde la edad del rayo es mayor que cinco. Entonces nos volvemos verdaderos. Si cambiamos la matriz de edades para que solo contenga números por debajo de cinco, obtendríamos false. Esto se debe a que nada en las edades del rayo pasaría la función de prueba. Así que de vuelta en nuestro código, cambiemos el valor diez a ser tres. Guarda esto y ejecuta el código de nuevo. Ahora nos hacemos falsos. 36. Notación del constructor de objetos: Hola. En este video vamos a ver a los constructores de objetos en JavaScript. Javascript proporciona algunas formas de crear objetos. Uno de estos se llama notación constructor de objetos. Podemos empezar simplemente creando un objeto. Creamos una variable para almacenar el objeto y luego usamos la nueva palabra clave y el constructor de objetos para crear esto. Hagamos esto en nuestro editor de texto. Declaramos una variable llamada House, que inicialmente será sin inicializar. Luego usamos la nueva palabra clave y el constructor de objetos para crear el objeto. Si agregamos un registro de consola la casa, podemos inspeccionar el objeto, guardaremos el código y lo ejecutamos. Obtenemos un objeto vacío devuelto. Actualmente, nuestra casa no hace mucho. Podemos añadir algunas propiedades al objeto. Para agregar una propiedad al objeto, puede utilizar la notación Dr. corchetes, pero se utiliza el nombre del objeto seguido de la propiedad que desea agregar. Agreguemos algunas propiedades en nuestro código usando notación de puntos. Agregaremos propiedades para el nombre de la casa, habitaciones, y fecha de construcción. Dirá el nombre de punto de la casa es igual a las ventanas de cuerda. Entonces diremos que las habitaciones de la casa equivale a cinco. Y por último, vamos a decir house dot es igual a 1998. Ahora guardemos esto e inspeccionemos de nuevo nuestro objeto. El objeto de la casa ahora tiene las propiedades añadidas, pero esto no es muy dinámico. Es posible que deseemos agregar un método para devolver algún valor. En nuestro ejemplo, usaremos un método para devolver el nombre de la casa. Para agregar un método a un objeto, volveremos a usar la notación de puntos. Luego usamos la palabra clave function seguida de llaves rizadas. Dentro de las llaves rizadas, reemplace el código para el método. Vamos a darle una oportunidad a esto. Entonces usamos el nombre de nuestro objeto, que es house, seguido de un punto, seguido de lo que queremos que se llame nuestro método , que tiene getName. Ahora usamos la palabra clave function. Dentro de la función devolverá la propiedad name de nuestro objeto. Guardemos esto y ejecutemos el código. Ahora cuando volvemos a inspeccionar nuestro objeto de casa, podemos ver que el método getName se ha agregado como una propiedad al objeto. Tratemos de usar el método. Obtenemos el valor del nombre de una casa devuelta a nosotros. Podemos actualizar las propiedades de nuestro objeto utilizando ya sea notación de puntos o notación de corchete. Así que intentemos cambiar el nombre de la casa a la manera de la cuerda. Y usaremos notación de puntos. Diremos nombre de punto de casa. Vamos a establecer esto igual a manera. Guardemos esto y ejecutemos el código. Podemos ver que el valor del nombre de la propiedad se ha actualizado. Podemos borrar propiedad usando la palabra clave delete seguida del nombre de la propiedad que deseamos eliminar . Probemos esto. Utilizamos la palabra clave delete seguida de house dot name. Guardemos esto y ejecutemos el código. Ahora no hay propiedad de nombre en nuestro objeto. Vamos a utilizar la notación de corchete para agregar la propiedad de nuevo como las ventanas de cadena. Esto también se podría hacer con notación de puntos. Utilizamos el nombre del objeto, los corchetes dentro de los cuales pasamos en una cadena con la clave de propiedad que queremos agregar. Entonces pasamos de nombre. Establecemos esto igual a los sauces de cuerda. Guardemos esto y ejecutemos el código. Ahora tenemos el nombre propiedad de vuelta en nuestra casa objeto. El enfoque anterior funciona muy bien. Pero habrá momentos en los que probablemente quieras usar un objeto varias veces. Quizás quieras representar a múltiples usuarios. O en nuestro caso, es posible que deseemos crear múltiples casas, pero usar propiedades similares usando la notación constructor, podemos usar un objeto para actuar como plantilla o blueprint para otros objetos. Vamos a crear una función de casa. Para ello eliminaría todo nuestro código y crearía una declaración de función. Llamaremos a esta casa. Utilizamos una letra mayúscula para la función de la casa. Entonces podemos distinguir que la función usa notación constructor. No tiene impacto cuando se ejecuta el código, pero es una convención de nomenclatura utilizada en JavaScript. Dentro de los paréntesis se agregará el nombre de los parámetros. Cuartos. Construida. Dentro del cuerpo de la función utilizará la palabra clave this que cada propiedad y método pertenece a la instancia individual del objeto que se crea con la función. Dirá esto. Nombre de punto es igual a nombre. Habitaciones es igual a habitaciones. Este punto es igual a construido también agregará nuestro método. Entonces diremos que este punto getName es igual a función. Dentro de la función devolverá este nombre de punto. Ahora estamos listos para usar nuestra función y crear una instancia del objeto. Haremos esto usando la nueva palabra clave, seguida de una llamada a la función que crea el objeto. En nuestra casa caso. Pasamos las propiedades para los parámetros de la casa como argumentos a la función. Veamos un ejemplo. Crearemos una variable llamada casa señorial. Inicialmente esto será sin inicializar. Pero luego creamos la instancia del objeto house usando la nueva palabra clave. Pasamos en la forma de cuerda. El parámetro name, el valor cinco. Para las habitaciones parámetro 1998 para el parámetro construido. Consolemos registrar la instancia de la casa señorial. El objeto se ha creado con los valores que pasamos cuando creamos el objeto. Tratemos de crear una segunda instancia del objeto. Creará otra variable llamada Willow house. Esta vez pasaremos en la cuerda Willow por el nombre de las habitaciones y 2 mil para el año construido. Guardemos esto y ejecutemos el código. Ahora tenemos dos objetos, casa señorial y debajo de casa. Tanto los objetos representan casas, pero los valores del nombre, las habitaciones y las propiedades construidas son individuales a los objetos específicos creados. Podemos confirmar esto cuando usamos el método getName en cada uno de nuestros objetos. En nuestro código, diremos sauce house dot getName. Y necesitamos usar paréntesis porque queremos llamar al método. Entonces diremos casa señorial dot getName. Guarda esto y ejecuta el código. Nos pondremos volcar para la casa de sauce objeto manera regreso para la casa señorial. Objeto. 37. Presentamos prototipos: En este video, vamos a introducir prototipos en JavaScript que podamos seguir adelante y entender mejor las clases de ES6. Empecemos discutiendo JavaScript orientado a objetos. Javascript no es un lenguaje basado en clases y no implementa la programación orientada a objetos en el sentido tradicional. Sí proporciona características y patrones que nos permiten utilizar conceptos de programación orientados a objetos. Nos referimos a esto como herencia prototípica. ¿ Cuál es el prototipo en JavaScript? Para el concepto central del prototipo en JavaScript es que un objeto puede heredar propiedades o métodos de otro objeto. Si consideras un árbol genealógico, entonces la gente en la parte inferior se vinculó a una sola persona en la parte superior. Puedes seguir la ruta hasta la cima paso a paso. En JavaScript, se puede pensar que un prototipo es un blueprint, o una plantilla, o un objeto base que contenga métodos a los que puede acceder cualquier instancia del objeto que se crea. Si no tuviéramos el prototipo, entonces tendríamos que definir los métodos en cada instancia de un objeto, y esto no sería muy eficiente. Se comería mucho recuerdo. Hay dos tipos de prototipos que necesitamos entender, la propiedad del prototipo y el propio prototipo del objeto. Empecemos con la propiedad prototipo. Cuando usamos métodos JavaScript como pop en una matriz o incluye cuando estamos trabajando con cadenas, estamos usando métodos incorporados dentro de JavaScript. Echemos un vistazo rápido a esto visualmente en la consola. Podemos empezar simplemente accediendo a la propiedad prototype en el constructor de prototipos de matriz. Escribimos array dot prototipo. Ahora cuando inspeccionamos esto, podemos ver el constructor. Podemos ver todos los métodos. Ahora vamos a crear una matriz y ver cómo podemos ver la propiedad prototipo dentro de la matriz. Crearemos una variable usando const. Lo llamaremos nuestra matriz. Esto se declara e inicializa con una matriz que contiene los valores 123. Posteriormente, las nuestras matrices inspeccionaron cuando queremos eliminar un elemento del final de una matriz, podemos usar el método pop. ¿ De dónde viene esto? Cuanto menos inspeccione la ARRA pequeña. Cada objeto en JavaScript tiene una propiedad prototipo. Se trata de una propiedad interna que se indica por los dobles corchetes que lo encierran. Cuando seleccionamos la propiedad prototype, podemos ver los métodos disponibles para nosotros y en nuestro ejemplo, estos heredan del constructor de matriz. También podemos utilizar un método obtener prototipo. Y esto devolverá la propiedad prototipo de un objeto dado. Recuerde, las matrices son un tipo especial de objeto. Vale la pena señalar que puede encontrarse algunos ejemplos que usan subrayado, subrayado. Subraya, subrayado. Esta es una característica heredada y ES pelusa incluso tiene una regla llamada ningún protón para resguardar contra su uso. El subrayado, subrayado, subrayado, subrayado propiedad expone el prototipo interno del objeto es mejor utilizar. Obtener prototipo de. Probemos esto. Entonces decimos punto objeto, obtenemos prototipo de a. luego pasamos en la variable nuestra matriz. Vamos a inspeccionar esto. Podemos comparar esto con los métodos enumerados en el sitio web de MDM. Todas las matrices pueden obtener acceso a estos métodos, pero en realidad no los tienen como propiedades en el propio borrado. Estos son los métodos que cada matriz puede usar. Pero en lugar de definirlos individualmente en cada matriz individual, los métodos se definen en su lugar en el objeto prototipo. Esto no es específico de un aumento, sino también otros objetos incorporados dentro de JavaScript también. También podemos usar esto cuando estamos creando objetos. En el siguiente video, veremos esto un poco más. 38. Más prototipos: Bienvenido de nuevo. El objeto que es el valor para la propiedad prototipo, es el prototipo para cualquier objeto que estemos inspeccionando. Si no existe, será ahora. Cuando usamos el método pop en nuestra matriz, el intérprete de JavaScript inicialmente buscará el método en la matriz. Cuando no lo encuentre, entonces se verá en el prototipo. Llamamos a este proceso herencia prototípica , la cadena prototipo. Este proceso podría seguir y seguir. Pero es mejor no crear una cadena compleja porque depurar esto puede volverse realmente confuso. Usando la cadena prototipo, puedes almacenar una función en un solo objeto y el trabajo interpretativo hasta ese objeto si no lo encuentra en el primer objeto, veamos un ejemplo en algún código. Declarará la función constructor llamada rastreador de juegos. Establecerá el nombre y los parámetros de resultado. Vamos a establecer esto a igual nombre. Y vamos a establecer este resultado de puntos. Igual resultado. Lo que esto se almacena en la memoria se almacena como una función con un objeto. El objeto tiene una propiedad prototipo, que es un objeto vacío. Cualquier función que se crea usando la pista de juego. Un constructor tendrá acceso a la propiedad prototype dentro de la función. Establecemos el nombre y el resultado usando esto, se refieren a la instancia actual del objeto. Ahora vamos a crear una variable llamada jugador uno. Cuando esto se ejecute, inicialmente no se inicializará, pero luego usaremos la nueva palabra clave y una nueva instancia de rastreador de juegos. Cuando usamos la nueva palabra clave, se establece la propiedad prototype, que será una referencia al objeto de rastreador de juegos. Agreguemos el nombre como Bob, el resultado como cuatro. También agreguemos un registro de consola para el jugador uno. Vamos a guardar esto y ejecutar nuestro código. Si inspeccionamos al jugador uno verá el nombre y resultados propiedades. Ahora intentemos averiguar el constructor del jugador uno. De vuelta en nuestro código, agregaremos un registro de consola. Y dentro de esto, diremos punto objeto, consigue prototipo. Y pasaremos en el jugador uno. Guardemos esto y ejecutemos el código. Obtenemos rastreador de juegos como el constructor. Usando el prototipo. También podemos agregar un método al prototipo. Agregará uno para comenzar nuestro juego. Decimos rastreador de juegos dot prototipo dot Inicio. Entonces configuramos esto igual a una función porque es un método dentro del cuerpo va a devolver una plantilla literal. Usamos garrapatas atrás, diremos Hola. Entonces vamos a interpelar en el nombre. Entonces decimos este nombre de punto. Después de esto, diremos que el juego está listo. Ahora vamos a inspeccionar al jugador un objeto de nuevo. Somos capaces de ver que la función de inicio está almacenada en el prototipo. Ahora podemos usar la función start en nuestro jugador uno. Vamos a darle una oportunidad a esto. En un registro de consola dirá jugador un punto se detuvo. Porque vamos a llamar al método start. Guardemos esto y ejecutemos el código. Obtenemos la cuerda con el nombre de nuestro jugador devuelto. 39. Introducción de clases: Ahora con familiarizados con constructores y prototipos, veamos las clases de ES6. Las clases son esencialmente azúcar sintáctica para crear objetos. Esto significa que bajo el capó, todo funciona de la misma manera uso de la notación constructor de objetos, pero es mucho más legible y más fácil trabajar con. Al igual que con cualquier cosa que use azúcar sintáctica siempre es extremadamente útil e importante entender lo que está pasando bajo el capó. Cuando usamos la sintaxis de clase en JavaScript, no tenemos que agregar manualmente métodos al prototipo. En cambio, usamos una palabra clave llamada class. Añadimos un constructor, y luego agregamos métodos. Vamos a romper esto y echar un vistazo. En nuestro ejemplo, usaremos una clase para crear un perro. Y luego vamos a seguir creando instancias de ese perro. Para comenzar a usar una clase, usas la palabra clave class seguida de lo que te gustaría que tu clase se enfriara. Por lo general, el nombre de la clase es mayúscula. Entonces podemos decir que es una clase. Esto es como cuando usamos notación constructor de objetos. Vamos a ir en el editor de texto. Utilizamos la palabra clave de clase y seguimos creando nuestra clase de perros. Entonces usamos un conjunto de llaves rizadas para encerrar nuestra clase. Cuando creamos una clase, añadimos en lo que se llama constructor. Un constructor es una función. Se ejecutará de inmediato cada vez que se cree una nueva instancia de nuestra clase. El constructor es un poco como una función de constructor estándar. Cuando usamos la notación constructor de objetos. Agreguemos esto a nuestra clase. De vuelta en el Editor de Texto. Dentro de los tirantes rizados de la clase, usamos la función constructor. Para crear una nueva instancia de la clase. Utiliza exactamente la misma sintaxis que lo haces cuando creas una nueva instancia usando la notación constructor. Para ello, creamos un nombre para nuestra instancia usando una variable. Entonces usamos el signo igual seguido de la nueva palabra clave, y luego el nombre de nuestra clase. Cuando hagamos esto, el constructor se ejecutará de inmediato. Vamos a crear un perro al que llamaremos amapola. Empezamos creando una variable usando const. Y le damos a este el cachorro identificador. Utilizamos el signo igual. Entonces la nueva palabra clave, seguida del nombre de nuestra clase, que es oscura. Ahora también agreguemos un registro de consola. Para Cachorro. Guardaremos esto y ejecutaremos el código. Vemos al perro. Y podemos ver cuando inspeccionamos la propiedad prototipo que el constructor se ha establecido en perro, clase actualmente no hace mucho. En el siguiente video, seguiremos agregando algunas propiedades a nuestra clase. 40. Más sobre clases: Bienvenido de nuevo. En el último video, presentamos clases en ESX. Continuemos con esto y veremos agregar propiedades a nuestro perro, agregaremos nombre, edad, y raza. Podemos establecer estos en el constructor. Para ello, agregamos los parámetros a la función constructor. Y luego usando esto, podemos añadir las propiedades a nuestra instancia del objeto. Pasamos los valores para los parámetros como argumentos. Cuando creamos la instancia de nuestro objeto. Cuando creamos la instancia de nuestro objeto usando la nueva palabra clave, esto se referiría automáticamente a la instancia del objeto que estamos creando. Implementemos esto a nuestra clase. Entonces empezamos agregando nombre, edad y criamos los parámetros del constructor. Entonces ponemos este nombre de punto, dos nombre igual, este punto, edad a igual h, esta raza a igual raza. Donde creamos la instancia de nuestro objeto. Agregaremos cachorro. El argumento para el parámetro name. Para el parámetro h se sumarán dos. Para el parámetro breed, agregaremos la llamada de cadena. Guardemos esto y ejecutemos el código. Cuando inspeccionamos el objeto cachorro en la consola, podemos ver las propiedades de nombre, edad y raza, que se estableció en el constructor. Esto se hace porque usamos la nueva palabra clave. Dentro del constructor. Estamos diciendo añadir una propiedad de nombre, edad y raza, y establecer estas propiedades a los valores de los parámetros. Los valores de parámetros se pasan como argumentos cuando llamamos nuevo con la clase de perro. Creamos la instancia de amapola. Uno de los beneficios clave del uso clases es que no tenemos que derivar el anuncio, métodos que utilizan el prototipo. Para agregar un método, utilizamos el nombre del método seguido de paréntesis y llaves rizadas. El método se convierte entonces en un método en el prototipo de perro, pero no en las instancias individuales. Esto es igual que cuando se agregan los métodos usando la sintaxis del prototipo. Implementemos un método que devolverá nombre del perro usando un literal de plantilla en nuestro código. Después del constructor, agregaremos el método myDog. Dentro del cuerpo de esta devolverá una plantilla literal. Esto dirá que mi perro es código. Entonces vamos a intercalar en este nombre de punto. Guardemos esto y ejecutemos el código. Obtenemos nuestro objeto. Cuando inspeccionamos la incidencia en mall, podemos ver el método myDog se ha agregado a la propiedad prototipo de la instancia. Podríamos crear otra instancia de nuestra clase, que tendrá su propio conjunto de propiedades. Vamos a crear otra instancia, y lo llamaremos mío. Para ello, crearemos una variable llamada mi nombre. Utilizamos la nueva palabra clave, el nombre de clase perro. Dentro de los paréntesis se sumará Milo. Por el nombre. A la edad se sumarán cinco. Para la raza, agregará parque. También agreguemos un registro de consola para menor guardaremos esto y ejecutemos el código. Podemos ver que se está creando la instancia de mielina y el constructor está configurado para perro. En el siguiente video, echaremos un vistazo al uso de nuestro método. 41. Uso de clases: Ahora podemos intentar usar nuestro método MyDog en ambas instancias. Para ello, utilizamos el identificador de la instancia del objeto, seguido de un punto, seguido del método. Vamos a probar esto, agregaremos dos registros de consola. En la primera, diremos punto de cachorro, luego llamaremos a MyDog. El segundo registro de consola dirá milo dot, y luego utilizará el método myDog. Guardemos esto y ejecutemos el código. Obtenemos los nombres de ambos perros devueltos en la cuerda. También podríamos llamar a un método desde dentro de otro método en la clase. Si queríamos hacer esto, solo usamos esto. Vamos a crear otro método que devuelva el nombre y la edad de las instancias adultas. Crearemos otro método llamado perro info. Dentro de este método también devolverá una plantilla literal, se inyectará en el método myDog. Entonces diremos que es, y luego vamos a inyectar en la propiedad de la edad. Después de esto, diremos años de edad. Cambiemos nuestros registros de consola para usar el método de información del perro. En cambio. Guardaremos esto y ejecutaremos el código. Obtenemos las nuevas cuerdas devueltas con el nombre y también edad de las oscuras. Y el método myDog fue llamado con éxito dentro del método de información del perro. 42. Presentando promesas: En este video, vamos a introducir promesas, pero empecemos respondiendo a la pregunta, ¿qué es asíncrono? Por lo general, cuando escuchas sobre promesas en JavaScript, también se escucha la palabra asíncrona. Pero, ¿qué es asíncrono? Bueno, primero tenemos síncrono. Sincrónico significa algo que se realiza paso a paso. Cuando estás caminando, pones un pie delante del otro. Y no haces las dos al mismo tiempo a menos que estés saltando. Otro ejemplo es esperar a que hierva una tetera antes de hacer una taza de té asíncrona. Por otro lado, significa que puedes hacer otras cosas fondo sin que todo se detenga y espere. Es un poco como decir que podrías ver algo de televisión mientras esperas a que hierva la tetera, lugar de solo estar de pie y mirar a la tetera esperando en ella. Entonces JavaScript es lo que llamamos un solo lenguaje de rosca. Esto significa que solo una cosa puede suceder a la vez y al mismo tiempo, JavaScript asíncrono es la forma en que las tareas en segundo plano, como las solicitudes a los servidores pueden suceder sin todo molienda a un alto, a la espera de que se complete la tarea única, significa que las tareas asíncronas se ejecutan fuera del flujo principal del programa. Lo que promete en tu día a día. A menudo prometes a la gente algo de antemano si en realidad lo estás haciendo, tal vez dices, te prometo que limpiaré los platos o te prometo que compraré algo de leche. Así es esencialmente como funcionan las promesas en JavaScript. Cuando usas una promesa, generalmente estás escribiendo código asíncrono y estás haciendo una promesa o una transacción por algo que se va a hacer. Una vez hecha la promesa, entonces la tarea se cumple o fracasa. Esto es como decir que estás cumplido o fracasado tu promesa de comprar derretimiento. Hay dos partes que entender cuando estás trabajando con promesas, creando la promesa, y luego cómo usar la promesa. Empecemos por mirar cómo crear una promesa. Una promesa es una función constructor, por lo que debes usar la nueva palabra clave. Y la promesa necesita ser capitalizada cuando se crea uno, la promesa toma una función como el argumento con dos parámetros, resolver y rechazar. Resolver y rechazar unas funciones que puedan ser frías, por lo que deben ejecutarse con paréntesis, resolver, o rechazar. Acostúmbrate a determinar qué sucede cuando se ejecuta la promesa. Veamos la sintaxis básica para crear una promesa. Declararemos una variable usando cond, que llamaremos nuestra promesa. Luego usamos el signo igual y la nueva palabra clave. Entonces usamos la promesa. Pasamos en Resolver y rechazamos como los parámetros. Fuera de esto se agregará un registro de consola para nuestra Promesa. Guardemos esto y ejecutemos el código. Cuando inspeccionamos la promesa, vemos que el estado promesa dice Pendiente. Entonces veamos los estados de Promise. Hay tres estados que las promesas pueden tener pendientes, cumplidas y rechazadas. La nuestra promesa que creamos no resuelve ni rechaza nada. Permanecerá indefinidamente en el estado pendiente es un poco como alguien que te espera para salir y comprar un derretimiento para completar una promesa que usamos Resolve overjet. Resolver significa que la promesa tiene éxito y rechazar significa que falla. Cualquier argumento puede pasarse a resolución y rechazo. Pero muchas veces cuando trabajamos con promesas, estaban haciendo solicitudes de datos. Entonces a veces es un objeto que se extraerían algunos datos. En el siguiente video, pasaremos a trabajar con la promesa. 43. Trabajar con promesas: Bienvenido de nuevo. Vamos a seguir mirando las promesas. Actualicemos nuestro ejemplo para mostrar el resultado de resolver y luego rechazar la promesa. Empezaremos agregando rechazo. Guardemos esto y ejecutemos el código. Podemos ver que el estado se ha actualizado a rechazado y obtenemos un error. Cambiemos ahora esto para resolverlo. Guardará esto y ejecutará el código de nuevo. Ahora vemos la promesa que los Estados han cumplido. Ahora pasemos a actualizar nuestro ejemplo para que mejor represente una solicitud. Agregaremos una variable usando left llamada Dead get milk. Vamos a poner esto en verdad. A continuación, agregaremos una declaración if y vamos a pasar in did get milk agregará resolución al cuerpo de la sentencia if, y pasaremos en la cadena de argumentos. Tenemos la leche usará otra cosa. Establecer, rechazar. Esta vez pasaremos en el argumento string. No conseguimos la leche. Vamos a guardar esto y ejecutar el código porque obtendrían leche es verdad. La promesa se resuelve con el mensaje. Si ponemos el salir a la fuerza, la promesa será rechazada. Vamos a cambiar la variable de montaje consiguió igualar false. Guardaremos esto y nos movemos en el código. Esta vez vemos que la promesa fue rechazada y obtenemos la cuerda que pasamos en rechazo. Podemos usarlos para ejecutar código. Una vez resuelta la promesa , entonces es un método que se ejecutará inmediatamente después de que se haya cumplido la promesa. Podemos pasarles una devolución de llamada, que tiene el código que ejecutamos una vez que se cumple la promesa. Vamos a actualizar nuestro ejemplo para mostrar esto, vamos a establecer que sí se derrita de nuevo a verdadero. Ahora vamos a usar el método then. Nosotros decimos, te prometo dot. Después establecemos un parámetro para el resultado, que llamaremos rayos. Entonces usamos la sintaxis de la función de flecha. En el interior, diremos console.log. Descanso. Guardemos esto y ejecutemos el código. Cuando se ejecuta la promesa, obtenemos el estado cumplido, pero también vemos el parámetro rojo impreso. El parámetro rest se pasa del argumento que damos al método de resultado. Cambiemos el argumento que damos al método de resultado para solidificar nuestra comprensión de esto. Entonces cambiaremos el argumento para que sea un objeto. Establezca el mensaje clave con la cadena como el valor dentro del registro de consola R para los rayos. Vamos a cambiarlo para que sea mensaje de punto res. Guardemos esto y ejecutemos el código. Recibimos el mensaje impreso a la pantalla cuando se rechaza la promesa. Nosotros manejamos esto mediante el uso de catch. Catch funciona de manera similar a cuando los usamos para resolver la promesa. La captura se ejecutará inmediatamente después de que se rechace la promesa. Veamos un ejemplo. Vamos a cambiar los muertos obtener la leche variable para ser falsa. Después de usar, entonces, diremos punto catch. Establezca un parámetro de error. Usaremos la sintaxis de la función de flecha. Después agregaremos un registro de consola por error. Guardemos esto y ejecutemos el código. Esta vez cuando se ejecuta el código, la promesa es rechazada. El código y la captura se equivoca. Y obtenemos el argumento, pasamos a la llamada para rechazar impreso a la consola. 44. Módulos: Un término común que encontramos en la programación son los módulos. Si miramos esto de manera cotidiana, puedes pensarlo un poco como un trozo de lego o un solo carruaje de un tren. En la codificación, especialmente cuando estamos creando una aplicación, para fines organizativos, podemos separar el código en archivos o módulos separados. Una de las principales razones por las que hacemos esto es que las responsabilidades se dividen en partes separadas. Hace que el programa sea mucho más seguro de errores y mucho más fácil y también lógico trabajar con él. Entonces, para resumir, un módulo es una parte o pieza del código, que encapsula o contiene su propia lógica y responsabilidades para la aplicación o programa Los módulos ayudan con la organización del código y fomentan la reutilización del código, y también la mantenibilidad En ES six, se introdujo un sistema de módulos, que fomentó esta separación y facilidad de reutilización del código Hay dos conceptos que debes entender. Exportación e importación. Cuando creas un módulo, una de las cosas que probablemente necesitarás poder hacer es importarlo a otra parte de la aplicación. Para poder importarlo a otra parte de la aplicación, es necesario exportarlo. Cuando pides algo en el extranjero, tiene que pasar por un proceso de múltiples etapas para llegar a ti en tu país. El proveedor deberá iniciar el proceso empacando el artículo y enviándolo para su envío. Esto puede considerarse el proceso de exportación. Posteriormente, cuando el artículo llegue al puerto de su país, puede pasar por un proceso aduanero antes de que se le permita ingresar al país y se le envíe a través de los servicios postales de su país. Esto se puede considerar como el proceso de importación. Podemos considerar el proceso ahora en código. Cuando creamos un módulo, antes de que pueda ser utilizado dentro de otra parte de la aplicación, es necesario exportarlo. Posteriormente, en la parte de la aplicación en la que quieras usar el fragmento de código o consumirlo, necesitaremos importarlo para que luego se pueda usar dentro de ese archivo. Hay dos tipos de exportaciones, denominadas exportaciones y exportaciones por defecto. Empecemos por mirar las exportaciones nombradas. Voy a crear un archivo llamado names. Dentro de ese archivo, voy a crear una variable para crear el nombre y apellido de una persona. También voy a exportar la variable. Comenzaré escribiendo export para exportar la variable. Entonces diré constante. Usa un nombre igual. Luego agrego paréntesis ya que quiero establecer algunos parámetros. Voy a añadir el primer parámetro llamado nombre, una coma, y luego agregaré otro parámetro llamado apellido Estoy usando una función de flecha aquí, así que usaré una flecha, y luego voy a devolver una cadena intercalada Empiezo con un juego de baptis y después uso el signo del dólar y los tirantes rizados Interpolo en nombre de pila. Pongo un espacio y luego repito el proceso para el segundo nombre. Agrego un signo de $1, un conjunto de llaves, e interpolo en el segundo nombre Dentro del archivo, todo lo que queremos hacer es cerrar la sesión de consola el valor devuelto. Voy a escribir console dot log, un conjunto de paréntesis, y dentro de los paréntesis, diré nombre de usuario para llamar a la función y un conjunto de Por el primer nombre, voy a pasar en el argumento John y por el segundo nombre D. Esto no va a funcionar todavía, y la razón por la cual es que no hemos importado nada. Para ello, en la parte superior del archivo, necesitamos usar la palabra clave import. Después de esto, usamos llaves para contener el nombre de lo que estamos importando Estamos importando nombre de usuario. Añadimos esto aquí. Por último, tenemos que decir la ubicación de donde lo estamos importando. Decimos, punto hacia adelante nombre de slash. Ahora vamos a darle una oportunidad a esto y ejecutar la función. Cuando se ejecuta el código, veo a John Doe impreso en la consola, así podemos ver el resultado del nombre de usuario En este punto, debe tener una comprensión de las exportaciones nombradas. Entonces echemos un vistazo a las exportaciones por defecto, que son el otro tipo de exportaciones. Volveremos al nombre archivo JS. Conservaremos el código que tenemos, pero tendremos que eliminar la palabra clave export. En su lugar, después de la función, vamos a escribir export default username. Ahora, volvamos al archivo JS punto principal y veremos cómo ajustar la importación para esto. Vamos a mantener el registro de la consola, pero eliminaremos la línea que estaba importando la exportación con nombre. En su lugar, diremos importar nombre de usuario a partir de nombres. Volvamos a ejecutar el código. En la terminal, podemos ver que nada ha cambiado, y todavía tenemos el nombre desconectado. Esto nos demuestra que podemos usar tanto exportaciones nombradas como predeterminadas. Para resumir, los módulos ES six nos permiten organizar y reutilizar nuestro código, y con el simple uso de exportación e importación, podemos mantener oportunidades simples de reutilización de código Exportar significa que el código va a estar disponible en otro lugar, e importar significa que desea utilizar una pieza exportada del código. Las exportaciones nombradas y predeterminadas son las opciones que tenemos para exportar y en general, las exportaciones nombradas son mejores cuando tienes un módulo con mucha funcionalidad ya que puedes ser selectivo sobre lo que estás importando. Cuando tiene una sola pieza de funcionalidad o principal, entonces las exportaciones predeterminadas pueden ser más apropiadas.