Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

JavaScript

gary peart
gary peart
6,496 Points

Refactor Challenge (part 2): is using an array in this example considered DRY?

I've added a second loop to create the col[] for second part of this challenge, in order to collect the RGB numbers. Is adding the second loop going against the DRY aim?

var html = '';
var rgbColor;
var col = [];


for (var i = 0; i < 10; i += 1) { 

  for(var j = 0; j < 3; j += 1) {  
  col[j] = Math.floor(Math.random() * 256 ); 
  rgbColor = 'rgb(' + col[0] + ',' + col[1] + ',' + col[2] + ')';   
  }

html += '<div style="background-color:' + rgbColor + '"></div>';
}
document.write(html);

3 Answers

gary, the basic question whether some code is DRY or not is whether it's a copy or duplicate of some other code in your app or program. So the question here is, are you copying code from some place else here and making a duplicate of that code. It doesn't look like that's what's happening.

The other question is whether there's a better way to code this. I.e., whether you really need nested loops or not. That's a different question whether it's DRY code.

It looks like you want to create 10 RGB colors with random values for the R, B and G. And yes, there are other ways to code it, e.g., calling random three times in the outer loop without having an inner loop. Would that be better? Or more elegant? Some would say yes. Some no. Here I don't think it makes much of a difference.

Jamie Carter
seal-mask
.a{fill-rule:evenodd;}techdegree
Jamie Carter
Front End Web Development Techdegree Student 10,754 Points

You could make a function and call the function within the loop rather than using 2 loops.

var html;
var rgbColor;

function randomColor() {
    return Math.floor( Math.random() * 256 );
}

for (var i = 0; i < 10; i += 1) { 
    rgbColor = 'rgb(' + randomColor() + ',' + randomColor() + ',' + randomColor() + ')';   
    html += '<div style="background-color:' + rgbColor + '"></div>';
}

document.write(html);
gary peart
gary peart
6,496 Points

Thanks both of you for your feedback - greatly appreciated!

I can see how the use of functions can at least simplify the code and in this case was, perhaps, a missed opportunity. Sure my code worked, but the loop within a loop was a little more than what was needed for the second part of this Refactor Challenge.