资讯专栏INFORMATION COLUMN

Javascript JSON

Miyang / 298人阅读

摘要:只是一种字符串数据格式,使用它的不仅仅是。对象在中,定义了全局对象。用于把对象序列化为字符串。这个方法可以使我们不必在乎语法与语法的差异,尽管创建合法的对象。用于把字符串序列化为值。

JSON只是一种字符串数据格式,使用它的不仅仅是Javascript。

语法

JSON可以表示三种类型的值:简单值、对象、数组

简单值

以下是JSON可以辨识的简单值例子:

5
"Hello World!"
false
null

*注意:

undefined不被支持

字符串必须使用双引号,单引号会导致语法错误

对象

在Javascript中,我们可以用对象字面量的方式创建一个对象:

var person = {
    name: "Sue",
    age:  "18"
}

但JSON要求给属性加双引号,上述对象转换成合法的JSON字符串格式:

{
    "name": "Sue",
    "age":  "18"
}

*注意:

属性加双引号

没有变量声明

没有末尾分号

属性的值可以是前面介绍的简单值,也可以是对象或数组

2、3点同样适用于简单值和数组

数组

在Javascript中,我们可以创建一个如下数组:

var names = ["Sue", "Jane", "Ben"]

上述数组转换成合法的JSON字符串格式:

["Sue", "Jane", "Ben"]

我们可以将数组、简单值、对象嵌套使用,创建更加复杂的JSON字符串,比如:

{
    "teachers": [
        { "name": "Sue", "age": 18, "students": [1, 45, 60]},
        { "name": "Ben", "age": 25, "students": [2, 31, 40]}
    ],
    "students": [
        { "id": 1, "name": "Jane"},
        { "id": 2, "name": "Lee"}
    ]
}
解析与序列化

在JSON之前,web传输格式化数据都是使用XML,Javascript要想拿到XML中的数据,要先将其转换成DOM,而后从中提取数据,相比之下,JSON就显得非常简单。

eval

早期解析JSON一般使用eval(),比如:

eval({"name": "Sue"})
{name: "Sue"}

但这种方式存在风险,因为服务器返回的数据很有可能存在恶意代码,只要被解析成合法的Javascript语法,就会被执行,比如:

eval("alert("Sue")")

因此不建议使用eval()来解析JSON字符串。
早期浏览器中,可以使用https://github.com/douglascro...。

JSON对象

在IE 8+、 Firefox 3.5+、 Safari 4+、 Chrome、Opera 10.5+中,ECMAScript定义了全局对象JSON。

stringify

用于把Javascript对象序列化为JSON字符串。
*注意:

值为undefined的属性会被忽略

函数及原型成员会被忽略

不包含缩进和空格字符(比如逗号后的空格)

举个例子:

function Person(name, secret) {
    this.name = name;
    this.secret = secret;
    this.makeFriends = function() {
        return this.secret;
    }
}
Person.prototype.sayHi = function() {
    return this.name;
}
var me = new Person("Sue", undefined)
me.makeFriends()
// undefined
me.sayHi()
// "Sue"
var meJSON = JSON.stringify(me);
// "{"name":"Sue"}"

上述例子中,我们创建了一个Person实例me,其中secret属性为undefined,包含makeFriends方法和一个原型成员sayHi,这些都没有被添加到生成的JSON字符串中。
这个方法可以使我们不必在乎Javascript语法与JSON语法的差异,尽管创建合法的Javascript对象。

parse

用于把JSON字符串序列化为Javascript值。

var meCopy = JSON.parse(meJSON)
// {name: "Sue"}

*注意:memeCopy是两个独立的对象,实际编程中,可以使用stringify parse实现对象的拷贝。

stringify 选项

JSON.stringify()的第一个参数是要序列化的对象,后面还可以加两个参数,分别是过滤器和选项。

过滤器

过滤器可以是数组,也可以是函数,如果是数组,JSON.stringify()的结果中将保留数组中的属性,比如:

function Person(name, age, secret) {
    this.name = name;
    this.age = age;
    this.secret = secret;
}
var me = new Person("Sue", 18, "none");
var meJSON = JSON.stringify(me, ["name", "age"])
meJSON
// "{"name":"Sue","age":18}"

如果过滤器是一个函数,会给这个函数传入两个参数,分别是属性名和属性值,根据需要返回要添加到JSON中的属性值,如果为undefined,会移除该属性,比如:

var me = new Person("sue", 25, ["girl", "1024", "Beauty"])
function process(key, value) {
    switch(key) {
        case "name":
            return value.charAt(0).toUpperCase() + value.slice(1);
        case "age":
            return 18;
        case "secret":
            return undefined;
        default:
            return value;
    }
}
var meJSON = JSON.stringify(me, process)
meJSON
// "{"name":"Sue","age":18}"

字符串缩进

第三个参数用于控制结果中的缩进和空白符,如果这个参数是一个数值,那么它表示每个级别缩进的空格数,比如:

var meJSON = JSON.stringify(me, process, 4)
undefined
meJSON
"{
    "name": "Sue",
    "age": 18
}"

*注意:

