如何将javascript对象的字符串表示形式转换为实际对象？

Question

我正在尝试以编程方式连接字符串以编程方式创建一个javascript对象（将被移交给AJAX处理程序）。

然而（这非常简化）：

var data = "{ field1: 'Val1', field2: 'Val2' }";

完全不同于：

var data = { field1: 'Val1', field2: 'Val2' };

有没有办法将对象的字符串表示转换为实际对象？

编辑：为了澄清我为什么这样问题，将field1和字段2以编程方式添加到循环内部的字符串中。否则，我只会以正常方式构造对象。

Answer 1

您需要在字符串上使用JSON.parse。

结果将是：

var data = JSON.parse('{"field1": "Val1", "field2": "Val2" }');

Answer 2

您的数据必须

var data = '{"field1": "Val1", "field2":"Val2"}';

然后，您可以使用标准JS方法JSON.Parse（），如下所示：

var ObjectData = JSON.Parse(data);

所以最终结果将是：

ObjectData = {field1: "Val1", field2: "Val2"};

您可以使用此工具 - https://jsonlint.com/来验证您的JSON数据是否有效

Answer 3

您可以使用eval来解析字符串，或new Function括号对于eval很重要，因为您需要将对象评估为对象表达式。

var data = "{ field1: 'Val1', field2: 'Val2' }";

const evil = x => {
  "use strict"
  return eval(x)
}

console.log(evil(`(${data})`))

console.log(new Function(`return ${data}`)())

<script src="https://codepen.io/synthet1c/pen/KyQQmL.js"></script>

Answer 4

下面使用的语法不会出现任何错误，结果将是对象。

var o = JSON.parse("{ \"field1\": \"Val1\", \"field2\": \"Val2\" }");
console.log(typeof(o));
var o2 = JSON.parse('{ "field1": "Val1", "field2": "Val2" }');
console.log(typeof(o2));
var o3 = JSON.parse('{ \"field1\": \"Val1\", \"field2\": \"Val2\" }');
console.log(typeof(o3));

Answer 5

解决方案1.使用JSON

如果您只需要在客户端和服务器之间传输一些对象，请考虑使用 JSON

  

在计算中，JavaScript Object Notation或JSON（/dʒeɪsən/ JAY-sən）是一种开放标准文件格式，它使用人类可读的文本来传输数据对象＆lt; ...＆gt;。这是用于异步浏览器 - 服务器通信的非常常见的数据格式＆lt; ...＆gt;。    - 维基百科

由于在许多编程语言中都有JSON的内置支持或库实现，包括javascript，PHP，Java和其他许多编程语言，这将帮助您避免手动字符串连接和解析的一些开销。

因此，在服务器上，您将执行以下操作：

let result = JSON.stringify({foo: "foo", bar: "bar"});

这是一个javascript示例，但您可以在PHP或Java或几乎任何其他语言中以相同的方式执行此操作。

对上述对象进行编码将产生以下输出字符串：

'{"foo":"foo","bar":"bar"}'

可以使用AJAX将字符串发送到浏览器。然后，在浏览器中，您只需：

let obj = JSON.parse(dataFromAjax);

获得一个真正的javascript对象。 JSON支持对象，数字，字符串，数组，布尔值和null。请注意，如果传入无效的JSON字符串，JSON.parse将抛出错误。

解决方案2.使用eval(str)

内置eval函数计算javascript表达式字符串并返回结果。

一些例子：

let foo = eval("1+1"); // 2 (a number)
let bar = eval('{foo: "foo"}'); // {foo: "foo"} (an object).

第一种方法肯定更干净，更受欢迎，如果可以，请使用它。