logo

midulive


Transcribed podcasts: 605
Time transcribed: 13d 3h 7m 36s

This graph shows how many times the word ______ has been mentioned throughout the history of the program.

se puede utilizar React, así que
venga, vamos con más cositas
vamos con más cositas
os quería comentar el tema de los nuevos
los nuevos
métodos de array, ¿vale?
aparte del que os he enseñado, no sé si sabéis
que van a haber nuevos métodos de array
de hecho, lo podríamos hacer un poco también con esto
que hemos hecho con estos test
para que los veamos, ¿por qué? porque os voy a enseñar
también como se instalaría un polyfill
no sé si sabéis que va a haber
unos nuevos métodos para el reverse
bueno, ahora os lo enseño
porque de memoria no me lo voy a saber
y tengo por aquí el polyfill
que quería, creo que está por aquí
vale, este es el
stage, os lo comento porque esto es una cosa
que va a llegar bastante pronto a JavaScript
sí, lo que serían para
inmutabilidad, ¿vale?
Hola Amidu, hace tres meses que estoy en con JavaScript y quiero empezar
con Node, ¿cuáles son los conocimientos básicos de JavaScript
que me recomiendas para pasar a Node?
muy complicado, ¿eh? muy complicado
decir que
te recomiendo que sepas JavaScript
en general y ya está
luego no hace falta que seas un experto en JavaScript
puedes empezar con Node y poco a poco irás aprendiendo
y si no estás algo que necesitas de JavaScript
lo aprendes y ya está
¿un curso de React, Midu?
joder, ¿un curso de React?
tengo el mejor curso de React del mundo
la leche
midulink.react
barra React
ya no sé cuántas veces lo he dicho ya
ahí tienes 12 horas
12 horas de contenido
vale
entonces
hay una propuesta
que ya está en stage 3
está en la fase 3
¿esto qué quiere decir?
esto quiere decir que muy pronto
muy, muy, muy pronto
va a llegar
a los navegadores
de hecho
me extraña que no haya llegado ya
porque
a ver
vamos a ver
Chincharrey
vamos a ver
Chincharrey
me extraña que no haya llegado ya
no
parece que no
o to reverse
este es uno de ellos
no
bueno
pero está en stage 3
o sea
esto significa que este año
va a llegar seguro
seguro
está en la fase 3
como los vengadores
sí, sí
básicamente
entonces
¿qué métodos son estos?
vale
pues son el
to reverse
to sort
to splice
y with
y ahora os explico un poco
qué significa cada uno
y por qué son importantes
el tema es que
a día de hoy
pues tenemos
el
yo qué sé
el reverse
tenemos const
numbers
1, 2, 3
y tenemos
numbers.reverse
vale
¿cuál es el problema?
¿cuál es el problema de este método?
al darle la vuelta
a un array
pues el problema que tenemos con esto
es que si yo ahora hago un console.log
de numbers
lo que vamos a ver
es que ha mutado
el array original
¿esto qué quiere decir?
pues que la referencia original
de numbers
al hacer un reverse
me la ha cambiado
me ha cambiado también
el array de numbers
no solo en reverse numbers
también lo tenemos
de hecho
sea un console.log
veremos que reverse numbers
también es 3, 2, 1
pero numbers es 3, 2, 1
¿cómo se suele arreglar esto?
bueno
pues haces así
y lo que haces es
utilizar el spread
para hacer una copia
haces una copia
de todos los números
y haces un reverse
de la nueva copia
del array
de esta forma ahora
numbers
sí que estaría bien
y el reverse numbers
se queda con
con el reverso
o sea que
esto lo arreglaría
¿cuál es el problema
que tiene esto?
esto en realidad
tiene un problemilla
no es que sea un problemazo
bueno
pero sí que puede ser un problemazo
el tema es que aquí
hay un problema de rendimiento
en el sentido de que
estamos creando
una nueva copia
del array
en este código
para poder evitar
que nos mute
el original
esto con arrays pequeños
tampoco pasa nada
¿vale?
tampoco es que sea un drama
pero esto repetido
en todo tu código
muchas veces
o en arrays muy grandes
o que sean bastante complejos
sí que puede empezar
a ser un problemilla
entonces
justamente
en javascript
vais a ir notando
que poco a poco más
se va a estar apostando
por el tema de
se va a estar apostando
por el tema
de la inmutabilidad
de hecho
ya os he comentado
por aquí
que vamos a tener
nuevos tipos de datos
en javascript
vamos a tener las tuplas
y los records
no lo voy a comentar ahora
pero básicamente
son los tipos inmutables
de objetos
y de arrays
¿vale?
que está bastante bien
entonces
¿ahora qué es lo que van a hacer?
van a sacar
nuevos métodos de array
no
nuevos métodos de array
no
por favor
nuevos métodos no
cada vez que digo
nuevos métodos de array
hay gente que se me queja
me dice
nuevos métodos no
por favor
si ya me cuestan
saber los que hay ahora
bueno
no pasa nada
se puede mirar
la documentación
¿qué querés que te diga?
no te los aprendas de memoria
hay algunos
que es bastante importante
que te los sepas de memoria
¿vale?
pero no hace falta
que te los sepas todos
yo mismo
de vez en cuando
me miro la documentación
porque nunca me acuerdo
de diferenciar el slice
con el slice
no pasa nada
os mando un abrazo
abrazo
¿vale?
no más this
no
ya te digo
no this
no hablo más de this
¿vale?
pero eso
que al final
el tema de
que siempre va a salir
nuevos métodos
es lo que hay
que no hace falta
que te los sepas todos
de memoria
pero bueno
con que te suene
que existen
serás capaz de buscarlos
¿sabes?
la documentación

abrazote

además no significa
que os tengas que usar todos
no significa
pero bueno
al menos el hecho
de que sepas que existan
te puede ayudar
por ejemplo
te voy a poner un ejemplo
muy típico
que pasaba en mi empresa
¿vale?
en mi empresa
mucha gente
yo que sé
imaginemos que tenemos
numbers
y tenemos
1
1
2
1
1
1
2
¿vale?
en mi empresa
yo cuando entré
en mi empresa
en el código de mi empresa
por ejemplo
found number
hacían esto
number
bueno
n
n
n
igual a 2
0
esto
este código
este código
lo hacían en mi empresa
buah
buah
así
así de veces
así
así
así
si no estaba
250 veces
no estaba ninguna
y este
este código además
tenía dos problemas
no solo
es innecesario
sino que además
si esto te da
undefine
porque no lo encuentra
esto te peta
¿sabes?
o sea que
locurón
locurón
locurón
bueno de hecho
ahora no sé si el filter
a ver una cosa
no, no peta
mentira
os he engañado
no peta
porque creo que devuelve
un array
cierto
cierto
cierto
no peta
no peta
mentira
mentira
este no era el código
que petaba
pero había otro
que hacían por ahí
que sí que petaba
pero bueno
este es lo comentario
en otro momento
cierto
este no peta
nunca peta
pero hacían esto
¿no?
y entonces yo cuando encontré
este código
digo mierda
la leche
joder
y esto era
básicamente porque no tenían
el
porque no sabían
que existía el fine
pero porque no sabían
que existía ni siquiera
pero no sabían que existía
dices
ah se puede hacer un fine
y hostia
y entonces en todos los sitios
hay el filter
filter
filter
filter cero
filter cero
filter cero
que no pasa nada
o sea no es que
yo ya os seguro
que me ha pasado esto
con un montón de códigos
en un montón de sitios
pero lo que quiero decirte
es que hay veces
que al menos saber que existe
no hace falta que te acuerdes
exactamente del contrato
pero
ni como se llama el método
pero saber que existe
te ayuda a evitar a mejor
este tipo de cositas
¿vale?
y entonces
por ejemplo
sabiendo que esto existe
te va a evitar
que el día de mañana
te hagas copias
de un array
cuando no es necesario
¿vale?
y es importante
el filter
itera todo el array
y el filter no
sí exacto
ese es otro tema
el filter además
es más lento
porque esto
lo que hace es
filtrar todo el array
el find
es como que para
en el primero que encuentra
y es bastante más rápido
¿y por qué no
el que devuelve 0 o menos 1?
¿0 o menos 1?
no sé si te refieres
al find index
supongo que te refiero
al find index
o
bueno en este caso
puedes utilizar includes
en este caso
puedes utilizar includes
pero bueno
no tiene
pero
sí tampoco
igual nadie conoce
el sum o el every
también el sum
el every
también son bastante importantes
cuando quieres que te devuelva
un array
sí también con el find
he visto gente
que utiliza el find
por ejemplo
found number
has
has
true number
¿no?
en lugar de utilizar el sum
que sería mucho más fácil
si hay algún 2
entonces devuelve true
bastante más útil
pero bueno
el tema
el tema sobre esto
que
que estamos
tenemos estos 4 nuevos métodos
vamos a verlo
ah
se refería al index of
también
también se puede utilizar el index of
index of
en este caso
se podría utilizar este
¿no?
que es
index of
buscas directamente
o aquí incluso
podrías poner el includes
que es bastante fácil
y te devuelve true
pero bueno
normalmente
yo lo que decía
era con objetos
y cosas así
peta cuando buscas
en un array de ovectos
no lo encuentra
e intentas acceder
a un valor
claro
efectivamente
saú18
claro
porque el ejemplo
que yo decía
es con objetos
es más complicado
que números
y ya está
efectivamente
¿qué tal si quiero filtrar
solo en números 2
en ese caso
usaría el filter?
claro claro
a ver
sí sí
hombre
cuando quieres filtrar
pues se utiliza el filter
ahora no nos pongamos locos
de no utilizar el filter nunca
cuando se filtra
se utiliza el filter
que también he visto reducers
para filtrar
pero bueno
eso ya es otro mundo
total
tenemos estos 4 métodos
este

