JavaScript 核心基础JSON 转换：字符串与 JS 对象的互转

JSON 是前后端数据交互的常用格式，需掌握“字符串转对象”和“对象转字符串”的核心方法：

1. 字符串转 JS 对象（解析）
将 JSON 格式的字符串（值类型）转为 JS 对象（引用类型），才能访问其属性（如 pwd、act），有 2 种常用方法：

方法 语法 说明
JSON.parse() JSON.parse(jsonStr) 推荐方法，安全且高效，专门用于解析 JSON 字符串
eval() eval(‘(‘ + jsonStr + ‘)’) 不推荐，eval 会执行字符串中的任意代码，有安全风险

// JSON 格式的字符串（值类型，无法直接访问属性）
var jsonStr = ‘{“act”:”admin”,”pwd”:”123456″}’;

// 1. JSON.parse() 解析（推荐）
var obj1 = JSON.parse(jsonStr);
console.log(obj1.act); // 打印：admin（可正常访问属性）

// 2. eval() 解析（不推荐）
var obj2 = eval(‘(‘ + jsonStr + ‘)’);
console.log(obj2.pwd); // 打印：123456

2. JS 对象转字符串（序列化）

将 JS 对象（引用类型）转为 JSON 字符串（值类型），用于数据传输（如接口请求），使用 JSON.stringify() 方法：

// JS 对象（引用类型）
var user = { name: “张三”, age: 20 };

// 转为 JSON 字符串
var jsonStr = JSON.stringify(user);
console.log(jsonStr); // 打印：{“name”:”张三”,”age”:20}（字符串类型）

六、核心注意事项：避免踩坑的关键规则
JS 代码需写在 window.onload 中：确保 HTML 元素加载完成后再执行 JS，避免因元素未存在导致的报错；
typeof 检测 null 为 object：这是 JS 设计遗留问题，需特殊记忆，判断 null 应直接用 变量 === null；
for…in 遍历对象需过滤原型属性：若不想遍历对象原型链上的属性，需加判断 if (obj.hasOwnProperty(key))；
事件绑定优先用 addEventListener：避免 onclick 绑定的覆盖问题，且支持事件捕获/冒泡的控制。