js json转换成对象|极客笔记

js json转换成对象

在前端开发中，经常会涉及到将 JSON 格式的数据转换成 JavaScript 对象的需求。JSON（JavaScript Object Notation）是一种轻量级的数据交换格式，它采用完全独立于编程语言的文本格式来描述数据对象，易于阅读和编写。而 JavaScript 中提供了很多方法来解析 JSON 字符串并转换成对象。

JSON.stringify()

JSON.stringify() 方法用于将 JavaScript 对象转换为一个 JSON 字符串。它接受一个对象作为参数，并返回一个 JSON 字符串。

const obj = {
  name: 'Alice',
  age: 25,
  city: 'New York'
};

const jsonStr = JSON.stringify(obj);

console.log(jsonStr);

运行上面的代码，控制台会输出以下结果：

{"name":"Alice","age":25,"city":"New York"}

JSON.parse()

JSON.parse() 方法用于将 JSON 字符串解析为 JavaScript 对象。它接受一个 JSON 字符串作为参数，并返回一个相应的 JavaScript 对象。

const jsonStr = '{"name":"Bob","age":30,"city":"Los Angeles"}';

const obj = JSON.parse(jsonStr);

console.log(obj.name); // 输出 "Bob"
console.log(obj.age); // 输出 30
console.log(obj.city); // 输出 "Los Angeles"

运行上面的代码，控制台会输出以下结果：

Bob
30
Los Angeles

实际应用场景

在前端开发中，我们经常会从服务器端获取 JSON 格式的数据，然后通过 JSON.parse() 方法将其转换成 JavaScript 对象，以便在页面上展示数据或进行其他操作。

// 模拟从服务器端获取的 JSON 数据
const jsonData = '[{"name":"Alice","age":25,"city":"New York"},{"name":"Bob","age":30,"city":"Los Angeles"}]';

// 解析 JSON 数据
const users = JSON.parse(jsonData);

// 遍历用户数据，并在页面上展示
users.forEach(user => {
  console.log(`Name:  ${user.name}, Age:$ {user.age}, City: ${user.city}`);
});

运行上面的代码，会输出以下结果：

Name: Alice, Age: 25, City: New York
Name: Bob, Age: 30, City: Los Angeles

通过以上示例，我们了解了如何将 JSON 格式的数据转换成 JavaScript 对象，并在实际应用场景中使用该功能。

js json转换成对象