DEV Community

Extract Functions Arguments using Destructure in JavaScript

Samantha Ming on March 25, 2020

Extract Functions Arguments using Destructure in JavaScript ES6 Destructuring is terrific at extracting value from your arguments. So ...

Read full post

Keff • Mar 25 '20

Nice read!
Really well explained, I tend to use objects for this purpose, so the user sees the parameter names on the function call, but this is a great approach as well, even better if using arguments.

Samantha Ming • Mar 25 '20

Thanks Manolo! And glad you found it helpful!

Totally, passing object is super cool! which kinda acts like named parameters where you don't have to worry about the order. I believe this is what you're referring to:

// Boo, arguments must be in specific order
function meal(protein, carb, veggie){
}
meal('🥩', '🍚', '🥦')


// Yay, arguments can be in any order
function meal2({protein, carb, veggie}){
}
meal2({carb: '🍚', veggie: '🥦', protein: '🥩'})

I have a tidbit on it as well > samanthaming.com/tidbits/18-named-... 😊

Keff • Mar 25 '20

Yup that was exactly it :) I'll check it out

Keff • Mar 25 '20

I have to agree with you in this sense, I guess the point of the post was to not use arg[0] to access arguments and to show and explain how destructuring works. But in the example you show, it is kinda redundant. I think this will confuse more people than not.

This is why I use objects instead, at least you give some useful feature to the user (named parameters).
This: fn({ name: 'bob' }).
Instead of: fn('bob').

Keff • Mar 25 '20

For 2 arguments it is kinda not needed, although when passing in a bunch of arguments it is cleaner to do it this way.

If I have to pass a lot of parameters I tend to use with objects instead:

function omelette({ egg, ingredient }) {}

omelette({ egg:  '🥚', ingredient: '🧀' });

Samantha Ming • Mar 26 '20

For sure, in this simple example, the rest+destructuring combo doesn't really make sense. I'd stick with the 2nd way for sure 👍I think the community example was just showing a different way of doing things that achieve the same thing. Coding is all about communication, so we should pick the one that best facilitates that. I always enjoy seeing all the different ways because it builds up my toolbox. The best tool is always dependent on the situation. Thanks for pointing this out and allowing me to adjust my code notes 🙂

Samantha Ming • Mar 25 '20

Thanks for the question Tomasz! I just re-wrote the article to add some explanation. Hopefully, it clarified some things...if you don't mind, can you have a read (the last section) and let me know if it helps 🤞If it doesn't, just let me know and I'll try again 😊