JavaScript -----JSON笔记

本文涉及的产品
全局流量管理 GTM,标准版 1个月
云解析 DNS,旗舰版 1个月
云解析DNS,个人版 1个月
简介:

JSON的全称是”JavaScript Object Notation”,意思是JavaScript对象表示法,它是一种基于文本,独立于语言的轻量级数据交换格式。XML也是一种数据交换格式,为什么没有选择XML呢?因为XML虽然可以作为跨平台的数据交换格式,但是在JS(JavaScript的简写)中处理XML非常不方便,同时XML标记比数据多,增加了交换产生的流量,而JSON没有附加的任何标记,在JS中可作为对象处理,所以我们更倾向于选择JSON来交换数据。



JSON 语法是 JavaScript 语法的子集。

JSON 语法规则

JSON 语法是 JavaScript 对象表示法语法的子集。

  • 数据在名称/值对中

  • 数据由逗号分隔

  • 花括号保存对象

  • 方括号保存数组


JSON 名称/值对

JSON 数据的书写格式是:名称/值对。

名称/值对包括字段名称(在双引号中),后面写一个冒号,然后是值


JSON 值

JSON 值可以是:

  • 数字(整数或浮点数)

  • 字符串(在双引号中)

  • 逻辑值(true 或 false)

  • 数组(在方括号中)

  • 对象(在花括号中)

  • null


JSON 对象

JSON 对象在花括号中书写:

对象可以包含多个名称/值对:

{ "firstName":"John" , "lastName":"Doe" }


JSON 数组

JSON 数组在方括号中书写:

数组可包含多个对象:

{
"employees": [
{ "firstName":"John" , "lastName":"Doe" },
{ "firstName":"Anna" , "lastName":"Smith" },
{ "firstName":"Peter" , "lastName":"Jones" }
]
}

在上面的例子中,对象 "employees" 是包含三个对象的数组。每个对象代表一条关于某人(有姓和名)的记录。



JSON 使用 JavaScript 语法

因为 JSON 使用 JavaScript 语法,所以无需额外的软件就能处理 JavaScript 中的 JSON。

通过 JavaScript,您可以创建一个对象数组,并像这样进行赋值:

例子

var employees = [
{ "firstName":"Bill" , "lastName":"Gates" },
{ "firstName":"George" , "lastName":"Bush" },
{ "firstName":"Thomas" , "lastName": "Carter" }
];

可以像这样访问 JavaScript 对象数组中的第一项:

employees[0].lastName;

返回的内容是:

Gates



在JS中如何使用JSON

JSON是JS的一个子集,所以可以在JS中轻松地读,写JSON。读和写JSON都有两种方法,分别是利用”.”操作符和“[key]”的方式。
我们首先定义一个JSON对象,代码如下。

var obj = {            1: "value1",            "2": "value2",

            count: 3,
            person: [ //数组结构JSON对象,可以嵌套使用                        {
                            id: 1,
                            name: "张三"
                        },
                        {
                            id: 2,
                            name: "李四"
                        }
                   ],
            object: { //对象结构JSON对象
                id: 1,
                msg: "对象里的对象"    
            }
        };

1,从JSON中读数据


function ReadJSON() {
            alert(obj.1); //会报语法错误,可以用alert(obj["1"]);说明数字最好不要做关键字
            alert(obj.2); //同上
            alert(obj.person[0].name); //或者alert(obj.person[0]["name"])
            alert(obj.object.msg); //或者alert(obj.object["msg"])
        }


2,向JSON中写数据

比如要往JSON中增加一条数据,代码如下:

function Add() { 
            //往JSON对象中增加了一条记录
            obj.sex= "男" //或者obj["sex"]="男"
        }

增加数据后的JSON对象如图:

json01

3,修改JSON中的数据

我们现在要修改JSON中count的值,代码如下:

function Update() {
            obj.count = 10; //或obj["count"]=10
        }

修改后的JSON如图。

