Is it possible to destructure an object while returning it at the same time. For example, to change this code:
const mapStateToProps = ({ newItem }) =>{ const { id, name, price } = newItem; return { id, name, price }; }
To something like this:
const mapStateToProps = ({ newItem }) =>{ return { id, name, price } = newItem; }
You don't need to take the entire object as an argument and pick the required property values. You pass the values directly as function arguments and use them inside. There is one more usage of object destructuring with function. If a function returns an object, you can destructure the values directly into variables.
Destructuring in Arrays. To destructure an array in JavaScript, we use the square brackets [] to store the variable name which will be assigned to the name of the array storing the element. const [var1, var2, ...]
Destructuring nested objectsIf we need to access an employee's info we can destructure as many levels as it takes to get to our employee object's properties. const { engineers: { 1: { id, name, occupation, }, }, } = employees; Now we have access to all of the second employee object's properties.
Destructuring means to break down a complex structure into simpler parts. With the syntax of destructuring, you can extract smaller fragments from objects and arrays. It can be used for assignments and declaration of a variable.
No, it's not possible.
(Disclaimer: your syntax works and does both destructuring and returning, but it is equivalent to
({ id, name, price } = newItem); // assigns global variables return newItem;
which is probably not what you wanted)
To do what you want (which I assume is creating a new object), you need to use an object literal (potentially with shorthand property notation). See also One-liner to take some properties from object in ES 6:
const mapStateToProps = ({newItem: {id, name, price}}) => ({id, name, price});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With