Introducción al curso

1

¡Alto! Tenemos una nueva versión de este curso para ti

2

Bienvenidos al Curso de Fundamentos de JavaScript

3

Repositorio de este curso de fundamentos de JS

Primeros pasos en JavaScript

4

Variables

5

Variables: Strings

6

Variables: Números

7

Funciones

8

El alcance de las funciones

9

Objetos

10

Desestructurar objetos

11

Parámetros como referencia o como valor

12

Comparaciones en JavaScript

Estructuras de Control y Funciones

13

Condicionales

14

Funciones que retornan valores

15

Arrow functions

16

Estructuras repetitivas: for

17

Estructuras repetitivas: while

18

Estructuras repetitivas: do-while

19

Condicional múltiple: switch

Arrays

20

Introducción a arrays

21

Filtrar un array

22

Transformar un array

23

Reducir un array a un valor

Programación Orientada a Objetos en JavaScript

24

Cómo funcionan las clases en JavaScript

25

Modificando un prototipo

26

El contexto de las funciones: quién es this

27

La verdad oculta sobre las clases en JavaScript

28

Clases en JavaScript

Asincronismo

29

Funciones como parámetros

30

Cómo funciona el asincronismo en JavaScript

31

Cómo funciona el tiempo en JavaScript

32

¿Qué pasó con swapi.co?

33

Callbacks

34

Haciendo múltiples requests

35

Manejando el Orden y el Asincronismo en JavaScript

36

Manejo de errores con callbacks

37

Promesas

38

Promesas Encadenadas

39

Múltiples promesas en paralelo

40

Async-await: lo último en asincronismo

Juego de HTML

41

Comenzando el juego

42

Generando una secuencia de números

43

Iluminando la secuencia de colores

44

Obteniendo el input del usuario

45

Agregando la verificación del color elegido

46

Agregando los estados finales del juego

47

Conclusiones del curso

Complementos

48

Diferencias entre var, let y const

49

Memoización: ahorrando cómputo

50

¿Hace cuántos días naciste?

51

Funciones recursivas

52

Entiende los closures de JavaScript

53

Estructuras de datos inmutables

54

Cambiando de contexto al llamar a una función

55

¿Cuándo hace falta poner el punto y coma al final de la línea?

No tienes acceso a esta clase

¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera

Entiende los closures de JavaScript

52/55
Recursos

Un closure, básicamente, es una función que recuerda el estado de las variables al momento de ser invocada, y conserva este estado a través de reiteradas ejecuciones. Un aspecto fundamental de los closures es que son funciones que retornan otras funciones.

Aportes 154

Preguntas 22

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad?

Vengo del futuro, del curso profesional de JavaScript, les comporto mis apuntes para entender un poco mas de los closures, sin embargo, en el curso de JS profesional se explica todo un poco mas claro.

Resumen de la Clase
Closures

Un closure es una función que recuerda el estado de las cosas cuando fue creada.
Una función que devuelve otra función con parámetros invocados en dos veces; primero el de la función ‘padre’ y luego el de la función ‘hijo’.

Para ejemplificar generemos una función que va a crear saludos. En este caso hagamos un saludo argentino, uno mexicano y otro para colombia.


function crearSaludo(finalDeFrase) {
	return function(nombre) {

	}
}

La función ‘padre’ es generadora o creadora de otras funciones y la función ‘hijo’ es anónima, es la que nos va a devolver el resultado.
Vamos a llamar esta función para crear constantes.


const saludoArgentino = crearSaludo('che')
const saludoMexicano = crearSaludo('wey')
const saludoColombiano = crearSaludo('amigo')

Entonces ahora podemos llamar a la función nuevamente a través de cada variable constante y pasando el parámetro de la función ‘hijo’ esta vez, el parámetro ‘nombre’ para generar el saludo de la siguiente manera.