json02

4,删除JSON中的数据

我们现在实现从JSON中删除count这条数据,代码如下:

function Delete() {            delete obj.count;
        }

删除后的JSON如图

json03

可以看到count已经从JSON对象中被删除了。

5,遍历JSON对象

可以使用for…in…循环来遍历JSON对象中的数据,比如我们要遍历输出obj对象的值,代码如下:

function Traversal() {            for (var c in obj) {
                console.log(c + ":", obj[c]);
            }
        }

程序输出结果为:

json04

解析和序列化

如果是载入的 JSON 文件,我们需要对其进行使用,那么就必须对 JSON 字符串解析成原生的 JavaScript 值。当然,如果是原生的 JavaScript 对象或数组,也可以转换成 JSON 字 符串。对于讲 JSON 字符串解析为 JavaScript 原生值,早期采用的是 eval()函数。但这种方法 既不安全,可能会执行一些恶意代码。

var box = '[{"name" : "a","age" : 1},{"name" : "b","age" : 2}]';

alert(box); //JSON 字符串

var json = eval(box); //使用 eval()函数解析 

alert(json); //得到 JavaScript 原生值

ECMAScript5 对解析 JSON 的行为进行规范,定义了全局对象 JSON。支持这个对象的 浏览器有 IE8+、Firefox3.5+、Safari4+、Chrome 和 Opera10.5+。不支持的浏览器也可以通过 一个开源库 json.js 来模拟执行。JSON 对象提供了两个方法,一个是将原生 JavaScript 值转 换为 JSON 字符串:stringify();另一个是将 JSON 字符串转换为 JavaScript 原生值:parse()。




本文转自 风雨萧条 51CTO博客,原文链接:http://blog.51cto.com/1095221645/1883512,如需转载请自行联系原作者


相关文章
|
2月前
|
JSON JavaScript 前端开发
JavaScript原生代码处理JSON的一些高频次方法合集
JavaScript原生代码处理JSON的一些高频次方法合集
|
1天前
|
JavaScript 前端开发 CDN
前端 JS 经典:package.json 属性详解
前端 JS 经典:package.json 属性详解
7 1
|
10天前
|
Web App开发 JSON JavaScript
JavaScript对象常用操作JSON总结
JavaScript对象常用操作JSON总结
19 8
|
6天前
|
JavaScript vr&ar 数据库
技术笔记:Js获取当前日期时间及其它操作
技术笔记:Js获取当前日期时间及其它操作
12 1
|
19天前
|
JSON JavaScript 前端开发
js将json字符串还原为json
【6月更文挑战第15天】js将json字符串还原为json
20 4
|
22天前
|
存储 JSON JavaScript
JavaScript基础-对象与JSON
【6月更文挑战第11天】本文介绍了JavaScript对象的创建(字面量、构造函数、Class)与操作,包括属性访问和描述符。同时讲解了JSON的性质及其与JS对象的关系,以及序列化和解析过程。文章还列举了三个常见易错点(属性访问错误、JSON格式错误、循环引用)并提供了避免策略。通过代码示例展示如何操作对象和处理JSON,强调实践对于掌握这些概念的重要性。
|
23小时前
|
JSON JavaScript 前端开发
|
2天前
|
JavaScript
js【详解】深拷贝 (含 JSON.parse(JSON.stringify(obj)) 的缺陷,5种手写深拷贝)
js【详解】深拷贝 (含 JSON.parse(JSON.stringify(obj)) 的缺陷,5种手写深拷贝)
4 0
|
6天前
|
Web App开发 JavaScript iOS开发
技术笔记:js数组定义和方法(包含ES5新增数组方法)
技术笔记:js数组定义和方法(包含ES5新增数组方法)
|
6天前
|
JavaScript BI
技术笔记:JS获取子节点、父节点和兄弟节点的方法实例总结
技术笔记:JS获取子节点、父节点和兄弟节点的方法实例总结
10 0