Random Color Picket - isLight

Hi, can someone help me understand how the below code works? I understand what reduce does, but not sure how < 127 * 3 changes the code? Is it some kind of an if statement - like if the sum of the values in rgb smaller than 127, then multiply it by 3?

  isLight() {
    const rgb = this.state.color;
    return rgb.reduce((a,b) => a+b) < 127 * 3;
  }

127 * 3 is … some other number

considering the intention of the function might also say a lot about what should happen

it should return a lighter color than the defined rgb but how does 127 * 3 enable it?

return <whateveryourreduceisdoingwhichyoualreadyknow> < 381

maybe it’s not so much about enabling anything as it is about just evaluating the operations?

if you evaluate the reduce call then you’d get another number, and then you’d have two numbers and the < operator which you could evaluate as well, and then you’d return that value

Sorry, I’m still having trouble. If we go with an example;

Let’s say rgb is [47,120,12], sum of all the values is 179 which is less than 381 and the function evaluates it as you suggested and returns true eventually. Am I thinking it the wrong way still?

then you’d have 179 < 381, which is what?
oh you said that, so you have
return true
which does what? probably nothing too exciting, you’ve now evaluated the whole function so there’s probably nothing left of your question to wonder about

What does it tell me though?

  • Why did I compare it to 381 to start with?
  • Why didn’t I write it as 381 straight but added a multiplication to get to it?
  • How having a true returned from this function let me use this method as something that will set the button color to a lighter color?

Appreciate your time and patience :slight_smile:

maybe 127 and 3 reads like something more significant than 381

that’s not relevant to this function though is it? what is this function supposed to do? it’s supposed to say yes or no isn’t it? how you use that elsewhere would be… a problem belonging to that elsewhere

you’d make a decision that, hey, I need a function that says yes or no to this particular question.
and while implementing that, you would not be concerned with anything else including how it would be used since you’ve already decided how it should behave.


what’s involved in setting a lighter color? you probably wouldn’t want to know whether a color is light, you’d be interested in lighter. or maybe you mean to ensure it’s light, and then you might be interested in whether something is light, unless you have some operation similar to min, but for color, which would bring it to at most some particular saturation … or whatever the term is for lightness

also, code isn’t really involved in those decisions… deciding what to do is every-day logic or whatever domain-specific logic might be involved… colors