when I trigger the if condition, why the else will print out as well? someone could indicate what's the problem of the code below? written in JS.

const rainbow = ['red', 'orange', 'yellow', 'green', 'cyan', 'blue', 'violet'];
let colour = prompt("What is your favourite colour?").toLowerCase();

for (let i = 0; i < rainbow.length; i =1) {
  if (rainbow[i] === colour) {
    console.log("yes")
  }
  else {
    console.log(rainbow.join(" *** "));
  }
}

<iframe name="sif1" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

CodePudding user response：

It's because your loop is running through the array. So for example if I say red it will go to the first if and then after the second iteration it will go to the else. If this code is un a function you need to return in your if, if you want the loop to stop at this moment.

const findColor = () => {
    const rainbow = ['red', 'orange', 'yellow', 'green', 'cyan', 'blue', 'violet'];
    let colour = prompt("What is your favourite colour?").toLowerCase();

    for (let i = 0; i < rainbow.length; i =1) {
      if (rainbow[i] === colour) {
        console.log("yes")
        return rainbow[i]// It will leave the loop when it passes on the right color
      }
      else {
        console.log(rainbow.join(" *** "));
        return
      }
    }
}

You can also use the includes function if you don't want to use a loop:

console.log(rainbow.includes(colour) ? 'yes' : rainbow.join(" *** "));

CodePudding user response：

You don't even need a loop for this You can use the include function for arrays to achieve this.

const rainbow = ['red','orange','yellow','green','cyan','blue','violet']; 
let colour = prompt("What is your favourite colour?").toLowerCase();

console.log(rainbow.includes(colour) ? 'yes' : rainbow.join(" *** "));

<iframe name="sif2" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

CodePudding user response：

You could use the includes method for checking the input.

const rainbow = ['red', 'orange', 'yellow', 'green', 'cyan', 'blue', 'violet'];
let colour = prompt("What is your favourite colour?").toLowerCase();

if (rainbow.includes(colour)) {
  console.log("yes")
}
else {
  console.log(rainbow.join(" *** "));
}

<iframe name="sif3" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

CodePudding user response：

You can break out the loop if you need to when you've found the colour:

const rainbow = ['red', 'orange', 'yellow', 'green', 'cyan', 'blue', 'violet'];

const colour = prompt("What is your favourite colour?").toLowerCase();

for (let i = 0; i < rainbow.length; i =1) {
  if (rainbow[i] === colour) {
    console.log('yes');
    break;
  } else {
    console.log(rainbow.join(" *** "));
  }
}

<iframe name="sif4" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

But a slightly better method would be to remove the loop altogether, and use an array method like includes instead.

const rainbow = ['red', 'orange', 'yellow', 'green', 'cyan', 'blue', 'violet'];

const colour = prompt("What is your favourite colour?").toLowerCase();

if (rainbow.includes(colour)) {
  console.log('yes');
} else {
  console.log(rainbow.join(" *** "));
}

<iframe name="sif5" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>