JavaScript - JSON.parse() 方法

JavaScript JSON.parse() 方法用于将 JSON 字符串解析(或转换)为 JavaScript 对象。在 JavaScript 中，"JSON" 是一种轻量级数据交换格式，广泛用于在 Web 服务器和客户端之间交换数据。

术语 "解析" 表示将数据的字符串表示形式(JSON 格式)转换为 JavaScript 可以理解的格式，例如对象。

JSON.parse() 方法是 JavaScript 中的静态方法，这意味着您可以始终将其用作 JSON.parse()，而无需创建对象实例来调用它。

语法

以下是 JavaScript JSON.parse() 方法的语法 -

JSON.parse(text, reviver)

参数

此方法接受两个名为"text"和'reviver'，如下所述 -

• text - 您要解析的 JSON 字符串。

• reviver(可选) - 一个可以在返回结果对象之前对其进行转换的函数。您可以使用此函数在解析过程中修改特定的属性或值。

返回值

此方法返回与给定 JSON 文本对应的 JavaScript 对象、数组、字符串、数字、布尔值或 null 值。

示例

示例 1

当我们省略 "reviver" 参数并仅将 "text" 参数传递给此方法时，它会将文本(JSON 字符串)转换为对象。

在下面的程序中，我们使用 JavaScript JSON.parse() 方法将文本(JSON 字符串){"name": "Rahul", "age": 23, "city": "Hyderabad"> 转换为 JavaScript 对象。

<html>
<head>
   <title>JavaScript JSON.parse() Method</title>
</head>
<body>
   <script>
      
      //JSON string
      const student = '{"name": "Rahul","age": 23, "city": "Hyderabad"}';
      document.write("Before parse(JSON string): ", student);
      document.write("<br>Object (after parse JSON string): ");
      
      //使用 JSON.parse() 方法
      var obj = JSON.parse(student);
      document.write("<br>Name: ", obj.name);
      document.write("<br>Age: ", obj.age);
      document.write("<br>City: ", obj.city);
   </script>
</body>
</html>

Output

The above program returns an object after parsing the given JSON string.

Before parse(JSON string): {"name": "Rahul","age": 23, "city": "Hyderabad"}
Object (after parse JSON string):
Name: Rahul
Age: 23
City: Hyderabad

示例 2

如果我们将 "text" 和 "reviver" 参数同时传递给此方法，它将转换 JSON 字符串，并根据 reviver 函数转换结果对象。

以下是另一个使用 JavaScript JSON.parse() 方法的示例。我们使用此方法将给定的 JSON 字符串 {"1": 2, "2": 4, "3": 5, "4": 8> 转换为对象。此外，我们将使用 reviver 函数 转换结果对象，使其以修改后的结构返回键及其各自的值。

<html>
<head>
   <title>JavaScript JSON.parse() Method</title>
</head>
<body>
   <script>
      
      //JSON string
      const numbers = '{"1": 2,"2": 4, "3": 5, "4": 8}';
      document.write("Before parse(JSON string): ", numbers, "<br>");
      document.write("Object (after parse JSON string): <br>");
      
      var obj = JSON.parse(numbers, (key, value) => {
         document.write("key = ", key, " Value = ", value, "<br>");
      });
   </script>
</body>
</html>

输出

执行上述程序后，将返回一个对象的键及其对应的值。

Before parse(JSON string): {"1": 2,"2": 4, "3": 5, "4": 8}
Object (after parse JSON string):
key = 1 Value = 2
key = 2 Value = 4
key = 3 Value = 5
key = 4 Value = 8
key = Value = [object Object]

示例 3

我们使用 reviver 函数修改转换后对象的具体值。

在下面的示例中，我们使用 JSON.parse() 方法将给定的 JSON 字符串 students = '[{}]' 转换为一个对象。然后，我们定义一个名为 increaseAge() 的函数。此函数将每个学生的年龄增加 5。最后，我们将此函数传递给 JSON.parse() 方法，以检索包含更新年龄的格式化输出。

<html>
<head>
   <title>JavaScript JSON.parse() Method</title>
</head>
<body>
   <script>
      
      //JSON string 
      const students = '[{"name": "Rahul", "age": 23, "city": "Hyderabad"}, {"name": "Vikash", "age": 22, "city": "Lucknow"}, {"name": "Shikha", "age": 21, "city": "Lucknow"}]';
      document.write("Before parse (JSON string): <br>", students);
      
      //Define a reviver function
      function increaseAge(key, value){
         if(key == "age"){
            return value+5;
         }
         return value;
      }

      var obj = JSON.parse(students, increaseAge);
      document.write("<br>", obj[0].name , " updated age: ", obj[0].age);
      document.write("<br>", obj[1].name , " updated age: ", obj[1].age);
      document.write("<br>", obj[2].name , " updated age: ", obj[2].age);
   </script>
</body>
</html>

输出

上述程序执行后，将返回一个包含更新后的学生年龄的对象。

Before parse (JSON string):
[{"name": "Rahul", "age": 23, "city": "Hyderabad"}, 
{"name": "Vikash", "age": 22, "city": "Lucknow"}, 
{"name": "Shikha", "age": 21, "city": "Lucknow"}]
Rahul updated age: 28
Vikash updated age: 27
Shikha updated age: 26