derigible derigible - 3 months ago 7x
Javascript Question

JS: What do the curly braces inside function parameter declarations mean?

I have been following this tutorial on setting up React with Redux, and I noticed some syntax that I am not familiar with. What are the curly braces inside the function parameter definition doing?


function Stream({ tracks = [], onAuth }) { #what is going on here?
return (
... #component stuff here

Is this React specific? Or does this have something to do with Babel or some other library? I am new to this tech, so not sure what is going on.


It looks like destructuring syntax, but I didn't know javascript had destructuring.

If that's what it is, the function is expecting an object with a tracks field (but can default to an empty list of the object doesn't Hebert one), and a onAuth field, which must be supplied. It's basically a neater way of accessing the passed object's fields.