布尔值作为原始类型和作为对象属性有什么区别？

Question

布尔值作为原始类型和作为对象属性有什么区别？

6

我正在学习一些有关HTML5画布的教程，以下是其中的一部分代码。

在这段代码中，为什么他们不选择将runAnimation设置为一个简单的布尔值？我认为x = !x语句无论如何都可以工作，但当我尝试改变代码使用布尔变量时，代码并没有起作用。

那么，原始布尔值和对象属性布尔值之间有什么区别呢？

   /*
   * define the runAnimation boolean as an object
   * so that it can be modified by reference
   */
  var runAnimation = {
    value: false
  };

  // add click listener to canvas
  document.getElementById('myCanvas').addEventListener('click', function() {
    // flip flag
    runAnimation.value = !runAnimation.value;

- Mark Rensen

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Scott Marcus · Accepted Answer

在JavaScript中，所有参数都是按“值”传递的。这意味着传递参数时会传递变量存储内容的副本。

原始值（如布尔值）存储它们所代表的实际数据，因此当传递原始值时，会发送数据的副本，从而产生两个数据副本。对一个副本进行更改不会影响另一个。

但是，当你将对象分配给变量时，变量存储该对象可以被找到的内存位置，而不是对象本身。将对象作为参数传递会导致传递内存地址的副本。在这些情况下，您可能会得到两个变量，它们存储相同的内存地址，因此无论使用哪个变量，都会影响相同的基础对象。

在您的场景中，您肯定可以只使用布尔变量使其工作，但似乎教程想要封装它成为一个对象，以便不会出现浮动布尔数据的副本，并且有更少的机会意外更改一个变量而不更改另一个。

以下是一些基本示例：

// This function takes a single argument, which it calls "input"
// This argument will be scoped to the function.
function foo(input){
  // The function is going to alter the parameter it received
  input = input + 77;
  console.log(input); 
}

var input = 100;  // Here's a higher scoped variable also called "input"

foo(input);       // We'll pass the higher scoped variable to the function

// Now, has the higher level scoped "input" been changed by the function?
console.log(input);  // 100 <-- No, it hasn't because primitives pass a copy of their data

// ************************************************

// Now, we'll do roughly the same thing, but with objects, not primitives
function foo2(obj){
  obj.someProp = 100;
  console.log(obj.someProp);
}

var obj = {
  someProp : 50
};

foo2(obj);

// Here, we see that the original object has been changed by the funciton we passed it to
console.log(obj.someProp);