saludoArgentino('Pablo')  // Hola Pablo che
saludoMexicano('Pablo')   // Hola Pablo wey
saludoColombiano('Pablo') // Hola Pablo amigo

Y agregamos la respuesta de la función (el console.log en este caso) en la que accedemos a la variable ‘finalDeFrase’ generada en la declaración de los diferentes saludos


function crearSaludo(finalDeFrase) {
	return function(nombre) {
		console.log(`Hola ${nombre} ${finalDeFrase}`)
	}
}

La variable ‘finalDeFrase’ es la generada en las constantes con el nombre mismo de la función, a partir del parámetro que le pasamos; ‘che’, ‘wey’ o ‘amigo’ en este caso.
La función ‘hijorecuerda cada una de las variables generadas que se usó para crear el saludo.
Y la función ‘hijo’ va a ser cada una de las constantes creadas; saludoArgentino, saludoMexicano o saludoColombiano en este mismo caso.


const saludoArgentino = crearSaludo('che')

Al invocar la función ‘hijo’ luego, le pasamos el parámetro ‘nombre’ y así la función se completa y nos imprime el saludo ‘Hola Pablo che’ en este caso.


saludoArgentino('Pablo')  // Hola Pablo che

El código completo queda así:


function crearSaludo(finalDeFrase) {
	return function(nombre) {
		console.log(`Hola ${nombre} ${finalDeFrase}`)
	}
}

const saludoArgentino = crearSaludo('che')
const saludoMexicano = crearSaludo('wey')
const saludoColombiano = crearSaludo('amigo')

saludoArgentino('Pablo')  // Hola Pablo che
saludoMexicano('Pablo')   // Hola Pablo wey
saludoColombiano('Pablo') // Hola Pablo amigo



saludoColombiano -> ‘parce’

Ya entendí como funciona!
saludoMexicano( ‘Héctor’ ) --> manda llamar a la función crearSaludo( ‘güey’ ).
crearSaludo( finalDeFrase ) --> recibe la segunda variable que enviaste güey como finalDeFrase.
return function( nombre ) --> recibe la primer variable que enviaste Héctor como nombre.
function( nombre ) --> -Denominada closure- puede utilizar las variables que estén dentro de la función que lo rodea, en este caso puede utilizar nombre de la función crearSaludo
finalDeFrase y nombre --> son las variables que pueden utilizarse en la función closure function(nombre)
console.log(Hola ${nombre} ${finalDeFrase}) --> imprime en consola Hola Héctor güey

Otro ejemplo puede ser:

saludoColombiano( ‘Héctor’, ‘Martínez’) --> manda llamar a la función crearSaludo( ‘Hola’ , ‘amigo’ ).
crearSaludo( saludo, finalDeFrase ) --> recibe las variables que enviaste Hola y amigo como saludo y finalDeFrase respectivamente.
return function( nombre, apellido ) --> recibe las primeras variables que enviaste Héctor como nombre y Martínez como apellido.
function( nombre, apellido ) --> -Denominada closure- puede utilizar las variables que estén dentro de la función que lo rodea, en este caso puede utilizar nombre y apellido de la función crearSaludo
saludo, finalDeFrase, nombre y apellido–> son las variables que pueden utilizarse en la función closure function(nombre)
console.log(${saludo} ${nombre} ${apellido} ${finalDeFrase}) --> imprime en consola Hola Héctor Martínez amigo

Lean la edición Scope & Closures del libro You Dont Know JS de Kyle Simpson si quieren reforzar esto y van a entrar en lo mas profundo de Javascript

La funcion que se guarda dentro de la constante es la funcion que se retorna. Cuando creas la constante, es como si invocaras la funcion de crearSaludo(), que esta a su vez retorna la funcion anonima que es la uqe guarda en la costante.
Cuando creas la constante e invocas la funcion le pasas el parametro “finalDeFrase”, que tambien es guardado dentro de la constante. El closure consiste en esto. Que la constante esta fuera del bloque de crearSaludo() —fuera del scope de la funcion— pero aun asi tiene acceso al parametro “finalDeFrase”.