只要传入了缩进数,结果就会包含换行符,因为只缩进却不换行没什么意义。

最大缩进为10,如果超过10, 转换为10

如果第三个参数是一个字符串,那么将使用这个字符串作为缩进,这个字符串可以是制表符或其他任意字符,如果超过10位,则仅前10位有效,比如:

var meJSON = JSON.stringify(me, process, "	")
meJSON
"{
    "name": "Sue",
    "age": 18
}"
var meJSON = JSON.stringify(me, process, "****")
meJSON
"{
****"name": "Sue",
****"age": 18
}"

toJSON

当需要为某种对象添加自定义的序列化方法时,可以给对象定义toJSON()方法,比如:

Person.prototype.toJSON = function() {
    return this.name;
}
var me = new Person("sue", 25, ["girl", "1024", "Beauty"])
JSON.stringify(me, process, "	")
// ""sue""

上述例子中,我们在Person的原型中添加了toJSON方法,发现调用JSON.stringify时,只序列化了name属性。
序列化的内部顺序如下:
No. 1 如果存在toJSON(),而且它能返回有效的值,则调用它,否则,返回对象本身
No. 2 如果提供了过滤器参数,则基于第一步返回的值调用过滤器
No. 3 序列化第二步的返回值
No. 4 如果提供了缩进,则格式化第三步的返回值

parse 选项

JSON.parse()可以接收第二个参数,这个参数是一个还原函数,将在每个键值对上调用,这个函数接收两个参数,分别是键和值,返回处理过的值,比如:

var birth = new Date(1993, 10, 24)
JSON.stringify(birth)
// ""1993-11-23T16:00:00.000Z""
var birthJSON = JSON.stringify(birth)
var birthCopy = JSON.parse(birthJSON, function(key, value) {
    return new Date(value)
})
birthCopy.getFullYear()
// 1993

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/94770.html

相关文章

  • JavaScriptJSON 和 JS 对象

    摘要:独立于语言和平台,解析器和库支持许多不同的编程语言。数据转换数据转换为对象解析器函数创建包含语法的字符串使用解析器,解析文本并生成对象使用函数时,必须为传入的数据参数添加括号,否则会报语法错误。 区别 JSON(JavaScript Object Notation)仅仅是一种数据格式(或者叫数据形式)。数据格式其实就是一种规范,按照这种规范来存诸和交换数据。就好像 XML 格式一样。 ...

    Miracle 评论0 收藏0
  • 5分钟了解JSON那些事儿

    摘要:简介是对象表示法的缩写是一种数据格式而不是一种编程语言用来表示结构化数据是的一个严格子集并不从属于很多编程语言都可以用数据格式语法语法可以表示以下三种类型的值简单值字符串数值布尔值但是不支持对象数组不支持变量函数对象实例简单值字符串数字布尔 JSON 简介 JSON是JavaScript Object Notation(JavaScript对象表示法)的缩写 JSON是一种数据格式,...

    ad6623 评论0 收藏0
  • JavaScript对象和JSON

    摘要:,指的对象表示法,它本身是个字符串,是一种数据交换格式,并非对象。字符串必须使用双引号表示,不能使用单引号。数组或对象最后一个成员的后面,不能有逗号。不合法的会在解析成对象时,出现错误。替代方法对象下虽然提供了完整的字符串和对象的转换方法。 JSON(JavaScript Object Notation),指JavaScript的对象表示法,它本身是个字符串,是一种数据交换格式,并非对...

    wuyumin 评论0 收藏0
  • 高程3总结#第20章JSON

    摘要:语法语法可以表示三种类型的值简单值使用与相同的语法,可以在中表示字符串数值布尔值和。对象对象作为一种复杂数据类型,表示的是一组无序的键值对儿。如果字符串长度超过了个,结果中将只出现前个字符。 JSON 语法 JSON语法可以表示三种类型的值 简单值:使用与 JavaScript 相同的语法,可以在 JSON 中表示字符串、数值、布尔值和 null 。但 JSON 不支持 JavaS...

    Hwg 评论0 收藏0
  • 【快速入门系列】深入浅出JSON

    摘要:布尔值和也是有效的形式。同一个对象中绝对不应该出现两个同名属性。序列化选项还可以接受两个参数,用于指定以不同方式序列化对象。当传入了有效缩进参数值,结果字符串就会包含换行符。对第步返回的每个值进行相应的序列化。 前言 JSON(JavaScript Object Notation,JavaScript对象表示法)是JavaScript的一个严格的子集,利用了JavaScript中的一些...

    liangdas 评论0 收藏0
  • JavaScript JSON——“语法、解析与序列化”的注意要点

    摘要:对象对象作为一种复杂的数据类型,表示的是一组有序的键值对。解析与序列化对象流行的最主要的原因是因为数据结构可以解析为的对象。为了改变序列化对象的结果,函数返回值就是相应键的值。否则按照默认顺序执行序列化。 语法 JSON可以表示一下三种类型的值: 简单值:使用与js相同的语法可以在json中表示字符串、数值、布尔值和null。但是json不支持js的undefined。 对象:对象作...

    琛h。 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<