Estoy tratando de refactorizar un código y quería usar la desestructuración para que el código sea un poco más fácil de leer. Estoy pasando un objeto a la función remove(), sin embargo, una de las variables regresa:
A 'inStock' se le asigna un valor pero nunca se usa no-unused-vars
Según los documentos de eslint:
'Una lectura para una modificación de sí misma no se considera utilizada.' https://eslint.org/docs/rules/no-unused-vars
Me preguntaba si hay una manera de resolver este problema sin:
Gracias por adelantado
antes de refactorizar:
remove(product) { if (product.quantity > 0) { product.quantity --; product.inStock ++; } }después de refactorizar:
remove({ quantity, inStock }) { if (quantity > 0) { quantity --; inStock ++; } } Su refactorización se basa en el malentendido de que quantity-- e inStock++ tiene el mismo comportamiento que product.quantity-- y product.inStock++ . El núcleo de este malentendido es pensar que los campos desestructurados todavía se refieren a los campos del objeto. Echemos un vistazo a lo que realmente es la desestructuración.
Tome este ejemplo, con desestructuración:
const obj = { foo: 0 }; const { foo } = obj;Sin desestructurar, se vería así:
const obj = { foo: 0 }; const foo = obj.foo;La sintaxis de desestructuración es solo un atajo del segundo ejemplo.
Lo que esto ilustra es que la desestructuración define una nueva variable y asigna el valor (no la referencia) del campo que está desestructurando a esa variable. Cuando realice mutaciones en esa variable, solo mutará el valor de la variable pero no el valor del campo del objeto. Aquí hay un ejemplo ejecutable, verá que obj.foo no ha cambiado de 0 , aunque incrementamos foo que se ha desestructurado de obj :
const obj = { foo: 0 }; var { foo } = obj; foo++; console.log(obj); // { "foo": 0 }Volviendo a su error de linting: el linter es correcto, no solo plantea el hecho de que la variable no se usa, sino que revela este problema que he explicado.
Hay dos soluciones inmediatas que se me ocurren:
No desestructurar. Con su ejemplo, si bien la desestructuración reduce la cantidad de código que hay, podría generar confusión en cuanto a lo que está mutado y hacer que el código sea menos comprensible: lo ha experimentado usted mismo.
Vuelva a asignar el valor incrementado/decrementado a su objeto. Deberá anteponer el operador al operando porque esto devuelve el valor después de la operación. Postfixing devuelve el valor antes de la operación (también conocido como el valor original).
remove({ quantity, inStock }) { if (quantity > 0) { product.quantity = --quantity; product.inStock = ++inStock; } }Si alguna vez aprende sobre programación funcional , específicamente programación funcional pura , puede haber otros patrones que pueda aplicar a su escenario, pero eso está más allá del alcance de esta respuesta. Estos patrones no harán mutaciones, lo que podría facilitar la comprensión de cómo fluyen los datos y su sistema los cambia.