如何创建和克隆 JSON 对象？

Posted 2023-02-22

【中文标题】如何创建和克隆 JSON 对象？

【英文标题】：How to create and clone a JSON object?

【发布时间】：2011-05-06 10:47:10

【问题描述】：

我想知道如何创建 JSON (JS) 对象然后克隆它。

【问题讨论】：

为什么“[你]不能再使用javascript数组了”？ JSON 只是 Javascript 的数组和对象字面量语法。如果您喜欢 JSON 语法，那么在 Javascipt 中使用数组和对象时应该会感到宾至如归。

花点时间阅读这篇文章：There's no such thing as a "JSON Object"

【参考方案1】：

这就是我所做的，它就像一个魅力

if (typeof JSON.clone !== "function") 
    JSON.clone = function(obj) 
        return JSON.parse(JSON.stringify(obj));
    ;

【讨论】：

@Gobliins 是的

但值得一提的是，它是将日期等对象转换为字符串等。

【参考方案2】：

做吧

var x =  //some json object here
var y = JSON.parse(JSON.stringify(x)); //new json object here

【讨论】：

这种方法似乎会引起数据类型之间的一些转换问题，在嵌套 JSON 对象的情况下，还包括与 Array 对象关联的键。在我的例子中，克隆的对象产生了密钥：，而不是原始密钥：[] 下面帖子中的方法看起来，newjsonobj = ...jsonobj，看起来更可取

值得一提的是，这个答案（不是 Sandro 的评论）是将日期等对象转换为字符串等

【参考方案3】：

从 ES6 开始。 Object.assign 是一个很好的方法。

newjsonobj = Object.assign(, jsonobj, )

第一个参数中的项目改变现有对象，第三个参数是返回的新对象中的更改。

在 ES7 中建议使用扩展运算符。

newjsonobj = ...jsonobj

【讨论】：

这会创建一个浅层克隆：如果这些值是可变的对象或数组，那么对第一个 JSON 对象中的值的任何修改都会影响克隆（反之亦然）。例如var a = arr:[1,2,3]; var b = Object.assign(, a, ); b.arr[0] = 4; console.log(a.arr); 按预期打印出 [4, 2, 3] 而不是 [1, 2, 3]。

【参考方案4】：

这是我在解析 JSON 并在代码中多次重用它时经常遇到的问题。并且您希望避免每次都从原始 JSON 字符串重新解析，或者采用效率较低的 serialize/parse 方式。

因此，在您想要调整已解析对象但仍保持原始对象不变的情况下，请在服务器 (NodeJs) 或客户端 javascript 代码中使用以下函数。 jQuery clone 函数效率较低，因为它们处理函数、正则表达式等的情况。下面的函数仅处理 JSON 支持的类型（null、undefined、number、string、array 和 object）：

function cloneJSON(obj) 
    // basic type deep copy
    if (obj === null || obj === undefined || typeof obj !== 'object')  
        return obj
    
    // array deep copy
    if (obj instanceof Array) 
        var cloneA = [];
        for (var i = 0; i < obj.length; ++i) 
            cloneA[i] = cloneJSON(obj[i]);
                      
        return cloneA;
                      
    // object deep copy
    var cloneO = ;   
    for (var i in obj) 
        cloneO[i] = cloneJSON(obj[i]);
                      
    return cloneO;

【讨论】：

最佳答案。所有其他解决方案都有其漏洞。点赞这个以节省其他人的时间

【参考方案5】：

Q1：如何在javascript/jquery中创建JSON对象？

创建一个 Javascript 对象就是这么简单：

var user = ; // creates an empty user object
var user = firstName:"John", lastName:"Doe"; // creates a user by initializing 
// its firstName and lastName properties.

创建后，您可以向对象添加额外的字段，例如user.age = 30;。

如果您将对象作为 JSON 字符串，您可以使用内置的 JSON.parse(yourJsonString) 函数或 jQuery 的 $.parseJSON(yourJsonString) 函数将其转换为 JSON 对象。

Q2：如何在 javascript/jquery 中克隆 JSON 对象？

我克隆 JSON 对象的方法是 jQuery 的 extend 函数。例如，您可以生成用户对象的克隆，如下所示：

var cloneUser = $.extend(true, , firstName:"John", lastName:"Doe");

第一个参数指定克隆对象是原始对象的浅拷贝还是深层拷贝（参见 wiki 上的Object copy）。

