博客列表 >JSON小知识大作用

JSON小知识大作用

Serendipity-Ling
Serendipity-Ling原创
2017年12月14日 01:31:25748浏览

  什么是JSON?

JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。它使得人们很容易的进行阅读和编写。同时也方便了机器进行解析和生成。它是基于 JavaScript Programming Language , Standard ECMA-262 3rd Edition - December 1999 的一个子集。 JSON采用完全独立于程序语言的文本格式,但是也使用了类C语言的习惯(包括C, C++, C#, Java, JavaScript, Perl, Python等)。这些特性使JSON成为理想的数据交换语言。(转载自json.cn)

一.json 可将js对象转化为json字符串

var obj = {
      name:'xiaoming',  //字符
      age:18,           //数字
      isMarried:false,  //布尔值
      '':'empty',       //空键名
      sex:undefined,   //undefined
      weight:null,       //null
      getName:function (){   //函数
        return this.name
       }
}

将这个对象转化为json字符串

var objJson = JSON.stringify(obj)
console.log(objJson)
//得到{"name":"xiaoming","age":18,"isMarried":false,"":"empty","weight":null}

json字符串的特点
1.1. 所有属性名必须使用双引号
1.2. 如果属性值为字符串,必须使用双引号进行包装
1.3. 不支持undefined 类型(过滤掉了undefined)
1.4. 不支持属性为函数的方法成员
1.5. 键名允许为空

二. 将js数组转为js字符串

创建一个数组

var arr = ['php', 1, true, null,undefined,'']
//将js数组转为js字符串
var brandJson = JSON.stringify(arr)
console.log(brandJson)
//得到["php",1,true,null,null,""]

json数组字符串的特点:
2.1. 字符串必须使用双引号,这与js对象是一样的
2.2. 除字符串外,支持数值,布尔,null
2.3. 自动将undefined类型的数据转为null
2.4. 支持空元素
2.5. 与js数组一样,也是使用从零开始的数值索引来访问

三. js转换参数介绍

创建js对象

var str = {
    name: 'jack',  
    sex: 'male',   
    salary: 2000,   
    isMarried: true,  
    crime: null,  
    sexual: undefined,  
    myChild: ['熊大','熊二']
}

3.1 有选择性输出

JSON.stringify(str,['name','isMarried'])
//得到{"name":"jack","isMarried":true}

3.2 函数function(property,value),可以将属性的键值依次传入进行处理

var res1 = JSON.stringify(str,function (property,value) {
        switch (property)
        {
            case 'name':
                return value + ' ma'
//            break
            case 'sex':
                return value + '? 我也不确定,你看着办'
            break;
            case 'salary':
                return value + 5000
            break
            case 'isMarried':
                return '其实是骗你的,来者不拒'
            break
            case 'crime':
                return '我和安倍家的女佣拍过片'
            break
            case 'sexual':  //属性值是undefined,但是没有跳过
                return value + '其实我是一个双性恋'
            break
            case 'myChild':
                return value + ',你应该看不到这个啦'
            break
            //最后一定要有default分支,并且必须返回value,否则你看不到正确的结果
            default:
            return value

得到

{"name":"jack ma","sex":"male? 我也不确定,你看着办","salary":7000,
"isMarried":"其实是骗你的,来者不拒","crime":"我和安倍家的女佣拍过片",
"sexual":"undefined其实我是一个双性恋","myChild":"熊大,熊二,你应该看不到这个啦"}

3.3 json数据缩进的空格数量,最大是10

JSON.stringify(str,null,4)
//或者自定义
JSON.stringify(str,null,'****')

3.4 解析json字符串为js对象

//先转为json格式的文本
var jsonText = JSON.stringify(str)
//解析jsonText为js对象
var  jsObj1 =  JSON.parse(jsonText)
//自此jsObj1 就是js对象
//更多的时候我们需要传入第二个参数,就是一个回调,对解析返回的js对象进行处理
var  jsObj2 =  JSON.parse(jsonText,function (key, value) {
    if (key == 'isMarried') {
        return '婚姻状态保密'
    } else {   //一定要有else分支,否则只会返回undefined
        return value
    }
})
console.log(jsObj2)
//得到Object { name: "jack", sex: "male", salary: 2000, isMarried: "婚姻状态保密", 
crime: null, myChild: […] }

3.4  toJSON方法

 var str = {
        name: 'jack',  //其实这不是我的真名
        sex: 'male',   //性别我不是很确定
        salary: 2000,   //工资,如果是$就好了
        isMarried: true,  //是否已婚
        crime: null,  //是否有犯罪前科
        sexual: undefined,  //我的性取向
        myChild: ['熊大','熊二'],
        //添加toJSON方法
        toJSON: function () {
//            return '有我在,你们都别想输出'
            //可以自定义属性的输出格式
//            return this.name+'的性别是:'+this.sex+'工资是'+this.salary
            //toJSON方法还可以输出值undefined的属性
            return '我的性取向是: '+this.sexual
        }
    }

    //输出json数据
    console.log(JSON.stringify(str))
    //得到"我的性取向是: undefined"
    表明toJSON是优先级在这些里面是最高的

3.5 可以使用 for-in 来循环对象的属性

var myObj = { "name":"runoob", "alexa":10000, "site":null };for (x in myObj) {
    document.getElementById("demo").innerHTML += x + "<br>";
    document.getElementById("demo").innerHTML += myObj[x] + "<br>";
}
//for-i 循环
for (var i=0; i<myObj.length; i++){
 x += myObj[i] + '<br>'
 }

前者导出属性,后者导出属性的值

4 可以使用 delete 关键字来删除 JSON 对象的属性(可使用点语法或中括号)

delete myObj.name   = = =  delet myObj["name"]
//得到 {"alexa":10000, "site":null }

5 .1 解析函数

JSON 不允许包含函数,但你可以将函数作为字符串存储,之后再将字符串转换为函数。

var obj = { "name":"php", "alexa":function () {return 10000;}, "site":“php中文网"} 
obj.alexa = obj.alexa.toString();
var text = JSON.stringify(obj);
var obj = JSON.parse(text);
obj.alexa = eval("(" + obj.alexa + ")"); 
document.getElementById("demo").innerHTML = obj.name + " Alexa 排名:" + obj.alexa();
//得到  php Alexa 排名:10000

5.2 eval() 拓展

eval(string)函数可计算某个字符串,并进行其中的js代码

eval("var a=1");     // 声明一个变量a并赋值1。
eval("2+3");         // 执行加运算,并返回运算值。
eval("mytest()");    // 执行mytest()函数。
eval("{b:2}");       // 声明一个对象。
var txt = '{ "sites" : [' +
'{ "name":"php" , "url":"www.php.cn" },' +
'{ "name":"google" , "url":"www.google.com" },' +
'{ "name":"微博" , "url":"www.weibo.com" } ]}';
var obj = eval("("+txt+")")

为什么要 eval 这里要添加 ('('+txt+')') 呢?

原因在于:eval 本身的问题。 由于 json 是以 {} 的方式来开始以及结束的,在 js 中,它会被当成一个语句块来处理,所以必须强制性的将它转换成一种表达式。

加上圆括号的目的是迫使 eval 函数在处理 JavaScript 代码的时候强制将括号内的表达式(expression)转化为对象,而不是作为语句(statement)来执行。举一个例子,例如对象字面量 {},如若不加外层的括号,那么 eval 会将大括号识别为 javascript 代码块的开始和结束标记,那么{}将会被认为是执行了一句空语句。所以下面两个执行结果是不同的:

alert(eval("{}"); // return undefined
alert(eval("({})");// return object[Object]

总结:

JSON 是一个轻量级的数据格式,可以简化表示复杂数据结构的工作量。JSON 使用 JavaScript 语法的子集
* 表示对象、数组、字符串、数值、布尔值和 null。即使 XML 也能表示同样复杂的数据结果,
* 但 JSON 没有那么烦琐,而且在 JavaScript非常方便的使用
*系统定义了一个全局的一个原生JSON 对象,可以用来将
*对象序列化为 JSON 字符串或者将 JSON 数据解析为 JS对象。JSON.stringify()和 JSON.parse()方法
* 分别用来实现上述两项功能。 这两个方法都有一些选项,通过它们可以改变过滤的方式,
* 或者改变序列化的过程。
*原生的 JSON 对象也得到了很多浏览器的支持,几乎支持所有浏览器,大家放心的用吧

声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议