es que la gente
le encanta
le encanta reduce
está reduce
por encima de sus posibilidades
entonces
estos 4 métodos
una cosa que os quería comentar
no solo de utilizarla
además hay uno
que es bastante especial
que es este width
que ahora te lo explico
porque es bastante chulo
y está bastante
el filter está vetado
no
el filter no está vetado
pero
el tema es utilizar cada uno
cuando tiene sentido
vamos a intentar utilizarlos en Node
y para eso
fíjate que pone aquí
implementations
aquí hay como polyfields
que podemos utilizar
una sería utilizar
core.js
otra
es shims
y de hecho
creo que vamos a intentar utilizar esta
a ver
es shims
a ver
es que no me entra
es que estos son separados
la madre los parió
no jodas
que tenéis que instalarlos todos separados
y el core.js
vale
el core.js
sí que se instala todo
vale
esto lo que es este core.js
y el
enmascript shims
estos son como polyfields
de cosas nuevas
que van a llegar
esto muchas veces
aunque vosotros
no os deis cuenta
esto
en realidad
está
utilizándose con Babel
por ejemplo
cuando estáis transformando
vuestro código
está añadiendo este código
para que podáis utilizar
estos métodos
o otras cosas
lo bueno de estas cosas nuevas
que llegan a JavaScript
cuando son cosas del prototype
es que es súper fácil
súper fácil
de añadir un polyfield
de hecho
podríamos hacer nosotros
el polyfield
si queréis hacemos un polyfield
solo para que lo veáis
pero yo que sé
por ejemplo
¿cómo lo hacemos?
vea lo hacemos en run.js
si hacemos
array.prototype.
¿cuál hacemos?
el to reverse
vale
to reverse
aquí
podríamos hacer
function
devolveríamos esto
tenemos que
bueno
podríamos hacer
el check
de si esto
no sé qué
no sé cuánto
pero bueno
da igual
to reverse
lo que vamos a añadir
es esta funcionalidad
porque no la tiene
pues esto debería ser
return.slice
o podríamos hacerlo
de otra forma
slice
al final lo que nos va a devolver
es un array nuevo
y hacemos un punto reverse
y ya está
y ahora ya podríamos utilizarlo
1,2,3
punto
to reverse
y si
vale
pues no ha funcionado
prototype
to reverse
lo he hecho bien
¿no?
vale