要查看其他 JSON 克隆替代方案，您可以阅读 this 文章。

【讨论】：

JSON.parse 返回Object（参见：MDN），而不是“JSON 对象”，AFAIK 不存在该对象。 （不要吹毛求疵，但这对许多初学者来说是一个困惑点，因此纠正它可能会很好）

【参考方案6】：

如何在 javascript/jquery 中创建 JSON 对象？

没有什么比得上 JSON object。 JSON 代表 JavaScript Object Notation，它基本上是一个字符串，它对类似于 JavaScript 的对象字面量的信息进行编码。

但是，您可以使用JSON.stringify(object) 创建这样的编码（这将产生一个字符串），请参阅JSON in JavaScript。也可以手动创建这样的字符串，但是很容易出错，不推荐。

如何在 javascript/jquery 中克隆 JSON 对象？

因为它只是一个字符串：

var jsonString2 = jsonString;

我不能再使用 javascript 数组了

JSON 是一种交换数据的格式，它不是你可以在应用程序中使用的数据结构。

---

也许您想了解更多关于 JS 中的 JSON、objects 和 JS 中的 arrays 的信息。

【讨论】：

第二个答案不正确。 “=”运算符不会克隆任何对象，但会传递引用。

@Reinhard：我从未声称它确实如此。 JS 中的 JSON 仅作为 string 存在。由于字符串是不可变的，因此克隆字符串就像将其分配给不同的变量一样简单。虽然我同意事后看来，OP 可能一直在谈论 JavaScript 对象。

@FelixKling：那么这是对无效问题的回答。它遵循它不是一个答案。我认为最好删除这条线，以免迷惑路过的读者并传播错误的智慧。

JSON 对象（我刚刚意识到我输入了数组）不是键/对对象吗？我刚刚在浏览器的控制台foo = "x":"y"; bar= foo; bar.x = "z"; console.log("Foo: "+foo.x+" | Bar: "+bar.x") 中进行了测试，并将它们都更改为z。我们说的是包含 JSON 格式数据的 String 对象还是 JSON 对象？

这看起来很迂腐，很容易误导人。 = 运算符不会克隆“JavaScript 对象”以使用@Reinhard 术语。显然，这就是海报所要问的。现在......我必须去自动取款机。

【参考方案7】：

我们可以如下克隆 JSON 对象。

EmployeeDetails = 

  Name:"John Deer",
  Age:29,
  Company:"ABC Limited."

现在创建一个克隆函数

function clonning(Employee)

  // conversion from Object to String
  var EmployeeString = JSON.stringify(Employee);

  // conversion from String to Object type

  var EmployeeConvertedObject = JSON.parse(EmployeeString);

  // printing before changing prperty value.

  console.log(EmployeeConvertedObject);

  // modifying EmployeeConvertedObject property value 

  EmployeeConvertedObject.Name="Kelvin Bob";

   // printing After changing prperty value.

  console.log(EmployeeConvertedObject);

  // Now printing original json object.

  console.log(Employee);

  // Here original JSON object is not affecting. Only Cloned object affecting.

立即调用函数。

clonning(EmployeeDetails);

结果：

clonning(EmployeeDetails)
VM212:22 Name: "John Deer", Age: 29, Company: "ABC Limited."
VM212:30 Name: "Kelvin Bob", Age: 29, Company: "ABC Limited."
VM212:34 Name: "John Deer", Age: 29, Company: "ABC Limited."

【参考方案8】：

假设， 我们有一个 JSONOBJECT EmailData，其中有一些数据。现在，如果您想在另一个对象中使用相同的数据（即克隆数据），那么您可以执行以下操作：

JSONOBJECT clone_EmailData=new JSONOBJECT(EmailData.toString());

上面的语句会给你一个具有相同数据的新对象，并且这个新对象不是对 EmailData 对象的引用。

【参考方案9】：

您可以使用扩展运算符来制作对象的副本。对于对象，您使用语法…objectToCopy，对于数组，语法是[…arrayToCopy]。注意：您不能对原语使用扩展运算符，这也是 ES6 的特性。

var aa =  n : 1 
var bb =  ...aa  // bb is a copy of aa by val not by ref, changing bb will not affect aa, and changing aa will not affect bb

【讨论】：

请解释您的代码在做什么。不是每个人都知道传播运算符 … 及其在做什么。