Me encantan estos playgrounds, espero los incorporen en todos los cursos 😃
export function createPetList() {
const petList = [];
return function addPet(myPet) {
if (myPet) {
petList.push(myPet);
}
return petList;
}
}
Bienvenida
Bienvenida al Curso de Closures y Scope
Tipos de scope en JavaScript
Global Scope
Function Scope
Block Scope
Reasignación y redeclaración
Strict Mode
Closure
¿Qué es un Closure?
Playground: Crea un Closure para Sumar
Practicando Closures
Playground: Closure para Almacenar Datos de Mascotas
Hoisting
¿Qué es el Hoisting?
Debugging
Debugging
Cierre
Conclusiones
No tienes acceso a esta clase
¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera
Aportes 70
Preguntas 4
Me encantan estos playgrounds, espero los incorporen en todos los cursos 😃
export function createPetList() {
const petList = [];
return function addPet(myPet) {
if (myPet) {
petList.push(myPet);
}
return petList;
}
}
Si quieren probar en VSCode con el Code Runner, sin el console.log no devuelve nada, también hay que quitar el “export”. A mí este me salió bien a la primera, el playground anterior fue frustrante, ya voy entendiendo xD
function createPetList() {
// Tu código aquí 👈
const petList = [];
return function (newPet) {
if (newPet) {
petList.push(newPet);
}
return petList;
};
}
const myPetList = createPetList();
console.log(myPetList("michi"));
console.log(myPetList("firulais"));
console.log(myPetList());
Wow este sistema de Playground es incredible!
No pongan los resultados en los comentarios, si no no tiene sentido que pongan playgrounds… es lo mismo que hacer un spoiler 😦
Les comparto mi solución.
export function createPetList() {
const pets = []
return (info) => info ? pets.push(info): pets
}
Tuve que ver la clase como 4 veces pero creo que lo tengo:
s closures son una característica importante de JavaScript, y entender cómo funcionan es esencial para escribir código limpio y eficiente. Un closure es una función que se define dentro de otra función, y que tiene acceso a las variables y parámetros de la función externa. Además, el closure mantiene una referencia a los valores de estas variables, incluso después de que la función externa ha terminado de ejecutarse.
Veamos un ejemplo para entender mejor cómo funcionan los closures. Imagina que queremos escribir una función que multiplique un número por un factor, pero queremos definir el factor en una función externa:
function multiplicarPor(factor) {
return function(numero) {
return numero * factor;
}
}
var duplicar = multiplicarPor(2);
var triplicar = multiplicarPor(3);
console.log(duplicar(5)); // Output: 10
console.log(triplicar(5)); // Output: 15
En este ejemplo, la función multiplicarPor devuelve otra función que realiza la multiplicación. La función interna mantiene una referencia al valor de factor, que se define en la función externa. Cuando llamamos a multiplicarPor(2), se devuelve una función que multiplica el número por 2. Al llamar a multiplicarPor(3), se devuelve otra función que multiplica el número por 3. En ambos casos, se crea un closure que mantiene una referencia al valor de factor.
En resumen, los closures son útiles porque permiten crear funciones que mantienen una referencia a los valores de las variables y parámetros de la función externa, incluso después de que la función externa ha terminado de ejecutarse. Esto hace que las funciones sean más flexibles y reutilizables, y puede ayudar a evitar errores comunes en el código.
Esto si que es la educación del futuro!
Para resolver este desafío, se puede crear una función llamada “createPetList” que al ser llamada inicialmente crea una closure que almacena un array vacío. Cada vez que se llama a esta función con un parámetro, se agrega ese parámetro al array almacenado en la closure. Si se llama a la función sin pasarle ningún parámetro, entonces se retorna el array completo almacenado en la closure. A continuación se presenta un ejemplo de código en JavaScript para ilustrar cómo podría implementarse esta solución:
export function createPetList() {
let petList = [];
return function (pet) {
if (pet === undefined) {
return petList;
}
petList.push(pet);
}
}
Mi solucion
export function createPetList() {
let _mascotas = [];
return function guardarMascota(mascota) {
if (mascota) {
_mascotas.push(mascota);
}
return _mascotas;
};
}
Comparto mi solución
export function createPetList() {
let listaPerros = [];
function agregarPerros(a) {
if (!a) {
return listaPerros;
} else {
listaPerros.push(a);
}
}
return agregarPerros;
}
export function createPetList() {
const list = [];
return function addPet(myPet) {
if (myPet) {
list.push(myPet);
}
return list;
}
}
export function createPetList() {
let lista = [];
function mascotas(mascota) {
if (!mascota) {
return lista;
}
lista.push(mascota);
}
return mascotas;
}
function createPetList() {
const pets = [];
function addPet(pet) {
if (pet) {
pets.push(pet);
return pets
}
return pets
}
console.log(pets);
return addPet;
}
const myPetList = createPetList();
myPetList("michi");
myPetList("firulais");
myPetList();
va mi solucion para este playground
.
.
.
.
.
.
.
.
.
.
.
.
export function createPetList() {
// Tu código aquí 👈
let petList = [];
function addPet(pet) {
if (pet) {
petList.push(pet)
}
return petList;
}
return addPet;
}
¡¿Cómo van banda?!
Por acá mi solución por si les sirve 💪:
export function createPetList() {
const petList = [];
const savePet = (pet) => {
return !pet ? petList : petList.push(pet)
}
return savePet
}
Gracias por tu ♥.
Esta fue mi versión, fue mas como intentar emular lo aprendido en la clase anterior
export function createPetList() {
let array = []
function pet(myPet) {
if ((myPet === "") || (myPet === null) || (myPet === undefined)) {
return array
}else {
array.push(myPet)
}
}
return pet
}
Va mi código 😄
export function createPetList() {
const listaMascotas = [];
function misMascotas(nombreMascota) {
if (nombreMascota) {
listaMascotas.push(nombreMascota);
} else {
return listaMascotas;
}
}
return misMascotas;
}
habia agregado una validacion para el tipo de variable y funciono, con lo otros ejemplo me di cuenta que esa información no era relevante, no se para que la colocan si javascript no la requiere!!!
// Tu código aquí 👈
let listPets = [];
function operPets(namePet) {
if (namePet) {
listPets.push(namePet);
}
else { //Viene en blanco el parametro
return listPets;
}
}
return operPets;
function createPetList(){
const list = [];
function petList(pet) {
if (!pet) {
return list
} else {
return list.push(pet);
}
}
return petList;
}
.
.
.
.
.
.
.
.
.
.
.
.
.
export function createPetList() {
// Tu código aquí 👈
const petList = [];
return function addpets(pet){
if (pet) {
petList.push(pet);
} else {
return petList
}
}
}
Esta es mi soluciona al reto:
export function createPetList() {
let petList = [];
function addPet(newPet) {
if (newPet) {
petList.push(newPet);
}
else {
return petList
}
}
return addPet
}
export function createPetList() {
// Tu código aquí 👈
const petList = [];
function processPetData(petData) {
if (petData) {
petList.push(petData);
}
return petList;
}
return processPetData;
}
borre el export y siempre me salia error que tortura.
export function createPetList() {
// Tu código aquí 👈
let mascotas = [];
function myPetAc(insertPet) {
if (insertPet) {
mascotas.push(insertPet);
} else {
return mascotas;
}
console.log( mascotas);
}
return myPetAc;
}
Mi solución:
function createPetList() {
const pets = []
const addPets = (pet) => {
if (!pet) {
return pets
} else {
pets.push(pet)
}
}
return addPets
}
Mi solución al reto
export function createPetList() {
const petList = [];
function myPetList(pet) {
if (!pet) {
return petList;
} else {
petList.push(pet);
}
}
return myPetList;
}
Mi solución
export function createPetList() {
let list = [];
return function adding(pet) {
if (pet) {
list.push(pet);
} else {
return list,
}
}
}
Les comparto mi solucion, al parecer el desafio requiera que se retorne la lista si no se introducen datos el parametro.
export function createPetList() {
// Tu código aquí 👈
let petList = []
function addPet(pet) {
if (pet !== undefined) {
petList.push(pet)
} else {
return petList
}
}
return addPet;
}
const myPetList = createPetList();
myPetList("michi");
myPetList("firulais");
Mi solucion:
export function createPetList() {
const petList = [];
function addPet(NewPet) {
if (NewPet) {
petList.push(NewPet);
}
return petList;
}
return addPet;
}
**Mi solución **
export function createPetList() {
let petList = [];
function addPetToList(name = '') {
if (name == '') {return petList;}
petList.push(name);
}
return addPetToList;
}
function createPetList() {
let pets = [];
function addPet(pet) {
if (pet) {
pets.push(pet);
} else {
return pets;
}
}
return addPet;
}
const myPetList = createPetList();
Creamos una función que devuelve un closure. La variable pets
se inicializa con un array vacío
y se devuelve una función que tiene acceso a esta variable mediante un closure. La función interna addPet
comprueba si se le ha pasado un argumento, si es así, lo añade al array de pets
. Si no se pasa ningún argumento, devuelve la lista
completa de mascotas.
Aquí va mi solución al playground utilizando closures:
export function createPetList() {
// Tu código aquí 👈
let list = [];
const addPet = (pet) => {
pet ? list.push(pet) : ''
console.log(list);
return list;
}
return addPet;
}
const myPetList = createPetList();
myPetList("michi");
myPetList("firulais");
Gracias profesor Oscar Barajas
Código al mínimo.
export const createPetList = () => {
const petList = []
return (pet) => {
pet && petList.push(pet)
return petList
}
}
Aún tengo dudas 😦
mi playgrounds
export function createPetList() {
let list = []
return (pet = "") => {
if (pet == "") return list
list.push(pet)
}
}
export function createPetList() {
// Tu código aquí 👈
const petList = []
return function (newPet) {
if (newPet) {
petList.push(newPet)
} else {
return petList
}
}
}
That one
export function createPetList() {
const pets = [];
return function addPets(newPet = "") {
if (newPet == "") {
return pets;
} else {
pets.push(newPet)
}
}
}
export function createPetList() {
let pets = [];
let pet;
function addPets(pet) {
if (pet){
return pets.push(pet);
}
else {
return pets;
}
}
return addPets;
}
function createPetList() {
const petList = [];
function petListCreate(nuevo) {
if (nuevo!=undefined){
petList.push(nuevo);
}else{
console.log(petList);
}
}
return petListCreate;
}
const myPetList = createPetList();
myPetList("michi");
myPetList("firulais");
myPetList();
viendo los comentarios me di cuenta que no era necesario especificar !=undefined ya que el solo parámetro daría falso si no se ingresa
Pues… cómo que me confundí un poco con las instrucciones pero bueno, al final de cuentas sí pasó las pruebas:
export function createPetList() {
const lista = [];
function addData(value) {
value ? lista.push(value) : null;
if (value) {
return;
} else {
return lista;
}
}
return addData;
}
Mi solucion a este Playground:
export function createPetList() {
// Tu código aquí 👈
let petList = [];
return function addPet(pet) {
if (pet) {
petList.push(pet);
}
return petList;
}
}
function createPetList() {
let petList = [];
function saveDataPets(myPet) {
petList.push(myPet)
if(petList[petList.length -1] === undefined) petList.pop()
return petList
}
return saveDataPets;
}
const myPetList = createPetList()
Al solucionar el ejercicio me encontre despues de unos minutos que estaba fallando en la comparación del ciclo if, tratando de asegurarme que el parametro string no estuviera vacio. ❌
Con el simple hecho de colocal la variable ‘pet’ para su evaluación, logre resolverlo. 🤘🏻💛
export function createPetList() {
// Tu código aquí 👈
const petArr = [];
function addPet(pet) {
if (pet) {
petArr.push(pet);
} else {
return petArr;
}
}
return addPet;
}
const myPetList = createPetList;
myPetList('michi');
myPetList('firulais');
myPetList('pajaro');
myPetList();
<function createPetList() {
let myPetList = []
function namePet(namePet) {
if (namePet) {
myPetList.push(namePet)
} else {
console.log(myPetList)
}
}
return namePet
}
const myPetList = createPetList();
myPetList("michi");myPetList("firulais");
myPetList();
export function createPetList() {
const listedData = [];
return function addPets(petData) {
if (petData) {
listedData.push(petData)
} else {
return listedData;
}
}
}
export function createPetList() {
const pets = [];
return function addPet(pet) {
if (pet) {
pets.push(pet)
} else {
return pets;
}
}
}
MI codigo mas pequeño. utilizando arrow functions y operador ternario
export function createPetList() {
// Tu código aquí 👈
let myList = []
return (animal) => animal ? myList.push(animal) : myList
}
Mi Solucion 😎
function createPetList() {
// Tu código aquí 👈
let myPets = [];
return (myPet) => (myPet) ? myPets.push(myPet) : myPets
}
Dios javascript es demasiado cool o yo soy demasiado cool? XD
export function createPetList() {
const petList = []
return (pet) => pet ? petList.push(pet) : petList
}
ez
export function createPetList() {
let mascotas = [];
return function agregarMascotas(mascota) {
if (mascota) {
mascotas.push(mascota);
} else {
return mascotas;
}
}
}
Mi aporte, por fin comprendí los closures, me siento contento.
export function createPetList() {
let petArray = [];
function getPet(pet) {
const operation = pet != undefined ? petArray.push(pet) : console.log(petArray);
return petArray;
}
return getPet;
}
Acá le dejo mi solución al reto.
export function createPetList() {
let animalsList = [];
return function newAnimals(animals) {
if (typeof animals === "string" || typeof animals === "object" || typeof animals === "array") {
return animalsList.push(animals);
} else {
return animalsList;
}
}
}
Dejo la solucion:
function createPetList() {
const elements = [];
return function savePetList(item = null) {
if (item) {
elements.push(item);
return 'Elemento agregado con exito';
} else {
return elements;
}
}
}
const pets = createPetList();
console.log(pets('perro'));
console.log(pets('gato
Les comparto mi solución
function createPetList() {
let existentPet = [];
return function newPetList(pet){
if(!existentPet || !!pet){
existentPet.push(pet);
}else{
console.log(existentPet)
}
return existentPet;
}
}
const kevPet = createPetList();
kevPet("Cat");
kevPet("Dog");
kevPet();
export function createPetList() {
const list = []
return function (item) {
if (!item) return list
list.push(item)
}
}
Mi solución con Arrow Funtion:
Codigo
function createPetList() {
let petList = []
function accumPets(pet=null) {
if (!pet){
return petList
}
petList.push(pet)
}
return accumPets
}
export function createPetList() {
let arrayPetList = [];
function addPetList(animals) {
if (!animals) {
return arrayPetList;
}
arrayPetList.push(animals);
}
return addPetList;
}
export function createPetList() {
const petList = [];
return function addPet(myPet) {
return myPet ? petList.push(myPet) : petList;
}
}
function createPetList() {
let petList = [];
function addPets(pets) {
petList.push(pets);
console.log(petList);
}
return addPets;
}
const myPetList = createPetList();
myPetList(“Michi”);
myPetList(“Firulais”);
Pequeño momento de satisfaccion!
Abajo como lo resolvi, con dos alternativas:
Alt 1:
export function createPetList() {
let petList = [];
return (obj) => obj ? petList.push(obj) : petList;
}
Alt 2
function createPetList() {
let petList = [];
return function addElement(obj) {
if (!obj) {
return petList;
}
return petList.push(obj);
}
}
export function createPetList() {
let saveNamePet = [];
function addNamePet(name) {
saveNamePet.push(name);
console.log(`Las Mascotas que hay son: ${saveNamePet}`)
}
return addNamePet();
}
const myPetList = createPetList();
myPetList("michi");
myPetList("firulais");
myPetList();
Este ejercicio si me costo un poco, pero con un poco de practica y analisis se logro
Mi solucion:
export function createPetList() {
const mascotas = []
return function agregarMascota(mascota) {
let item = mascota
return item ? mascotas.push(item) : mascotas
}
}
Aqui esta mi solucion de la prueba:
export function createPetList() {
// Tu código aquí 👈
const myList = [];
return function addPets(infoPets) {
if (infoPets) {
myList.push(infoPets);
return;
}
return myList;
}
}
Esta fue mi solución
function createPetList() {
let petList = [];
function addPet(myPet) {
if (myPet) {
petList.push(myPet);
console.log( petList)
}
}
return addPet
}
const myPetList = createPetList();
myPetList("michi");
myPetList("firulais");
myPetList();
myPetList("Dinosaurio");
export function createPetList() {
// Tu código aquí
let listData = [];
function adddata(datamascota) {
if (datamascota) {
listData.push(datamascota)
}
return listData
}
return adddata
}
Mi solución:
export function createPetList() {
let list = [];
return function internal(item) {
if (!item) {
return list;
}
list.push(item);
}
}
Me corre bien pasando objetos, array, o no pasando parámetros, pero el compilador no me lo acepta.
 {
// Tu código aquí 👈
let lista = [];
return function guardar(nombre) {
if (nombre) {
lista.push(nombre);
return lista;
}
return lista;
}
}
¿Quieres ver más aportes, preguntas y respuestas de la comunidad?
o inicia sesión.