Espero les sirva, saludos!

Vengo del Curso Profesional de Javascript. Sepan que ahí se da una explicación un poco más amplia del uso de closures 😃

Wow lo más extraño que he visto,
#JavascriptRecuerda

Los puntos intermedios seria estos:
de la manera mas sencilla de entender para mi es que llamamos a una funcion que manda un valor a otra funcion

En esta ocacion guardamos la primera funcion en una constante, nada mas dificil que eso

Como podemos hacer el codigo mas chico lo hacemos

Espero no equivocarme. El resultado es que al llamar a la constante que llama a la funcion crearSaludo(‘che’) y en el return llama a la funcion que lo llamó, por lo que no es necesario poner su nombre, solo los parametros para utilizarlos.

Diocito me hara entender

Hola, a modo de comentario, como dice Sacha, si esto da confianza y es tan fundamental, deberian dar mas refuerzo sobre este tema

código JS clase 45 —> CLOSURES

function crearSaludo(finalDeFrase){
    return function (nombre){
        console.log(`Hola ${nombre} ${finalDeFrase}`)

    }
}

const saludoArgentino= crearSaludo('che')
const saludoMexicano= crearSaludo('guey')
const saludoColombiano= crearSaludo('parcero')

saludoArgentino('Jei')
saludoMexicano('Jei')
saludoColombiano('Jei')

Para entender un poco esta clase les comparto algo de lo que he entendido y revisado:

Un clousure permite acceder al ámbito de una función exterior desde una función interior. y como dato importante los clousures se crean cada vez que una función es creada.
Es decir en un ejemplo diferente al que se ha explicado en la clase es:

function creaSumador(x){
     return function(y){
           return x+y;
   };
}

Aquí se ha definido una función que se llama crearSumador que recibe sólo un argumento que es el valor de x esta función devuelve otra función y esta nueva función toma como parámetro y que es el otro argumento para poder realizar la suma.

var suma5 = creaSumador(5);
var suma10 = creaSumador(10);

Definimos dos variables para ejecutar la función definida

y luego en un console.log queremos mostrar el resultado de la suma así:

console.log(suma5(2))

Le pasamos a la variable definida suma5 el parámetro de 2 la suma nos dará 7

console.log(suma10(10))

Le pasamos a la variable definida suma10 el parámetro de 10 la suma nos dará 20

Todo esta explicación ha sido revisada de la documentación de developer mozilla

https://developer.mozilla.org/es/docs/Web/JavaScript/Closures

Un ejercicio sencillo que me ayudó a comprender un poco mas lo que es un closure. Se trata de una persona que se presenta con nombre, edad y peso.

function presentaPersona(edad, peso) {
            return function (nombre) {
                console.log(`Soy ${nombre} tengo ${edad} años  y peso ${peso} kilos`)
            }
        }
        const edadYPesoLuis = presentaPersona(30, 70)
        const edadYPesoPedro = presentaPersona(25, 68)
        const edadYPesoAlberto = presentaPersona(23, 74)

        edadYPesoLuis('Luis')
        edadYPesoPedro('Pero')
        edadYPesoAlberto('Alberto')

Saludo colombiano: parce, compa, pri, primo

jejejeje… Es más común que en México digamos “wee” a “güey”

Consegui este ejemplo en internet que explica lo que quiere decir el profesor:

function getCounter() {
  let counter = 0;
  return function() {
    return counter++;
  }
}
let count = getCounter();
console.log(count());  // 0
console.log(count());  // 1
console.log(count());  // 2```

closure es un tipo especial de objeto que combina dos cosas: una función, y el entorno en que se creó esa función.

Me encanto la parte de que en Mexico se dice güey

en colombia decimos parcero

Pirobo debía poner :v

