¡Te damos la bienvenida a este reto!

1

¡Bienvenido al mundo de JavaScript!

Día 1

2

Variables, funciones y sintaxis básica

3

Tipos de datos

4

Playground - Retorna el tipo

5

Tipos de datos - pt 2

Día 2

6

Operadores

7

Hoisting y coerción

8

Playground - Calcula la propina

9

Alcance de las variables

Día 3

10

Condicionales

11

Playground - Calcula años bisiestos

12

Switch

13

Playground - Obten información de mascotas según su tipo

14

Ciclos

15

Playground - Dibuja un triangulo

Día 4

16

Arrays

17

Playground - Encuentra al michi mas famoso

18

Objetos

19

Playground - Obten el promedio de los estudiantes

Día 5 - Checkpoint

20

Playground - encuentra el palindromo más grande

Día 6

21

Reasignación y redeclaración

22

Modo estricto

Día 7

23

Debugging y manejo de errores

24

Programación funcional

Quiz: Día 7

Día 8

25

Closures

26

Playground - Crea una calculadora con closures

27

Higher order functions

28

Playground - Crea tu propio método map

Día 9

29

ECMAScript

30

TC39

Quiz: Día 9

Día 10 - Checkpoint

31

ES6

32

ES7

33

Playground - Task planner

Día 11

34

Asincronismo

35

Playground - Promesas

36

Manejando el asincronismo

37

Playground - Resuelve el callback hell usando promesas

38

Playground - Resuelve el callback hell usando async/await

Día 12

39

Arrays a profundidad

40

Métodos de arrays: Every, Find y findIndex

41

Playground - Válida el formulario

Día 13

42

Métodos de arrays: Includes, Join y concat

43

Playground - agrupa los productos

44

Métodos de arrays: Flat y FlatMap

45

Playground - Encuentra la ubicación del valor buscado

Día 14

46

Mutable functions

47

Playground - Modifica una lista de compras

48

Métodos de arrays: sort

49

Playground - Ordena los productos

Día 15 - Checkpoint

50

Playground - Sistema de reservaciones de un hotel

Día 16

51

Programación orientada a objetos en JavaScript

52

Objetos literales

53

Playground - Congela el objeto recursivamente

Día 17

54

Prototipos en JavaScript

55

Playground - Modifica el prototype de los arrays

56

Playground - Crea un auto usando clases

Día 18

57

Abstracción en JavaScript

58

Playground - Sistema de carrito de compras

59

Encapsulamiento en JavaScript

60

Playground - Encapsula datos de los usuarios

Día 19

61

Herencia en JavaScript

62

Playground - Jerarquía de animales

63

Polimorfismo en JavaScript

64

Playground - Sistema de pagos

Día 20 - Checkpoint

65

Playground - Agenda de vuelos

Día 21

66

Patrones de diseño

67

Sinlgeton y Factory pattern en JavaScript

68

Playground - Implementa singleton en un chat

Día 22

69

Adapter y Decorator pattern en JavaScript

70

Playground - Personaliza productos de una tienda

71

Builder y Protype pattern en JavaScript

72

Playground - Mejora el código usando builder pattern

Día 23

73

Facade y proxy pattern en JavaScript

74

Playground - Proxy en servicio de mensajería

75

Chain of responsability y Observer pattern en JavaScript

76

Playground - Implementación de Observador en Newsletter

Día 24 - Checkpoint

77

Playground - Crea un task manager con patrones de diseño

Día 25

78

Estructuras de datos en JavaScript

79

Playground - Crea tu propia implementación de un array

80

Hash tables en JavaScript

81

Playground - Implementación de una HashTable para Contactos

Día 26

82

Set en JavaScript

83

Playground - Remueve duplicados de una lista

84

Maps en JavaScript

85

Playground - Crea un organizador de tareas

Día 27

86

Singly Linked List en JavaScript

87

Playground - Agrega métodos a la singly linked list

88

Playground - Implementación de una singly linked list

Día 28

89

Stacks en JavaScript

90

Playground - Crea un stack para una playlist

Día 29

91

Queues en JavaScript

92

Playground - Crea una cola de emails

Día 30

93

¡Lo lograste!

Live Class

94

30 días de JS con Juan DC

95

30 días de JS con Nicobytes

96

30 días de JS con GNDX

97

30 días de JS con LeoCode

98