lo he hecho bien
lo que me faltaba
del punto y coma
porque cuando se inicia
una línea con esto
pues eso
array.prototype.reverse
y ahora de repente
pues ya en un array
puedes utilizar
el to reverse
y fíjate
tienes aquí
3,2,1
si aquí hacemos
const numbers
1,2,3
y aquí hacemos
numbers to reverse
y miramos aquí
console.log
de numbers
bueno ponemos aquí
numbers
numbers
pues veremos
¿vale?
que numbers
me lo he dejado igual
y aquí pues ya tenemos
punto
ya está
hemos hecho
un polyfill
de una funcionalidad nueva
en un momento
y utilizando
utilizando this
hemos utilizado this
que fuerte
que fuerte
bueno
en este caso
this
se refiere al propio array
¿vale?
no es
después de poner this
los viewers han bajado
ya ya
es que this
no sé qué le pasa con el this
no sé qué os pasa
bueno
total
que con esto
hemos hecho un prototype
obviamente
no hace falta
que utilicéis
que hagáis vosotros
el polyfill
además que hay veces
que es necesario
hacer otros checks
esto es un polyfill
esto lo voy a llamar así
un polyfill
guarro
¿vale?
esto es un polyfill
guarro
que no deberíais hacer
en vuestro día a día
¿ok?
en este caso
pero
que ya lo hemos hecho
este tipo de
forma de añadir
una funcionalidad
que no está todavía
soportada
en tu navegador
o en node
se puede utilizar
justamente
y ya está hecha
por ejemplo
core.js
es una librería
que ya tiene
este tipo de cosas
así que
la podemos instalar
de hecho
la vamos a instalar
a ver
installation
vamos a instalar esta
a ver si esta versión
vamos a instalar esta
y vamos a ver
si somos capaces
de utilizar
en nuestro proyecto
¿vale?
en este node 10 testing
vamos a instalar
como
de desarrollo
¿vale?
vamos a abrir aquí
otra vez
nuestro proyecto
vamos a quitar
todo esto
y aquí
podríamos justamente
importar
a ver si
me lo ponía
por aquí
el proposal change
este
este
change array
by copy
que entiendo que
change array
by copy
core.js
proposals
aquí lo chungo
de esto
creo que
import
no sé si
ahora
deberíamos ser capaces
de utilizar esto
to reverse
y no petar
al menos
no petar
si
a ver
vale
pues ha petado
can of find module
a ver
que también puede ser
porque ves que aquí
este no me lo he encontrado
porque dice que no lo encuentra
pero sí que está
ves que está aquí
aquí están
hostia
es que tiene
ves que pone
require
no sé qué
require
no sé qué
require
require
no sé si habrá uno
que sea de
emmascript
module
porque eso utiliza
requires
a ver
si no por ahora
lo que voy a hacer
es cargarme esto
vamos a poner esto
y le voy a quitar
el
le voy a quitar
el módulo
y por ahora voy a hacer
un require
¿vale?
porque si no
es un poco rollo
ahora
preocuparme
de
de si se puede utilizar
import y tal
esto es porque
hay veces
que todavía están mezclando
los common.js
con los emmascript
modules
y hay algunos
que solo soportan
require
a día de hoy
y que no funcionan
del todo bien
con import
puede ser que
vayan por aquí
los tiros
o puede ser
que el problema
mira
mira mira
espérate
vamos a probar
una cosa más
antes de quitar
el time module
puede ser
que necesite
la extensión
¿vale?
y ahora
puede ser
que sí que funcione
efectivamente
ahora sí que funciona
¿por qué?
porque los emmascript modules
necesitas
añadir la extensión
¿vale?
es algo que necesita
la especificación
¿cuándo puedes evitar
utilizar la extensión?
pues en el package.json
aquí debería tener
un export
y aquí tendría que tener
como todos los que puedes
ir importando
por ejemplo
tendría que poner
core.js
no sé qué
tendría que hacer esto
tendría que poner algo así
aquí así
y aquí tendría que indicar
dónde es que encuentra
este fichero
y aquí tendría que poner
punto
proposals
tendría que
aquí sí que tendría la extensión
como no lo tienen hecho
por eso necesitamos
añadir la extensión
esto es un problema
que cada vez más
más gente se va a volver loca
el hecho de no poner la extensión
como yo
que me acaba de pasar
lo habéis visto
me acaba de pasar
he estado a punto de liarla
¿vale?
así que
vale
vamos a ver esto
vamos a ver esto
el to reverse este
vamos a ver que funciona
y ahora
vemos los otros
para que
vale
¿veis?
funciona perfectamente
perfecto
ok
vale
bueno pues ya habíamos probado
el to reverse
teníamos también
el to
to spliced
que este es bastante
to spliced
este si no me equivoco
era
¿cómo era el to spliced?
era
el segundo
el segundo parámetro
es
los que quieres borrar
a ver
¿dónde he dejado esto?
to spliced
ah
¿dónde empieza?
los que quieres borrar
y los que quieres añadir
vale
tenemos en los arrays
tenemos aquí
tendríamos el splice
que es diferente al slice
que tú le dirías aquí
el índice
en el que quieres borrar
por ejemplo
pongamos que es el 0
el 1
o sea quiero borrar el 2
en el índice 1
quiero borrar un elemento
y quiero meter el número 3
¿vale?
vale pues me ha dejado el 2
me ha dejado aquí
fino
vale
mmm
ahí
espérate
esto es donde quiere empezar
ah
hostia
es que es bastante tiki el splice
tío
es que el splice
claro
estaba flipando
y digo
¿por qué me devuelve un 2?
y es que el splice
es un poco ñe
porque el splice
lo que devuelve
es el array
de los elementos
que ha borrado
no devuelve el mismo array
¿vale?
no devuelve el array
modificado
entonces
es que el splice
no lo uséis nunca
si podéis evitarlo
no lo uséis
¿vale?
porque es un poco rollo
vale
como puedes ver
el numbers splice
me devuelve el 2
¿por qué?
porque le he dicho
este es el start
que es donde empieza
¿vale?
start
el segundo es
delete count
es el número de elementos
que quiere que borre
delete count
y luego
sería
items to add
¿vale?
que aquí le he puesto 3
pero podríamos ponerle aquí
porque son los argumentos
aquí le podríamos poner
tantos números como queramos
por ejemplo
quiero añadir
a partir del 1
o sea
en este índice
quiero eliminar 1
y quiero añadir el 3
el 4 y el 5
de forma que vamos a tener aquí
ahora un nuevo array
en numbers
porque además modifica
la array original
lo es 1
3
4
5
3
¿por qué?
porque donde estaba el 2
lo que hemos dicho es
donde está el 2
méteme el 3
el 4
y el 5
el splice
es una locura
es un rollazo
el splice
la verdad es un poco
pero yo la verdad
es que intentaría evitar
utilizarlo
ahora
van a añadir
el 2 splice
tiene bastante más sentido
es re cómodo
sí, a ver
es re cómodo
pero es verdad
que es un poco rollo
porque
a la hora de lo que te devuelve
te devuelve
lo que ha
lo que ha quitado
lo cual es un poco raro
muy complicado
exagerado ¿no?
es un poco complicadete
pero es verdad
que es bastante potente
porque es un método
es un método
que hace demasiadas cosas
de hecho normalmente
está como rotísimo
está rotísimo
porque es un método
que te permite
borrar elementos
e introducir elementos
y además
hacer los momentos
¿sabes?
es un poco
es un poco raro
porque normalmente
los métodos de array
como que hacen una sola cosa
pero no
splice hace
no solo te permite
eliminar los elementos
sino que
añadir elementos
donde habías eliminado
o sea
y te devuelve
los elementos
que ha borrado
un poco raro
normalmente
sería bastante parda
cuando utilizas
un splice
si podéis evitarlo
si lo tenéis muy controlado
pues nada
hacerlo
entonces
ahora
han añadido
el to splice
y tiene una cosa positiva
el nuevo to splice
y es que ahora
no te devuelve
ahora lo que hace
es devolverte
el nuevo array
lo cual
tiene más sentido
de hecho
no podría funcionar
de otra forma
porque como tiene
que devolverte
un nuevo array
pues por eso lo hace
entonces al to splice
le podemos decir
vale
en el número 1
vamos a hacerlo así
vamos a hacer el mismo ejemplo
vamos a hacer el mismo ejemplo
porque aquí podemos ver
que el console.log
el numbers
me ha editado
el array original
entonces aquí
podríamos hacer
el numbers
1,1
splice
vamos a hacer
to splice
y aquí deberíamos ver
que el numbers
sigue siendo
1,2,3
y este me ha devuelto
un new numbers
que este sí que está editado
vale
y lo bueno
es que es un poco
más sencillo
de pensar
porque hace
lo que uno esperaría
que es que te devuelve
el nuevo array
no un array
de lo que ha eliminado
que es un poco raro
es un poco raro
porque también
te permite añadir
entonces
porque me
es como un trozo
me está dando
un trozo de la funcionalidad
es un poco extraño
así que
ahora
vamos a ver
el test
vale
que no puedo encontrar
no puedo encontrar
el archivo este
que me he inventado
vale
vale
pues ya ves
numbers
ha quedado igual
y aquí
el new numbers
está funcionando
con splice
vale
luego tendríamos
el to sort
que sería exactamente
lo mismo
y ahora tenemos
uno nuevo
que es muy interesante
que es el width
este
este es muy curioso
¿qué pasa?
si lo miráis fríamente
si tenemos un
array
vale
cuando queréis
cambiar
por ejemplo
imagínate que quieres
cambiar
este
este número
uy
ya solo
la idea
de que no
modifique
el array
original
me flipa
totalmente

