Question

我在函数中使用布尔值True / False时遇到麻烦。

HTML：

<a onclick="selectCategory(animal);">Animal</a>
<a onclick="selectCategory(food);">Food</a>
<a onclick="selectCategory(thing);">Thing</a>

Javascript：

var animal = false;
var food = false;
var thing = false;

function selectCategory(category)
{
     if(category != true)
     {
          category = true;
     }
     else
     {
          category = false;
     }
}

例如，我希望此函数检查变量“ animal”是否为false，然后应转到true。如果为true，则转到false。

每当我尝试此操作时，它总是转到true，而永远不会回到false。变量category似乎不会影响我的变量animal，food和thing。就像它是新变量一样，它只会将category更改为true。

Answer 1

在99％的情况下，重新分配原语（或根本没有任何变量）本身不会做任何事情。改用包含布尔值的对象，传递属性名称，然后在该对象上重新分配属性：

const obj = {
  animal: false,
  food: false,
  thing: false
};
function selectCategory(category){
  obj[category] = !obj[category];
  console.log(obj);
}

<a onclick="selectCategory('animal');">Animal</a>
<a onclick="selectCategory('food');">Food</a>
<a onclick="selectCategory('thing');">Thing</a>

Answer 2

在这种情况下，您肯定必须返回，因为所做的更改仅在函数作用域内进行。但是我的方法将是通过使用对象来进行小的更改的更好方法：

var myConfig = {
  animal: false,
  food: false,
  thing: false
};

function selectCategory(which) {
  myConfig[which] = !myConfig[which];
  console.log(myConfig);
}

<a href="#" onclick="selectCategory('animal'); return false;">Animal</a>
<a href="#" onclick="selectCategory('food'); return false;">Food</a>
<a href="#" onclick="selectCategory('thing'); return false;">Thing</a>

需要记住的几点：

使用对象不会污染全局范围。
您不能将变量作为参数传递，而要在其中更改原始参数。它通过值传递，而不是引用。
使用return false并给出href的兼容性。
使用myVar = !myVar切换布尔值。

Javascript：使用函数将变量更改为true / false

2 个答案: