Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Please explain how [...planets] can be used?

I originally had the code like this and it worked. But I noticed in the final project, [...planet] was used. I don't understand how this works.

My original working code without [...planet]

const Container = (props) => { return ( <div class="container"> {props.planets.map((p) => ( <Planet url={p.url} name={p.name} desc={p.desc} moons={p.moons} diameter={p.diameter} key={p.id} /> ))} </div> ); };

1 Answer

Robert Bourton
Robert Bourton
6,179 Points

The Spread Operator There are many ways you can use the spread operator.

const numbers = [ 1, 2, 3 ]

function print( one, two, three) {
   console.log(one)
   console.log(two)
   console.log(three)
}

print( ...numbers )
function array( ...args ) {
   for (let i = 0; i < args.length; i++)
        console.log( args[i] )
}

array( 1, 2, 3)
const array1 = [ 1, 2, 3 ]
const array2 = [4, 5, 6 ]
const array3 = [ ...array1, ...array2 ]
let obj1 = { one: 1, two: 2 }
let obj2 = { three: 3, four: 4 }

let copy = { ...obj1 }
let merge = { ...obj1, ...obj2 }

I will need to see your whole code to help you out with this. Looks like your trying to build a HTML String.

Robert Bourton
Robert Bourton
6,179 Points

I don't use semicolons in my JavaScript code, since they are optional.

Steven Parker
Steven Parker
229,670 Points

Semicolons after statements may be technically optional, but they are most definitely a "best practice".
You might want to reconsider using them!   :speak_no_evil: