javascript - (JAVASCRIPT) 不更新我的背景颜色？

Question

我正在尝试为我的 CS 作业做一个项目，但由于某种原因，它拒绝正确运行代码。

  shake();
  if (answers == 0 || 2 || 3 || 5) {
    setProperty("screen1", "background-color", "green");
  } else if (answers == 1 || 4) {
    setProperty("screen1", "background-color", "red");
  } else {
    
  }

我已经设置了“答案”，var answers = 0并且摇动功能基本上只是随机化一个数字answers。但是，即使answers == 1或answers == 4，它仍然显示背景屏幕为绿色，而不是红色。有什么帮助吗？

Answer 1

这里有两个值得探索的解决方案。一种是使用switch通常最快的语句：

function screenBg(answer) {
  switch (answer) {
    case 0:
    case 2:
    case 3:
    case 5:
      return 'green';
    case 1:
    case 4:
      return 'red';
}

// In action:
setProperty("screen1", "background-color", screenBg(answers));

看到 的贯穿样式可能有点奇怪switch，这就是为什么查找表是一个不错的选择：

const SCREEN_BG = [
  'green', // 0
  'red',   // 1
  'green', // 2
  'green', // 3
  'red',   // 4
  'green'  // 5
];

setProperty("screen1", "background-color", SCREEN_BG[answers]);

这里索引和颜色之间的相关性应该很清楚。

Answer 2

像这样做

shake();
  if ([0,2,3,5].includes(answers)) {
    setProperty("screen1", "background-color", "green");
  } else if ([1,4].includes(answers)) {
    setProperty("screen1", "background-color", "red");
  } else {
    
  }

您测试 if 语句的方式是错误的，应该是这样的：

if(answers === 0 || answers === 2 || ...)

Answer 3

您的条件不正确，代码可以稍微改进一下。

let color = [0, 2, 3, 5].includes(answers) 
    ? 'green' 
    : [1, 4].includes(answers) 
        ? 'red'
        : 'orange';
setProperty("screen1", "background-color", color);

如果您更喜欢使用 if-elseif-else

let color = "orange"; // this is for else block.
if ([0, 2, 3, 5].includes(answers)) color = "red";
if ([1, 4].includes(answers)) color = "green"; 

如果 "answers" 是一个数组，请使用如下条件：

[0, 2, 3, 5].some((x) => answers.includes(x))