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

gary peart
gary peart
6,496 Points
Posted by 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

jcorum
jcorum
71,830 Points
jcorum
jcorum
71,830 Points

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 12,096 Points
Jamie Carter
.a{fill-rule:evenodd;}techdegree
Jamie Carter
Front End Web Development Techdegree Student 12,096 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
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.