Vaya que espero encontrar mas ejemplos en los siguientes cursos, me falta pulir este tema tan interesante.

buena clase, toca buscar mas material para entender mas el tema, sigo con el curso de js

Les comparto mi ejemplo con la explicación al hacer debug 😁

<function crearSaludo(finalDefrase) {
  return function (nombre) {
    console.log(`Hola ${nombre} ${finalDefrase}`)
  }
}

//crea los saludos con los finales de frase
const saludoArgentino = crearSaludo('che')
const saludoMexicano = crearSaludo('way')
const saludoColombiano = crearSaludo('parcero')

saludoArgentino('Omar')//Hola Omar che
saludoMexicano('Omar')//Hola Omar way
saludoColombiano('Omar')//Hola Omar parcero

//1. Crea saludo con la final de finalDefrase
//2. Entra a la función que recibe el nombre y esta la toma de el saludo de cada tipo
//3. Imprime
//4. Sale de la función y vuelve a repetir el proceso con el siguiente saludo>

Otro ejemplo

function creaSumador(x) {
  return function(y) {
    return x + y;
  };
}

var suma5 = creaSumador(5);
var suma10 = creaSumador(10);

console.log(suma5(2));  // muestra 7
console.log(suma10(2)); // muestra 12 
/*Entiende los closures de JavaScript
Un closure, básicamente, es una función que recuerda el estado de las variables al momento de ser invocada, y conserva este estado a través de reiteradas ejecuciones. 
Un aspecto fundamental de los closures es que son funciones que retornan otras funciones. */

function crearSaludo(finalDeFrase) {
    return function (nombre) {
        console.log(`Hola ${nombre} ${finalDeFrase}`)
    }
}

const saludoArgentino = crearSaludo('che')
const saludoMexicano = crearSaludo('Güey')
const saludoColombiano = crearSaludo('Parce')

saludoArgentino('Ronald')
saludoMexicano('Ronald')
saludoColombiano('Ronald')```

No tengo idea de como lo usare pero el momento llega, voy a repasar para dominarlo

En crearSaludo uso el parametro finalDeFrase y luego en la función más abajo le entrego che, guey y amigo. Eso me hace sentido.

No me hace sentido que sepa quien es nombre. ¿En que minuto le estoy diciendo que nombre es Sacha?

//Aqui la funcion nuevo saludo va a retornar la Funcion anonima la cual recibira por parametro nombre
    
function nuevoSaludo(finalFrase){
      return function(nombre){
        console.log(`Hola ${nombre}, como estas? ${finalFrase}`)
      }
    }

    //En este caso como invocamos la funcion nuevo saludo esta nos retorna la funcion anonima, y es eso lo que estamos guardando en las constantes 'LA FUNCION ANONIMA QUE ESTA DENTRO DE nuevosaludo, Por tal razon cuando se le pase un parametro a algunas de las constantes este pertenecera al parametro nombre'
    
const saludoDominicano = nuevoSaludo('Miop')
    const saludoArgentino = nuevoSaludo('Che')
    const saludoMexicano = nuevoSaludo('Guey')
    const saludoColombiano = nuevoSaludo('Parcero')

    saludoDominicano('Jesus')
    saludoArgentino('Luis')
    saludoMexicano('Machete')
    saludoColombiano('Freddy')```

closures

const miContador = function() {
    let _contador = 0
    function incrementar(){
        return ++_contador
    }
    function decrementar(){
        return --_contador
    }
    function valor(){
        return _contador
    }
    return {
        incrementar,
        decrementar,
        valor
    }
}();

miContador.valor() // 0
miContador.incrementar() // 1
miContador.incrementar() // 2
miContador.incrementar() // 3
miContador.decrementar() // 2
miContador.valor() // 2
  function saludopersonal(pais) {
        return function(nombre) {
          console.log(`Hola, mi nombre es ${nombre} y soy de ${pais}`)
        }
      }
      const saludo1 = saludopersonal('Peru')
      const saludo2 = saludopersonal('Colombia')
      const saludo3 = saludopersonal('Brasil')

      saludo1('Dihan')
      saludo2('Andres')
      saludo3('Nuno')