30 días de JS con Teffcode

99

Sesión: Cierre de los 30 días de JavaScript

No tienes acceso a esta clase

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

Playground - Modifica el prototype de los arrays

55/99

Aportes 46

Preguntas 0

Ordenar por:

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

Solución… 😄
.
Para el reto agregamos el nuevo método myFilter al prototype del Array, creando una función con un callback pasado como parámetro.
.
Algo interesante es que no se puede crear usando una función flecha como: (callback) => { // etc }. Porque más adelante la palabra clave this en una arrow function hace referencia al contexto en el que se definió la función, en lugar de al objeto Array al que se está aplicando el método.
.
Creamos un array filtrado vacío. Recorremos el Array comparando sus elementos con el callback y si cumple lo añadimos al array filtrado.
.
Retornamos el array filtrado.
.

export function arrayModified() {
  Array.prototype.myFilter = function (callback) {
    let filtered = [];
    for (let i = 0; i < this.length; i++) {
      if (callback(this[i])) {
        filtered.push(this[i]);
      }
    }
    return filtered;
  };
}
export function arrayModified() {
  // Tu código aquí 👈
  Array.prototype.myFilter = function (callback) {

    const output = []

    for (const x of this) 
      if (callback(x) === true) output.push(x)    

    return output

  }

}

🛡️Escudo anti-spoilers🛡️

Mi codigo:

export function arrayModified() {
  Array.prototype.myFilter = function (func) {
    const res = []
    for (const element of this) {
      if (func(element))
        res.push(element)
    }
    return res
  }
}

falle muchisimo 😥

export function arrayModified() {
  Array.prototype.myFilter = function (callback) {
    let newArray = [];
    for (let i = 0; i < this.length; i++) {
      if (callback(this[i])) {
        newArray[newArray.length] = this[i]
      }
    }
    return newArray;
  };
}

Mi solcución:

export function arrayModified() {
  Array.prototype.myFilter = function (funcion) {
    let arrayMap = [];
    for (let prop of this) {
      funcion(prop) ? arrayMap.push(prop) : prop;
    }
    return arrayMap;
  }
}

Hay un pequeño bug al hacer la prueba, si la haces mas de una vez te toma como si estuvieras usando métodos de Arrays para hacer el desafio. Supongo que es gracias a que el emulador de las pruebas agrega tu método y si lo vuelves a intentar ya lo toma como un método que venia.

Así que cada vez que vayan a hacer una nueva prueba, guarden su codigo, recarguen la pagina y vuelvanlo a intentar.


.
.
.
.
.
.

export function arrayModified() {
    Array.prototype.myFilter = function (callback) {
      const filteredArray = [];
      for (let i of this) {
        if (callback(i)) {
          filteredArray.push(i);
        }
      }
      return filteredArray;
    }
}

Con pocas lineas de código se puede resolver este Challenge, solo hay que pensar un poquito mas

comparto mi solucion pero se me dificulto mucho por el uso de this y ademas no podia probar en consola sin instanciar la funcion arrayModified, ya que directamente no funciona.

export function arrayModified() {
 
  Array.prototype.myFilter = function (fun) {
    let rta = [];
    for (let index = 0; index < this.length; index++) {
      const element = this[index];
      if (fun(element)) {
        rta.push(element);
      }
    }
    return rta;
  }
}

Esta es la implementación interna de lo que probablemente hace el método de los arrays filter.
Interesante ejercicio el poder agregar un método nuevo a los prototypes.

export function arrayModified() {

  Array.prototype.myFilter = function (func) {
    let newArray = [];
    this.forEach((element) => {
      if (func(element)) {
        newArray.push(element);
      }
    });
    return newArray;
  };
}

Solución con una comprobación extra por si no pasan una función. No es que no confíe en @LeoCode0 jejeje

.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

export function arrayModified() {
  Array.prototype.myFilter = function (callback) {
    if (typeof callback !== 'function') {
      throw new TypeError('El argumento proporcionado no es una función');
    }

    const newArray = [];
	// Evita calcular en cada bucle
    const length = this.length;

    for (let i = 0; i < length; i++) {
      if (i in this) {
        const element = this[i];
// Se agregan argumentos para mejorar el contexto en caso de ser necesario o si se requiere utilizarlos.
        if (callback(element, i, this)) {
          newArray.push(element);
        }
      }
    }

    return newArray;
  };
}

Solución al desafio 😄 :

🛡️🛡️🛡️Escudo anti spoilers🛡️🛡️🛡️

Modifica el prototype de los arrays

export function arrayModified() {
  // Tu código aquí 👈
  function myFilter(callback) {
    const filterArray = [];
    for (let elem of this) {
      if (callback(elem)) {
        filterArray.push(elem);
      }
    }
    return filterArray;
  }
  Array.prototype.myFilter = myFilter;
}

Aquí mi solución, traté de implementarla de la misma manera que indica la documentación del método Filter, lo que no he sabido implementar es el argumento opcional “thisArg”.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

export function arrayModified() {
  // Tu código aquí 👈
  Array.prototype.myFilter = function (callback) {
    const filteredArray = [];
    for (let i = 0; i < this.length; i ++){
      const result = callback(this[i], i, this);
      if (result) filteredArray.push(this[i]);
    }
    return filteredArray;
  }
}
export function arrayModified() {
  Array.prototype.myFilter = function (callback) {
    const filteredArr = [];
    for (let i = 0; i < this.length; i++) {
      if (callback(this[i], i, this)) {
        filteredArr.push(this[i]);
      }
    }
    return filteredArr;
  }
}

Mi solución 💚

.
.
.

export function arrayModified() {
  Array.prototype.myFilter = function(func){
    let filtered = []
    for(const elem of this){
      if (func(elem)) 
        filtered.push(elem)
      
    }
    return filtered
  }
}

Mi aporte:
|
|
|
|
|
|
|
|

export function arrayModified() {
  // Tu código aquí 👈
  Array.prototype.myFilter = function (theFunction) {
    let resultArray = [];
    let position = 0;
    for (let i = 0; i < this.length; i++) {
      if (theFunction(this[i])) {
        resultArray[position] = this[i];
        position++;
      }
    }
    return resultArray;
  };
}

Hola.












export function arrayModified() {
  Array.prototype.myFilter = function (callbackFn) {
    const arrayFilter = [];

    this.forEach((element) => {
      if (callbackFn(element)) {
        arrayFilter.push(element);
      }
    });

    return arrayFilter;
  };
}

No corren las pruebas, sera que el simulador esta roto???

export function arrayModified() {
  Array.prototype.myFilter = function (validate) {
    const newArray = [];

    for (let i = 0; i < this.length; i++) {
      if (validate(this[i], i, this)) {
        newArray.push(this[i]);
      }
    }

    return newArray;
  };
}

Esta fue mi solución sin usar mi amigo el método push 😄:
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

export function arrayModified() {
  Array.prototype.myFilter = function(filterFunction){
    const newArray =[];
    for (let i=0; i<this.length;i++){
        if(filterFunction(this[i])){
            newArray[newArray.length]= this[i];
        }
    }
    return newArray;
  }
}

🛡️🛡️Escudo anti-spoilers🛡️🛡️

Mi solución al reto, un clon de filter …

export function arrayModified() {
  Array.prototype.myFilter = function (cb) {
    let res = [];
    for (let e=0; e < this.length; e++){
      if(cb(this[e])){
        res.push(this[e])
      } 
    }
    return res 
  }
}

Interesante, ChatGPT es el companion perfecto para programar, siempre que luego revises el codigo claro, menudo ahorro de tiempo … y se me ocurre algo para que de verdad se refactorice en este mundo del desarrollo xD
,
,
,
,
,
,
,
,
,
,
,
,

export function arrayModified() {
  Array.prototype.myFilter = function (callback) {
    const result = [];

    for (let i = 0; i < this.length; i++) {
      if (callback(this[i], i, this)) {
        result.push(this[i]);
      }
    }

    return result;
  };
}

My solution

.
.
.

export function arrayModified() {
  Array.prototype.myFilter = function (callback) {
    let res = []
    for (let i = 0; i < this.length; i++) {
      const isFilter = callback(this[i], i, this)
      if (isFilter) res = [...res, this[i]]
    }
    return res
  }
}

Hola, no acostumbro a publicar mi solución, pero esta vez me doy cuenta de que solo una de las soluciones publicadas hasta este momento cumplió realmente con el reto por ser el único que no uso un método de array como lo exige el último test.

Excelente al compañero Frandell Corporan.

Aquí les dejo mi solución:
*
**




export function arrayModified() {
    Array.prototype.myFilter = function (callback) {
        const arr = [];
        let i = 0;
        for (let elem of this) {
            if (callback(elem)) {
                arr[i] = (elem);
                i++;
            }
        }
        return arr;
    }
}

Antes de dar mi solución debo mendionar que en el ejemplo 2 se crea una constante arr y luego se llama a array.myFilter. Me parece que hay un error porque deben tener el mismo nombre.
.
.
.
.
.
.
.
.

Array.prototype.myFilter = function(callback) {
  const result = [];
  this.forEach((item, index, array) => {
    if (callback(item, index, array)) {
      result.push(item);
    }
  });
  return result;
}

const array = [1,2,3,4,5,6];

const result = array.myFilter(num => num % 2 === 0);

console.log(result); // [2,4,6]

const arr = [
  {
    name: "Juan",
    age: 10,
  },
  {
    name: "Pedro",
    age: 20,
  },
  {
    name: "Maria",
    age: 30,
  },
];

const result = arr.myFilter((person) => person.age > 18);

console.log(result);
// Output: [
//   {
//     name: "Pedro",
//     age: 20,
//   },
//   {
//     name: "Maria",
//     age: 30,
//   },
// ]

Aquí mi solución:
.
.
.
.
.
.
.
.
.
.
.

export function arrayModified() {
  //agrego funcion muFilter al prototype Array
  Array.prototype.myFilter = function (func) { 
    //declaro un array para retorna
    let arrayreturn = [];
    for (let item of this) {
      //valida cada item del aaray con la funcion recibida en func
      if (func(item)) {
        //arrego item al array a retornar
        arrayreturn.push(item);
      }
    }
    //retorno el array con los item filtrados
    return arrayreturn;
  }  
}

Listo, otro mas y sigo atrás
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

export function arrayModified() {
  // Tu código aquí 👈
  Array.prototype.myFilter = function(callback) {
    const output = [];
    for (let data of this)
      if (callback(data))
        output.push(data);
    return output;
  }
}
 

Dada todas las respuestas que los compañeros ya están compatiendo mi comentario será respecto a las dificultades que presente en este ejercicio.
.
Utilizando la estructura for (... of ...) no supe utilizarla a la primera. Me frustré y empecé a ver los spoilers, cosa que ya perdono que haga porque lo que me importa es entender las soluciones para integrarlas en mi razonamiento.
.
Me faltaba declarar la variable for ( let .. of ... ) y lo que tuve que hacer fue aplicar el patito de goma y volver a describir mi razonamiento con este nuevo detalle que no me había percatado por mi inexperiencia. Mi solución funcionó.
.
También entendí que tenemos que empujar el item que estamos evaluando no el resultado de la funcion aplicada en el item.

mi versión:

// como la formula es un paramettro de una funcion,
// se crea un funcion que se ejecute para cada elemento
Array.prototype.myFilter = function (para1) {
  let arrayResult = [];

  for (let element of this) {
    if (para1(element)) {
      arrayResult.push(element);
    }
  }
  return arrayResult;
}; 

Mi solucion:
.
.
.

.
.
.
.
.

.
.
.
.
.
.

.
.

export function arrayModified() {
  Array.prototype.myFilter = function(callback) {
    let filtered = []

    for (let item of this) {
      if (callback(item)) {
        filtered.push(item)
      }
    }
    return filtered
  }
}

the sol:

export function arrayModified() {
  Array.prototype.myFilter = function (fn) {
    const retArray = [];
    for (const item of this) {
      if (fn(item)) {
        retArray.push(item);
      }
    }
    return retArray;
  }
}

**Mi solución **
.
.
.
.
.
.
.

export function arrayModified() {
  Array.prototype.myFilter = function (func) {
    let results = [];
    for (let elem of this) {
      if (func(elem)) {
        results.push(elem);
      }
    }
    return results;
  }
}

Mi solución:

export function arrayModified() {
  Array.prototype.myFilter = function (filter) {
    const array = []
    for (let element of this) {
      if (filter(element)) { array.push(element) }
    }
    return array
  }
}

MI SOLUCION 💪
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

export function arrayModified() {
  Array.prototype.myFilter = function (callback) {
    let arrayFiltered = [];
    this.forEach( value => {
      if (callback(value)) {
        arrayFiltered.push(value);
      }
  });
    return arrayFiltered;
  };
}

Dejo mi solución:
.
.
.
.
.
.
.
.
.
.

Son dos soluciones: una sin usar filter y la otra usando filter que está comentada.

export function arrayModified() {
  //Tu código aquí 👈
  Array.prototype.myFilter = function (callback) {
    const arr = [];
    for (const element of this) {
      if (callback(element)) {
        arr.push(element);
      }
    }
    return arr;
  }
  // Array.prototype.myFilter = function (callback) {
  //   return this.filter(callback);
  // }
}

Hola, dejo mi solucion
Caminito anti spoilers
🛴✨
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
Llegamos 📍

export function arrayModified() {
  // Tu código aquí 👈
  Array.prototype.myFilter = function (condition) {
    const newArray = [];
    this.forEach(element => condition(element) ? newArray.push(element) : null);
    return newArray
  }
}

Dejo mi solución, por si alguien necesita guiarse un poco:

Array.prototype.myFilter = function (newFunction){
  const arrayFilter=[];
  for(let element of this){
    if(newFunction(element)==true){
      arrayFilter.push(element); 
    }
    
  }
  return arrayFilter;
}

Aquí mi solución:

function arrayModified() {
    Array.prototype.myFilter = function myFilter (func) {
        return this.filter(func);
    }
}

Mi solución. Siempre me ha parecido raro trabajar con callbacks pero cada vez los logro entender un poco más
.
.
.
.
.
.
.
.
.
.

export function arrayModified() {
  Array.prototype.myFilter = function (callback) {
    const filteredArr = []
    for (let i = 0; i < this.length; i++) {
      if (callback(this[i]))
        filteredArr.push(this[i])
    }
    return filteredArr
  }
}

míralo bajo tu propio riesgo, dejé unas notas de las dificultades que tuve al realizarlo, espero sean útiles.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

  1. como acceder al arreglo de la función, ya se que es con this
  2. porque no usar arrow function en “Array.prototype.myFilter = function (expresion) {…}” “this” en arrow functions representa el léxico o ámbito en el que se define la función… o sea undefined…
    este último me voló la cabeza ya que yo usaba arrow function y a pesar de que la lógica estaba bien, no me daba lo que esperaba. [no es lo mismo usar funciones regulares que arrow functions]
 
  Array.prototype.myFilter = function (expresion) {
    let new_arr = [];
    for (let element of this) {
      if (expresion(element)) {
        new_arr.push(element);
      }
    }
    return new_arr;
  }

Viendo las respuestas de los compañeros creo que hice trampa… xD

antispoilers.
.
.
.
.
.
.

.

.export function arrayModified() {
    Array.prototype.myFilter = function (metodo) { return this.filter(metodo)};
  }

Solución, con respectivo anti-spoilter…
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.

export function arrayModified() {
  // Tu código aquí 👈
  Array.prototype.myFilter = function(callback) {
    const filteredElements = [];
    this.map(element => {
      if (callback(element)) { 
        filteredElements.push(element);
      }
    });
    return filteredElements;
  };
}

Algo a tener en cuenta es que cometí un error al asignar el valor del prototipo. Lo estaba creando con un arrow function y eso cambia el ámbito de la referencia this. De lo contrario podría queda de una forma más conscisa:

Array.prototype.myFilter = (callback) => { ... }

Solución

export function arrayModified() {
  // Tu código aquí 👈
  function arraysFiltering(callback) {
    const filterArray = [];
    for (let elem of this) {
      if (callback(elem))
        filterArray.push(elem);
    }
    return filterArray;
  }
  Array.prototype.myFilter = arraysFiltering
}

Resolución al problema n.n:

.
.
.
.
.
.
.
.
.
.

Al inicio me costo entender como acceder a los valores del array pero me habia olvidado que el this hace referencia directamente a estos y no es necesario acceder a un this.values jaja.

export function arrayModified() {
  // Creamos la función que hará el filtrado
  function myFilter(callback) {
    const copyArray = [];
    for (let item of this) {
      if (callback(item)) copyArray.push(item)
    }
    return copyArray
  }

  // Modificamos el prototipo
  Array.prototype.myFilter = myFilter
}
export function arrayModified() {
  Array.prototype.myFilter = function (callback){
    let arr = [];
    for (let i = 0; i < this.length; i++)if (callback(this[i])) arr.push(this[i]);    
    return arr;
  }  
}

undefined