Karla Pozzi
Full Stack JavaScript Techdegree Student 4,317 PointsSharing my solution (would love feedback!)
let html = '';
let randomNum = () => Math.floor(Math.random() * 256);
for ( let i = 1; i <= 10; i++ ) {
html += `<div style="background-color: rgb(${randomNum()}, ${randomNum()}, ${randomNum()})">${i}</div>`;
}
document.querySelector('main').innerHTML = html;
Not the same as the instructors but it works. 🤷♀️
2 Answers
Peter Vann
Treehouse Moderator 31,785 PointsHi Karla!
Yes, your code works just fine and in this context I think is just as efficient as Guil's.
Keep in mind that the primary reason to turn small blocks of code into functions is for reusability and to keep your code as DRY* as possible.
*(Don't Repeat Yourself: https://dzone.com/articles/is-your-code-dry-or-wet)
I think Guil's example approach would only be the better way to go if later in the code you needed many more randomRGB color values (it would ultimately be just slightly less typing, overall). Does that make sense?
Also, on the other hand, I think sometimes refactoring can go too far and make code difficult to understand. For example, in some complex platforms, such as WordPress, the code is so refactored and modular that locating where a function is declared can be difficult, if not impossible, and can make debugging and customing the code nightmarish!?!
I hope that helps.
Stay safe and happy coding!
Mohandas Towne
3,654 PointsThis is precisely what I did. Was very validating to see that you posted this example, thanks!