Javascript变量范围和引用答案

【问题标题】：Javascript variable scope and referencingJavascript变量范围和引用
【发布时间】：2013-11-25 07:17:35
【问题描述】：

我正在尝试解决这个 javascript 变量引用问题。这是一个小提琴来演示我要解释的内容：http://jsfiddle.net/XpVb5/1/

我有一个要在单独对象的属性中定义和调用的对象。

var vals = {'something':1};  //original object
var buf  = {'field1': vals, 'field2': vals};  //second object with original object used as properties

现在我想将something 属性更改为only field1，所以很自然，我会这样做：

buf.field1.something = 0;

但是，这也会改变 field2 的 something 属性。我假设这是因为 Javascript 在变量定义过程中引用变量的方式。但是，无论哪种情况，每次我需要在属性定义中使用{'something':0} 时，我如何才能绕过这个不显式调用它；像这样：

var buf = {'field1': {'something':0}, 'field2': {'something':1}};

【问题讨论】：

这更像是一个按价值/按引用的问题，而不是一个范围界定的问题。见，例如stackoverflow.com/questions/518000/…

标签： javascript variables object properties

【解决方案1】：

您需要创建 vals 对象的副本。目前，您只是在两个地方都提供对对象的引用。当您修改基础对象时，更改会出现在两个 buf (field1 + field2) 中，因为它们仅提供对基础对象的引用。

注意：我使用 JSON.parse(JSON.stringify($vals)) 作为如何复制 $vals 对象的快速示例。

var $vals   = {"something":1},
    buf     = {"field1": JSON.parse(JSON.stringify($vals)), "field2": JSON.parse(JSON.stringify($vals))};

//change the 'something' field for one of the buf properties
buf.field1.something = 0;

//see if the 'something' field changed for the other buf property
alert( buf.field2.something );

http://jsfiddle.net/XpVb5/2/

给予

延伸阅读："The most elegant way to clone an object"

【讨论】：

如果我的对象是 jquery DOM 对象怎么办？这不会坏吗？
归根结底，如果您想独立更新两个单独的对象，您需要拥有两个单独的对象实例。如何获得两个实例取决于您！

【解决方案2】：

可以将$vals 更改为返回对象的函数。每个返回将是一个不同的实例

var $vals = function(){
    return {"something":1}
}
var  buf     = {"field1": $vals(), "field2": $vals()};

//change the 'something' field for one of the buf properties
buf.field1.something = 0;

//see if the 'something' field changed for the other buf property
alert( buf.field2.something );

DEMO

【讨论】：