Mutable functions
Clase 46 de 99 • 30 días de JavaScript
Contenido del curso
Día 1
Día 2
Día 3
Día 4
Día 5 - Checkpoint
Día 6
Día 7
Día 8
Día 9
Día 10 - Checkpoint
Día 11
Día 12
Día 13
Día 14
Día 15 - Checkpoint
Día 16
Día 17
Día 18
Día 19
Día 20 - Checkpoint
Día 21
Día 22
Día 23
Día 24 - Checkpoint
Día 25
Día 26
Día 27
Día 28
Día 29
Día 30
Live Class
Las funciones mutables en JavaScript son aquellas que pueden modificar el estado de los objetos. En oposición a las funciones inmutables, que no pueden modificar el estado de los objetos y devuelven un nuevo objeto con los cambios.
Las funciones mutables son comúnmente utilizadas para manipular arrays y objetos. Algunos ejemplos de funciones mutables en JavaScript incluyen Array.prototype.push(), Array.prototype.pop(), Array.prototype.shift(), Array.prototype.unshift(), Array.prototype.splice() y Object.assign().
Es importante tener en cuenta que las funciones mutables pueden tener efectos secundarios, ya que modifican el estado de los objetos. Por lo tanto, es importante utilizarlas de manera consciente y tener cuidado al trabajar con ellas.
Por ejemplo, supongamos que tenemos un array llamado "numbers" que contiene los números 1, 2, 3 y 4. Si usamos la función mutable Array.prototype.push() para agregar un nuevo número al final del array, e estado del array "numbers" cambiará.
const numbers = [1, 2, 3, 4]; numbers.push(5); console.log(numbers); // Output: [1, 2, 3, 4, 5]
Como se puede ver en este ejemplo, el método push() ha modificado el estado del array "numbers" al agregar un nuevo número al final del array.
Por otro lado, si usamos una función inmutable como Array.prototype.concat() para agregar un nuevo número al array "numbers", el estado del array "numbers" no cambiará. En su lugar, se devolverá un nuevo array con los cambios.
const numbers = [1, 2, 3, 4]; const newNumbers = numbers.concat([5]); console.log(numbers); // Output: [1, 2, 3, 4] console.log(newNumbers); // Output: [1, 2, 3, 4, 5]
También se pueden usar mutable functions para modificar objetos de la misma manera:
const person = { name: 'John Doe', age: 30 }; function addProperty(object, key, value) { object[key] = value; } addProperty(person, 'address', '123 Main St'); console.log(person); // Output: { name: 'John Doe', age: 30, address: '123 Main St' }
En este ejemplo, la función addProperty modifica directamente el objeto person al agregar una propiedad "address" a él.
Además de modificar objetos y arrays individuales, también es posible usar mutable functions en combinación con bucles para modificar varios objetos y arrays al mismo tiempo. Aquí hay un ejemplo de cómo se puede hacer esto:
const numbers = [1, 2, 3, 4]; const people = [ { name: 'John Doe', age: 30 }, { name: 'Jane Doe', age: 25 }, { name: 'Jim Doe', age: 35 } ]; function addFive(array) { for (let i = 0; i < array.length; i++) { array[i] += 5; } } function addYear(array) { for (let i = 0; i < array.length; i++) { array[i].age++; } } addFive(numbers); addYear(people); console.log(numbers); // Output: [6, 7, 8, 9] console.log(people); // Output: [{ name: 'John Doe', age: 31 }, { name: 'Jane Doe', age: 26 }, { name: 'Jim Doe', age: 36 }]
Puedes profundizar en estos temas viendo el Curso de Manipulación de Arrays en JavaScript