JSON基础语法、对象与数组详解及JS转换方法
本文详解JSON的基础语法规则,包括名称/值对、逗号分隔及括号用法。深入解析JSON对象与数组的结构,并通过示例展示如何在JavaScript中创建数组。重点介绍利用eval函数将JSON文本转换为JS对象的方法及属性访问技巧,帮助开发者掌握JSON数据处理核心技能。
JSON基础语法与结构
JSON 的语法规范
JSON 语法遵循 JavaScript 对象表示法的子集定义。
•键值对形式存储数据 •数据项以逗号分隔 •使用花括号封装对象 •使用方括号封装数组
JSON 对象结构
JSON 对象定义于花括号内部:
对象内可包含若干键值对:
{ "firstName":"John" , "lastName":"Doe" }
此结构与以下 JavaScript 语句等效:
firstName = "John"
lastName = "Doe"
JSON 数组结构
JSON 数组定义于方括号内部:
数组元素可包含多个对象:
{
"employees": [
{ "firstName":"John" , "lastName":"Doe" },
{ "firstName":"Anna" , "lastName":"Smith" },
{ "firstName":"Peter" , "lastName":"Jones" }
]
}
上述示例中,"employees" 对象数组包含三条记录,每条记录分别记录姓名信息。
JSON 文件格式
•JSON 文件扩展名为 ".json" •JSON 文本的 MIME 类型为 "application/json"
JSON转换为JavaScript对象
将 JSON 文本转换为 JavaScript 对象
JavaScript 内置函数 eval() 可用于实现 JSON 文本到 JavaScript 对象的转换。
eval() 函数调用 JavaScript 编译器解析 JSON 文本并生成对应对象。需将文本包裹在括号内以防止语法错误: var obj = eval ("(" + jsontxt + ")");
具体示例:
$.ajax({
type: 'POST',
url: '../../caseHandler.ashx?action=GetCase&id=' + id.toString(), //url action是方法的名称
data: "",
dataType: "text", //可以是text,如果用text,返回的结果为字符串;如果需要json格式的,可以设置为json
ContentType: "application/json; charset=utf-8",
success: function (returnedData) {
getMarkerFeature(eval("(" + returnedData+ ")"));
},
error: function (msg) {
alert("访问失败:"+ msg);
}
});
JavaScript对象操作示例
利用 JavaScript 构建对象数组
var employees = [
{ "firstName":"Bill" , "lastName":"Gates" },
{ "firstName":"George" , "lastName":"Bush" },
{ "firstName":"Thomas" , "lastName": "Carter" }
];
JavaScript 对象属性的两种访问方式
object.attribute
object["attribute"]
具体示例:
var employees = [
{ "firstName":"Bill" , "lastName":"Gates" },
{ "firstName":"George" , "lastName":"Bush" },
{ "firstName":"Thomas" , "lastName": "Carter" }
];
alert(employees[0].lastName); // 方式一
alert(employees[0]["lastName"]); // 方式二
以上即为 json 对象与数组及转换为 js 对象的简易实现方法全部介绍,感谢关注本站~
JS大数值转字符串出现科学计数法怎么办
2026-11-05 17:09:21
JS split切割后出现空字符串怎么过滤
2026-11-05 16:00:30
在 React 或 Vue 项目中封装使用 JS 节流防抖
2026-11-05 15:27:29
JavaScript中怎么将带小数的字符串转为整数?
2026-11-05 14:32:38
怎么用JavaScript策略模式重构电商促销计算逻辑?
2026-11-05 14:01:09