es que
se están
metiendo mucho
con la
inmutabilidad
en javascript
y esto
es solo
el principio
además
estos métodos
que estáis viendo
también los
tendremos disponibles
en
en records
y en tuplas
bastante importante
ahora
hay un tema
interesante
cuando tenemos
un array
y queréis
modificarlo
haríamos
por ejemplo
imaginad
que quiero
cambiar el 3
pues haríamos
en la posición 2
¿no?
le pondría
por ejemplo
el 6
y ahora
¿qué pasa?
pues que el array
está modificado
obviamente
¿no?
esto
ya sabemos
todos cómo funciona
¿no?
estamos asignando
un nuevo valor
¿vale?
un 2
6
4
5
lo que hemos
hecho
es que en la
posición 2
le hemos puesto
el 6
esto parece
una tontería
¿vale?
esto parece
una tontería
pero
en realidad
ya estamos
mutando
el array
original
queramos o no
estamos mutando
el array
original
¿cómo podríamos
hacer
de evitar
esto?
esto es una cosa
que muchas veces
por ejemplo
si utilizáis
redax
o queréis
crear un nuevo
estado
es súper útil
lo que vamos
a ver ahora
porque hay veces
que claro
el estado
tiene que ser
inmutable
y hay veces
que en un array
simplemente
quieres cambiar
un valor
que hay
en una posición
¿y cuál es el problema?
el problema
es que no hay
una forma fácil
siempre tienes que crear
copias
que son bastante rollo
tienes que hacer
un slice
tendrías que hacer
array.slice
del 0
al index
luego aquí
ponerle
el número
por ejemplo
el 6
y luego
array
tendrías que hacer esto
esto es un rollo
esto es un rollo
cuando quieres
por ejemplo
imagínate que queremos
hacer que esto sea
cambiarle
el 6
pero de forma
o sea
este 3
pasarlo a 6
pero
sin
evitando
modificar
el original
pues tendríamos que hacer
algo así
esto es un rollazo
esto es un rollazo
new
array
y el index
esto sería el 2
¿no?
y el new array
vamos a poner esto por aquí
para asegurarme
que lo he hecho bien
vale
array is not defined
porque no he copiado
el array
vale
imagina que solo queréis
cambiar un valor
vale
pues haríais esto
¿no?
vale
1, 2, 6, 4, 5
y de esta forma
array
si yo pongo aquí
array
pues veis
que sigue
el original
no está mutado
y hemos creado
un nuevo array
pero fíjate
lo que hemos tenido
que montar
lo que hemos tenido
que montar
para cambiar
un valor
para eso está el splice
pero es que el splice
no está para eso
el splice
justamente
uno
te muta
el array original
y además
no solo está para esto
el splice
está también
para añadir
nuevos elementos
y está para borrarlo
y añadirlo
que es diferente
no es lo mismo
cambiarlo
¿no?
que es lo que estaríamos
haciendo aquí
o sea
lo que querríamos hacer
con esto
es asignar
un nuevo valor
y punto
el splice
lo que está haciendo
es borrarlo
y añadir otro
que sé que el resultado
final es el mismo
pero estamos haciendo
más cosas
no sé si me entendéis
¿vale?
entonces
espérate que aquí
viene lo bueno
lo bueno de todo esto
lo bueno de todo esto
es que hay un nuevo método
que se llama
width
que nos va a permitir
hacer esto
pero puedes no borrar
claro pero si
claro puedes no borrar
cierto es
puedes no borrar
podría poner
delete count 0
pero el delete count
claro me dices
puede no borrar
ahora tengo dudas
vamos a ver eso
vamos a ver eso
splice
y le decimos
en el 2
0
y 5
ahora no tengo claro
bueno claro
es que también
encima lo muta el cabrón
claro pero
un 2
claro pero ves
si no lo borras
se queda
es que es el problema
es que el splice
es una puta mierda
es una mierda
¿vale?
dice
¿y no es mejor
copiar todo el array
y tal?
claro
es que
Marcos
puede ser
que en este caso
parece que sería mejor
lo que dice Marcos
¿no?
dice ah pues copias
todo el array
y ya está
claro pero Marcos
eso
eso es un ejemplo
lo que dice Marcos
es
vale pues
¿por qué no haces esto
new array?
esto lo puedes hacer
porque sabes
que es un array
de números
¿vale?
new array
2
6
esto funcionaría
en este caso
pero imagínate que el array
fuese de objetos
entonces ya empezaríamos
a liar más
empezaría a ser más complicado
porque cuando empieza a ser
ya objetos más complejos
pues empezaría a ser más complejo
¿sabes?
ya dirías
hostia
como son objetos
ahora no sé
si
solo puedo asignarlo
o me quiero quedar
con lo de dentro
de hecho eso suele ser
el problema que tienes
en Redux
que por eso se suele hacer esto
esto os lo he explicado así
pero normalmente aquí
lo que se hace es
por ejemplo
esto sería
el array
sería
array
del index
con el name
por decir algo
¿vale?
empieza a ser cada vez
más complicado
entonces por eso
os lo suelen hacer así
además de que hacer
un array completo
una copia completa
a lo mejor es un poco
más costoso
que tampoco tiene
por qué ser mucho
pero puede ser una forma
el tema
de todo esto
¿vale?
el tema de todo esto
que hay una forma
más fácil de hacerlo
¿vale?
claro
no se borra
pero es lo que estabas haciendo
con el 6 en medio
no porque yo aquí
lo estoy intercambiando
estoy haciendo 1, 2
y este 3 pasa a ser 6
si yo le pongo
el delete count a 0
pues me lo queda aquí en medio
me lo deja aquí en medio
¿ves?
1, 2
este 3 me lo deja aquí en medio
y yo quiero es cambiarlo
para hacer esto
tienes que hacer esto
y entonces ahora sí que funciona
pero claro
entonces lo borra
y lo añade
pero bueno
que tampoco
que es un poco más complejo
y es más complejo de pensar
¿por qué?
porque es mucho más fácil
de pensar esto
¿no?
la idea es
¿cómo hacemos esto?
pero inmutable
¿sabes?
¿cómo hacemos esto inmutable?
sin necesidad de hacer
todo lo que hemos visto
pues ahora vamos a poder
hacer esto
array
with
y le decimos
y le decimos
en el índice 2
quiero que me pongas el 6
he puesto el 6
como que esto podría ser
un objeto
podría ser lo que queramos
¿vale?
y esto
lo que me va a devolver
es un nuevo array
¿vale?
y lo vamos a ver así de claro
¿vale?
voy a quitar esto
esto lo que va a hacer
es me va a devolver
un nuevo array
donde la posición 2
va a tener el 6
y el array original
lo va a mantener
o sea que es un nuevo método
que este método
sí que le veo bastante
hostia
ay
que he puesto
es este
¿vale?
¿veis?
me devuelve un nuevo array
donde le digo
en el índice 2
quiero que lo cambies por
yo he puesto 6
pero al final
esto podría ser
lo que yo quiera
podría ser también
un objeto
podría ser lo que queramos
¿eh?
y a este
a este método
le veo bastante
¿veis?
un 2
y en el índice ese
lo ha cambiado
me ha devuelto un nuevo array
y con una
nomenclatura súper sencilla
súper fácil
y esto es como
inmutable
y esto
esto sería
mutable
entonces ya tenemos
una forma
esto sería así
¿vale?
name
persona
y creo que es mucho más fácil
de que los
splice
que la copia
además lo bueno de esto
aunque parezca una tontería
este tipo de métodos
que van a ser inmutables
también van a ser mucho más
van a tener mejor rendimiento
que todas las
copias que se hacen
con los punto punto punto
tened en cuenta que eso
aunque está bastante optimizado
en el motor
quieras o no
se hace la copia
y es como más verboso
esto va a ser como más declarativo
es el hecho de que
es más programación funcional
en el que
le decimos básicamente
lo que queremos
no cómo lo tiene que hacer
¿vale?
lo que hacemos de la otra forma
es
haz una copia de esto
cambia esto
¿no?
y aquí lo que estamos diciendo
es quiero el array
con
el índice este
este valor
y ya está
entonces
¿desde cuándo lo puedo usar?
va a ser este año
¿vale?
va a ser este año
así que
ya está
son cosas del demonio
lo que haces
el demonio
el demonio
hombre
nos estamos pasando
creo yo
con tanto sugar
pero esto no es sugar
o sea en realidad
esto no es tanto sugar
esto es una funcionalidad nueva
sugar sería
si esto hiciese
¿sabes?
si alguien te dijese
no es que esto
es esto
claro
aquí tendría que hacer
esto no es sugar
sugar sería
si esto
hiciese por debajo
lo mismo
pero no hace exactamente lo mismo
esto va a tener
mejor rendimiento
que lo otro
porque esto realmente
es
es una funcionalidad
que lo que va a hacer
es directamente
dentro
hacer la copia por ti
entonces sugar sería
si
al final
es como el class
que el class por debajo
en realidad
sí que hace
sí que tienes
persona
punto
prototype
son como diferentes
esto es una funcionalidad
que al final
yo creo que
es como
también sería como decir
que el punto map
es sugar
de hacer un for
yo creo que son añadidos
interesantes
la verdad
porque
acerca bastante
la programación funcional
sin necesidad de tener
dependencias
dice gente que es stevia
a ver va
que os leo
que me está por aquí
nos estamos pasando
demasiado vocabulario
lo que dificulta
el aprendizaje
y hace el lenguaje muy pesado
bueno
el lenguaje
que sea pesado
no sé
tú crees que esto es mejor
pero toda esta funcionalidad
es solo para node
o también podrán correrlo
los navegadores
de forma nativa
claro
esto es una funcionalidad
que va a llegar en javascript
si llega a javascript
llegará node
estos son nuevos métodos
de array
que van a llegar a javascript
entiendo que hay gente
que dice
nos estamos pasando
con sugar
o que dificulta
el aprendizaje
a ver
no hace falta
aprenderse todos
los métodos de array
no hace falta
no hace falta
pero
entre la opción
de
yo creo que estos métodos
tienen todo el sentido del mundo
porque era una anomalía
en javascript
era una anomalía
que había cuatro métodos
de array
que mutaban el original
cuando hay otros
que no lo hacen
muchos otros
que no lo hacen
y estos en cambio
no había una contraparte
que no lo mutase
eso por un lado
y por otro lado
esto te obligaba
muchas veces
a tener una dependencia
que eso sí hace
que javascript
necesite dependencias
para hacer algo
que debería estar
en el lenguaje
creo que todo lo que sea
tema de inmutabilidad
en el propio lenguaje
es súper importante
y creo que esto
es un buen añadido
hay que tener cuidado
con las cosas que se añaden
pero al final
no hay que saberse todo
javascript
pero creo que saber
más o menos que funciona
al final muchas veces
este tipo de cosas
lo hacen dependencias
y es mucho peor
yo creo que para el lenguaje
¿qué hace el método
width por debajo?
¿se puede ver?
hombre podemos ver el
claro podemos ver el
mira aquí podemos entrar
al polyfill
y aquí lo podríamos ver
array width
array width
pues aquí tendríamos
un poquito
lo que hace
aquí tendríamos
un poquito
lo que hace
mira vamos a quitar
los bar
para que no se me queje
tanto la cosa esta
length
vale
recupera el array
hay el length
del array
luego recupera
el index relativo
vale
entonces
recupera
el índice actual
tened en cuenta
que esto es un polyfill
que esto lo hace
con javascript
la idea es que cuando
lo añada el navegador
no lo hará
así exactamente
vale
mira si está en el rango
correcto
luego
crea un array
del mismo
de la misma longitud
y lo que hace aquí
es básicamente
ir añadiendo los todos
con un for
los va añadiendo todos
excepto
el que está en ese índice
este sería
un poco la funcionalidad
simular la funcionalidad
que haría
en el propio motor
lo que hace
es un nuevo array
con una longitud
itera
el array
que venía
y se los copia
a todos
excepto
el que viene
en el índice
que entonces
le añade
el valor nuevo
ya está
eso es lo que haría
el polyfill
y ya estaría
entonces
en cuanto a términos
de performance
da igual
que hagas una copia
del array
y utilices reverse
a usar
no
yo creo que no
a temas de performance
será mucho más rápido
con polyfill
con polyfill
seguramente sea igual
pero cuando utilices
el to reverse
nativo
del navegador
será mucho más rápido
que el de hacer una copia
y utilizar reverse
será mucho más rápido
seguro
claro
es que es parte de la gracia
es parte de la gracia
eso
por eso digo
que no es exactamente sugar
o sea
que no es azúcar sintáctico
ya está
sino que realmente esto
lo que va a hacer
es tener unas optimizaciones internas
para evitar
el coste que tiene
hacer en el propio cliente
o en el código
de más alto nivel
hacer la copia del array
porque no es lo mismo
hacerlo en lo más alto
que hacerlo directamente
en el motor
y yo creo que irá más rápido
que no es que vaya a ser
un problema
muchos motivos
me recomiendas
algún sitio
para hacer ejercicios
adventgs.de
una consulta
algún día podrías hacer ejercicio
de transformar
de json
otro tipo json
ejemplo esto
json con quiz repetidas
acumular
he hecho un montón de esos
pero vale
si no
en discord
puedes dejar el ejercicio
y le echamos un vistazo
hola midu
olvidé tu directo
nada lol
como te olvidas
de mi directo
no te lo perdonaré jamás
no pasa nada
no pasa nada
pero que no se vuelva a repetir
que broma
si el map lo considero sugar
también
bueno a ver
si el map lo considera sugar
entonces todo sugar
en la vida
todo
todo
porque si el map es sugar
todo
todo sugar
switch
es un sugar
de leaf
todo sugar
el map
sirve para renderizar
eso es solo un ríac
en unos años
con una línea
vamos a ahorrar miles
hombre yo creo que
poco a poco
ahí vamos mejorando
pues a mi me parece
algo muy útil
a ver yo creo que
bastante útil
especialmente el width
el tener la posibilidad
de cambiar un índice
de un array
sin mutarlo
joder
es que es algo
que va a facilitar
un montón
de cosas
simplemente se van dejando
atrás mierdas
por cosas nuevas
bueno eso si
basta con recordar
que existen
esa es lo importante
la sugar es mala
para la salud
totalmente
mira
midu dijo
que el filter
ya no se debe usar
yo no he dicho eso
yo no he dicho eso
que no se debe usar
digo que se tiene que usar
para lo que está pensado
ay que bueno
por fin javascript
se ajorna
ajorna
que es ajorna
hay compatibilidad
en todos los navegadores
por ahora no
german ugu
german ugu
esto que hemos visto
va a llegar a los navegadores
este año
pero todavía no hay compatibilidad
solo el 99%
hay que saber de javascript
mucho menos
mucho menos
no sabemos
no sabemos el 99%
ninguno de los que estamos aquí
ni en broma
que es un polyfill chicos
bueno lo he explicado muchas veces
sobre todo en el canal secundario
tengo un vídeo
que explico que es un polyfill
pero básicamente
un polyfill sería
añadir una funcionalidad
al entorno de ejecución
de javascript
en este caso
un navegador
o a no.js
que todavía no soporta
¿vale?
esto que quiere decir
pues que si todavía
en este caso
no está
no.js
no soporta
no soporta
este método
.wiz
no lo soporta
pero hemos importado
un polyfill
que lo que hace es
añadir esta funcionalidad
a través de un parche
al prototype
para que la puedas utilizar
en tu código
sin darte cuenta
sin tener que preocuparte
si lo soporta
o no lo soporta
eso sería un polyfill
¿vale?
vale
el otro
with pocho
why slow mode
pues eso
lo ha puesto feral
porque me imagino
que estáis escribiendo
un montón
me imagino
¿qué quiere decir
que sea sugar o azúcar?
básicamente
el azúcar sintáctico
hostia
es una hueá
que se creo
para lo que no
poporta
interente
exporer
el nuevo
de Apple
¿cómo?
no me he enterado
la hueá del huevón
¿qué ha sido eso?
no me he enterado
¿qué quiere decir sugar o azúcar sintáctico?
básicamente
el azúcar sintáctico
es para escribir
o para hacerte más fácil
algo que escribes
normalmente
en javascript
o en cualquier lenguaje
para evitarte
el boilerplate
¿vale?
o para hacerlo
más agradable
a la vista
o para que lo escribas
de una forma más corta
cosas así
por ejemplo
el async await
podría considerarse
que es un azúcar sintáctico
de las funciones generadoras
y de las promesas
podría ser un azúcar sintáctico
para eso
o el class
es un azúcar sintáctico
del prototype
al final
lo que se busca
es que no sea tan engorroso
escribir código
y el azúcar sintáctico
son
la misma funcionalidad
que la escribes
de otra forma
más fácil
el asécima
y el async
la competencia
o el async
bilmembros
y el as Chargar
o el async
lap incidence
y el async
a la gran medicina
por ejemplo
en el async
junto con el asarb
en el async
y el asicht