seria como una función de funciones?
o una función que retorna a otra nueva y entonces podríamos hacer funciones nuevas partiendo de una función wooww

jajajaja el saludo mexicano wey porque en mexico dicen wey jajaajajaja

const crearSaludo = finalDeFrase => nombre => console.log(`Hola ${nombre} ${finalDeFrase}`)

const saludoColombiano = crearSaludo('parcero')
const saludoArgentino = crearSaludo('che')
const saludoMexicano = crearSaludo('guey')

saludoColombiano('Sacha') //Hola Sacha parcero
saludoArgentino('Sacha') //Hola Sacha che
saludoMexicano('Sacha') //Hola Sacha guey

increíble me exploto la cabeza con esta clase

Creo que entonces los objetos que se construyen con clases podrian considerarse closures.
Después de todo son instances de una función.

Muy buenos los tips.

        function crearSaludo(finalDeFrase) {
            return function(nombre) {
                console.log(`Hola ${nombre} ${finalDeFrase}`)
            }
        }


        const saludoArgentino = crearSaludo('che')
        const saludoMexicano = crearSaludo('guey')
        const saludoColombiano = crearSaludo('parce')

        saludoArgentino('Sacha')
        saludoMexicano('Esteban')
        saludoColombiano('Francisco')

Saludo colombiano Parcero

        function crearSaludo(finalDeFrase) {
            return function (nombre) {
                console.log(`Hola ${nombre} ${finalDeFrase}`)

            }
        }

    const saludoColombiano = crearSaludo('parce')
    const saludoMexicano = crearSaludo('we')
    const saludoArgentino = crearSaludo('cuantas copas tenés')

    saludoColombiano('David')
    saludoMexicano('David')
    saludoArgentino('Che')

Otro ejemplo de closures

function nombre(primerNombre) {
    var saludo = '¿cómo estas?'
    return function(apellido) {
        console.log(`Hola ${primerNombre} ${apellido}, ${saludo}`)
    }
}
//Primera manera de invocar la función
nombre('Juan')('Benitez')
//Hola Juan Benitez, Como estas?

//Segunda manera de invocar la funcion
const lastName = nombre('María')
lastName('Rivas')
//Hola Maria Rivas, Como estas?

Creo que aqui lo mas complejo de entender, es en que momento saludoAregentino, y las otras dos se convierten en funcion ya que pareciera no ser declarada como tal por ninguna parte del codigo, pero creo comprender que se pasa como variable y reemplaza a la funcion anonima que se retorna desde la funcion crearSaludo

Recomendaria para los que andan medio confindidos como yo que despues de replicar el codigo de Sasha verifiquen quien es saludoArgentino con y sin parametros desde la consola para que les grafique lo que esta pasando internamente

El VS no me reconoce los pesos $ del console.log… y nose como arreglarlo.

console.log(‘Hola ${nombre} ${finalDeFrase}’)

En Paraguay decimos leka

Se dice wey jajaja no guey

Esto es algún tipo de polimorfismo?

El saludo Mexicano se dice WEY!!! XD

var saludoColombia = “parce”

Bastante curioso este tema.

tampoco entendi ,me perdi ;
manan entindiquicchu

Saludos, específicamente cuando debería aplicarse?

