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.