solo para complementar buscando por youtube encontre que hay dos formas de usar estos closures aun q el tema es mas extenso pero al codigo de Sacha le podemos agregar una llamada mas de funcion :

        function crearSaludo(finalDeFrase) {
            //nos va a retornar otra funcion que recibe un nombre como parametro.
            //la primera genera otras funciones.
            return function (nombre) {
                console.log(`Hola ${nombre} ${finalDeFrase}`);
            }
        }

        const saludoArgentino = crearSaludo('che');
        const saludoMexicano = crearSaludo('guey');
        const saludoColombiano = crearSaludo('amigo');

        saludoArgentino('Sacha'); // va a decir hola sacha che.
        saludoMexicano('sacha'); // va a decir hola sacha guey.
        saludoColombiano('sacha'); //va a decir hola sacha amigo.

        crearSaludo('habla pe!!!')('Leonardo'); //va a decir hola Leonardo habla pe```

aquí les dejo otro aporte de closure y es muy sencillo para que lo entiendan…

const x = '⚡Javi'

function invócalo() {

const y = 'Romero⚡'

    console.log(`${x} ${y}`)
}

invócalo()

// copia y pega todo el código y veras el resultado.

Good los Closures.!!!

A, Ann Code no le gusta tu saludo colombiano 💔

const saludar = (finalFrase) => (nombre) => console.log("Hola " + nombre + ", " + finalFrase + “!”)

const saludoArgentino = saludar(“che”)
const saludoMexicano = saludar(“güey”)
const saludoColombiano = saludar(“parce”)

saludoArgentino(“Sasha”)
saludoMexicano(“Chavo”)
saludoColombiano(“Osmel”)

Cuando dice que cada una de las funciones está “recordando”, es porque lo guarda en sus Scopes

Lo que no sé es cuando utilizar estos clousures porque… no lo menciona =(

buenas clases

¿Qué es una función anónima?

¿Esto no seria el patron de diseño fabrica para lenguajes de prototipados?

Alguien sabe por qué invoca a saludoArgentino, Mexicano y Colombiano, pasando un parámetro?, ¿Acaso ellos no son mas que una constante y no así una función?
Gracias.

Esto es algo rarísimo wao, esto se puede hacer en otros lenguaje como java?

const saludoColombiano = crearSaludo('Hola cachón!')

Seria como polimorfismo de métodos ?

Closures, funciones que retornan otras funciones. 😃

// es una función que recuerda el estado de las variables al momento
// de ser invocada, y conserva este estado a través de reiteradas ejecuciones
        function saludar(saludo){
            return function (nombre){
                console.log(`Hola ${nombre} ${saludo}`)
            }
        }

        const saludoArgentino = saludar('che')
        const saludoMexicano = saludar('carnal')
        const saludoColombiano = saludar('parce')


        saludoArgentino('Fabio')
        saludoMexicano('Ancizar')
        saludoColombiano('Otoniel')

les comparto una práctica que realice utilizando sweetalert

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h2>JavaScript Closures</h2>
    <p>Saludando de forma casual o formal</p>
    <button type="button" onclick="saludoFormal()">Saludo formal</button>
    <button type="button" onclick="saludoCasual()">Saludo casual</button>    

    <script src ="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/2.1.2/sweetalert.min.js"></script>
    <script>

            function saludo(tipo){
                return function(nombre){
                    swal('¿Cuál es tu nombre?',{content: "input",})
                    .then((nombre)=>{swal(`Hola ${nombre} ${tipo}`) });
                }
            }
            const saludoFormal = saludo('es un gusto saludarle!')
            const saludoCasual = saludo('que tal?!')
         
    </script>
</body>
</html>

No entendía el porque se invocaba a la funcion saludoArgentino (o mexicano/colombiano) con un parámetro hasta que cambié la función anónima por una no anónima… luego así me quedó con Arrow function:

const saludar = (saludo) => (nombre) => console.log(`${saludo} ${nombre}`) // como uso arrow function no necesito escribir return
const saludarHola = saludar('Hola')
const saludarQueTal = saludar('Que tal')
saludarHola('Jorge') // 'Jorge' es el parámetro (nombre) requerido en la arrow function anónima que retorna saludar(saludo)
saludarQueTal('Jorge')

Un clousure permite acceder al ámbito de una función exterior desde una función interior, eso resula muy versatil

Los closures, son uno de los conceptos más importantes de JS. Entenderlos, hará que dominemos el lenguaje en un nivel más avanzado.

definitivamente he aprendido o entendido mejor leyendo los aportes de los compañeros que tratan de explicar de la mejor forma a los que tenemos duda

los closures tienen diferentes aplicaciones como por ejemplo, para el envío de e-mails y su contenido con templates usando funciones anónimas, por lo cual, también se encuentran en otros lenguajes de programación desde el lado del servidor

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>
    <script type="text/javascript">
      function crearSaludo(finalDeFrase){
        return function (nombre){
          console.log(`Hola ${nombre} ${finalDeFrase}`)
        }
      }

      const saludoArgentino = crearSaludo ('che')
      const saludoMexicano = crearSaludo ('Guey')
      const saludosColombiano = crearSaludo ('Parcero')

      saludoArgentino('Andres')
      saludoMexicano('Andres')
      saludosColombiano('Andres')
    </script>
  </body>
</html>

Pensé que iba a decir que el saludo colombiano era ‘Hola Sacha Perrito!’

function crearSaludo(finalDeFrase){
    return function(nombre){
        console.log(`Hola ${nombre} ${finalDeFrase}`)
    }
}

const saludoChapin = crearSaludo('Cerote xD')
const saludoColombiano = crearSaludo('Parce')
const saludoArgentino = crearSaludo('che')

saludoChapin('Jeferson')
saludoColombiano('Jeferson')
saludoArgentino('Jeferson')```

Gracias por el ejemplo.
Alguien tendrá alguna información adicional de la cual guiarse?

        function crearSaludo(finalDeFrase) {
            return function (nombre) {
                console.log(`Hola ${nombre} ${finalDeFrase}`)
            }

        }

        const saludoArgentino = crearSaludo('che')
        const saludoColombiano = crearSaludo('parce')
        const saludoPeruano = crearSaludo('causa')
        const saludoMexicano = crearSaludo('guey')

        saludoArgentino('George')
        saludoColombiano('George')
        saludoPeruano('George')
        saludoMexicano('George')```

Saludo Colombiano: Aja Mi llave…

Saludo dominicano, klk

//Closures

function crear_saludo(final_de_frase) {
    return function (nombre) {
        console.log(`hola ${nombre} ${final_de_frase}`)
    }
}

const saludoArgentino = crear_saludo('che')
const saludoMexicano = crear_saludo('wey')
const saludoColombiano= crear_saludo('parce')

saludoArgentino('Jose')
saludoMexicano('Jose')
saludoColombiano('Jose')```

No entiendo bien como la función reconoce su nombre como parametro si cuando lo introdujo lo pasó como parametro a la función crearSaludo y no a la función dentro de crearSaludo.
Supongo que tiene que ver con el scope de la variable, pero no entiendo porqué la función interna puede reconocer que ese parámetro es para ella.

tengo q trabajarlo un poco mas lo vi pero falta

Excelnte, cuando pienso en closures me acuerdo de los memes de Yo dawg

function crearSaludo(finalDeFrase){//creadora d e otras funciones
return function(nombre){//funcion anonima el cual recuerda el parametro finalDfrase
console.log(Hola ${nombre} ${finalDeFrase})
}
}
//otra forma
// const saludar = (saludo) => (nombre) =>
// console.log(${saludo} ${nombre})

Me costo, pero cuando lo entendi, se vuelve interesante su uso.

Buenas explicación, pero tengo que darle otra vuelta.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Closures</title>
</head>
<body>
    <script>
        
        function crearSaludo(finalDeFrase){
        return function(nombre){
        console.log(`Hola ${nombre}${finalDeFrase}`);
            }
        }

        const saludoArgentino = crearSaludo(' che');
        const saludoVenezolano = crearSaludo(' que lo que');

        console.log(saludoArgentino('Mery'));  
        console.log(saludoVenezolano('Mery'));

        //Un closure, básicamente, es una función que recuerda el estado de las variables al momento de ser invocada, 
        //y conserva este estado a través de reiteradas ejecuciones. 
        //Un aspecto fundamental de los closures es que son funciones que retornan otras funciones.
    </script>
</body>
</html>```

En Ecuador se dice pana.✌

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>closures_js</title>
</head>
<body>
    <script>

    function crearSaludo(finalDeFrase) {
    return function (nombre) {
        console.log(`Hola ${nombre} ${finalDeFrase}`)
    }
}

const saludoArgentino = crearSaludo(`che`)
const saludoMexicano = crearSaludo(`guey`)
const saludoColombiano = crearSaludo(`parce`)

saludoArgentino(`angie`)
saludoMexicano(`angie`)
saludoColombiano (`angie`)


    </script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>closures_js</title>
</head>
<body>
    <script>

    function crearSaludo(finalDeFrase) {
    return function (nombre) {
        console.log(`Hola ${nombre} ${finalDeFrase}`)
    }
}

const saludoArgentino = crearSaludo(`che`)
const saludoMexicano = crearSaludo(`guey`)
const saludoColombiano = crearSaludo(`parce`)

saludoArgentino(`angie`)
saludoMexicano(`angie`)
saludoColombiano (`angie`)


    </script>
</body>
</html>

Que interesante. Un poco enredado, pero no imposible de entender.

  <script>
    function crearSaludo(finalDeFrase) {
      return function (nombre) {
        console.log(`Hola ${nombre} ${finalDeFrase}`)
      }
    }
  
    const saludoArgentino = crearSaludo('che')
    const saludoMexicano = crearSaludo('guey')
    const saludoColombiano = crearSaludo('parce')
    const saludoPeruano = crearSaludo('causa')

    saludoArgentino('Fernando')
    saludoMexicano('Fernando')
    saludoColombiano('Fernando')
    saludoPeruano('Fernando')


  </script>```

Nice 😃

¿Por qué el parametro de la funciòn saludo argentino sirve como el parametro de la funciòn anonima ?

Saludos dominicano 🇩🇴 , klk!

Va mi ej:

function crearSaludo(finalDeFrase){
	return function(nombre)
	console.log(`Hola ${nombre} ${finalDeFrase}`)
}

const saludoArgentino 	= crearSaludo('che')
const saludoMexicano 	= crearSaludo('wey')
const saludoColombiano 	= crearSaludo('parce')

saludoArgentino('Sacha') //Hola Sacha che
saludoMexicano('Sacha') //Hola Sacha wey
saludoColombiano('Sacha') //Hola Sacha parce

quien me da un ejemplo mas claro gracias .

Excelente explicación de verdad

const REFERENCIA_DE_EDAD = 18

function EsMayorDeEdad(edad) {
  let Mensaje
  if(edad>=REFERENCIA_DE_EDAD){
      Mensaje = 'soy Mayor de edad'
  }else{
      Mensaje = 'no soy Mayor de edad'
  }

  return function (nombre) {
    console.log(`Hola me llamo ${nombre}, tengo ${edad} años, entonces, ${Mensaje}. `)
  }
}

const Fernando = EsMayorDeEdad(18)
Fernando('Fernando')

La función crearSaludo sería como una función para crear funciones de acuerdo a los distintos saludos, al guardar cada función en una constante hace que se “recuerde” el valor con el que fue creada.

function crearSaludo(finalDeFrase){
    return function(nombre){
        console.log(`${nombre} ${finalDeFrase}`)
    }
}

const saludoArgentino = crearSaludo('che');
const saludoMexicano = crearSaludo('guey');
const saludoColombiano = crearSaludo('amigo');

saludoArgentino('Jesus');
saludoMexicano ('Jesus');
saludoColombiano('Jesus')```