JSON与JS的区别以及转换

摘要:
JSON一种简单的数据格式,比xml更轻巧。JSON是JavaScript原生格式,这意味着在JavaScript中处理JSON数据不需要任何特殊的API或工具包。JSON的规则很简单:对象是一个无序的“名称/值”对集合。它是一种严格的js对象的格式,JSON的属性名必须有双引号,如果值是字符串,也必须是双引号;可以这么说:JSON对象就是一种严格的JS对象,但是JS对象不一定是JSON对象。JSON与JS转换说的是JSON字符串与JSON对象的转换。

JSON是什么?(JSON和JavaScript对象有什么区别?)如何把JS对象转化为JSON字符串,又如何把JSON字符串转化为JavaScript对象?

JSON (JavaScript Object Notation)一种简单的数据格式,比xml更轻巧。 JSON 是 JavaScript 原生格式, 这意味着在JavaScript 中处理 JSON 数据不需要任何特殊的 API 或工具包。JSON的规则很简单: 对象是一个无序的“名称/值”对集合。一个对象以“{”(左括号)开始,“}”(右括号)结束。每个“名称”后跟一个“:”(冒号);“名称/值”对之间 使用“,”(逗号)分隔。

它是一种严格的js对象的格式,JSON的属性名必须有双引号,如果值是字符串,也必须是双引号

可以这么说:JSON对象就是一种严格的JS对象,但是JS对象不一定是JSON对象。(JS对象的键可以带单引号,双引号或者不带引号,JSON键也必须带双引号)。

JSON与JS转换说的是JSON字符串与JSON对象(也就是JS对象)的转换。

JSON字符串通过eval可以转换为JSON对象(也就是一种JS对象)。

JSON字符串将JSON对象装成字符串: '{"width":100,"height":200,"name":"rose"}'

JSON只是一种数据格式(或者叫数据形式);

<script>
varobj2={};//这只是JS对象
varobj3={100,height:200};/*这跟JSON就更不沾边了,只是JS的 对象 */
varobj4={'width':100,'height':200};/*这跟JSON就更不沾边了,只是JS的对象 */
varobj5={"width":100,"height":200,"name":"rose"}; /*我们可以把这个称做:JSON格式的JavaScript对象 */
varstr1='{"width":100,"height":200,"name":"rose"}';/*我们可以把这个称做:JSON格式的字符串 */
vara=[
 {"width":100,"height":200,"name":"rose"},
 {"width":100,"height":200,"name":"rose"},
 {"width":100,"height":200,"name":"rose"},
 ];
 /*这个叫JSON格式的数组,是JSON的稍复杂一点的形式 */
varstr2='['+
 '{"width":100,"height":200,"name":"rose"},'+
 '{"width":100,"height":200,"name":"rose"},'+
 '{"width":100,"height":200,"name":"rose"},'+
 ']';
 /*这个叫稍复杂一点的JSON格式的字符串 */
</script>

JSON和JS对象区别对比表

JSON与JS的区别以及转换第1张

总而言之你可以理解为JSON是JS下的一种数据格式,他从属于JS,并且在处理JSON数据时可直接使用JS内置API

JSON实例

{
"sites": [
{ "name":"菜鸟教程" , "url":"www.runoob.com" }, 
{ "name":"google" , "url":"www.google.com" }, 
{ "name":"微博" , "url":"www.weibo.com" }
]
}

JSON - 转换为 JavaScript 对象

JSON 文本格式在语法上与创建 JavaScript 对象的代码相同。

由于这种相似性,无需解析器,JavaScript 程序能够使用内建的 eval() 函数,用 JSON 数据来生成原生的 JavaScript 对象

---------------------------------JSON对象(也是一种JS对象)-----------------------------------

下面这个是JSON对象:

键必须为双引号

var json={
                "key1":"value1",
                "address":{"name":"北京","code":205},
                "chengji":[{"name":"物理","chengji":90},{"name":"数学","chengji":100}]
                }; 
        alert(json.key1);//value1
        alert(json.address.code);//205
        alert(json.chengji[0].name+json.chengji[0].chengji);//物理90

注意:对象格式和数组格式可以互相嵌套

注意:json的key是字符串,且必须是双引号,不能是单引号

json的value是Object

json的解析:

json是js的原生内容,也就意味着js可以直接取出json对象中的数据

----------------------------------------JSON语法格式的JS对象---------------------------------

键可以带单引号、双引号或不带引号

//JSON语法的JS对象
            var p = {
                'name': '张三',
                "sex": '男',
                age: 20,
                info: function() {
                    alert("这是函数格式!");
                },
                son: {
                    name: '张三儿子'
                }
            }
            alert(p);    
            p.info();
            alert(p.son.name);

例子:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <head>
        <title>json01</title>
        <meta http-equiv="keywords"content="keyword1,keyword2,keyword3">
        <meta http-equiv="description"content="this is my page">
        <meta http-equiv="content-type"content="text/html; charset=UTF-8">
        <!--<link rel="stylesheet" type="text/css" href="http://t.zoukankan.com/styles.css">-->
    </head>
    <body>
        <ul>
            <li id="bj"name="beijing">北京</li>
        </ul>
    </body>
    <script language="JavaScript">
        //JSON格式的JS对象(可以直接取值)
        vardata ={
            "name": "runoob",
            "alexa": 10000,
            "site": "www.runoob.com"
        };
        document.write(data.name + "<br/>");
        //将JSON字符串转为JS对象的方法一
        varobj =JSON.parse('{ "name":"runoob", "alexa":10000, "site":"www.runoob.com" }');
        document.write(obj.name + "<br/>");
        //将JSON字符串转为JS对象的方法二
        //JSON格式的字符串
        vartest1 = '{"name":"qlq","age":25}';
        varobj2 =eval("(" +test1 + ")"); //必须带圆括号
document.write(obj2.name + "<br/>" +obj2.age);
        //JS对象转换为JSON字符串
        varjson1 =JSON.stringify(test1);
        document.write("<br/>" +json1);
    </script>
</html>

JSON与JS的区别以及转换第2张

免责声明:文章转载自《JSON与JS的区别以及转换》仅用于学习参考。如对内容有疑问,请及时联系本站处理。

上篇c语言----实战植物大战僵尸Oracle存储过程java 调用下篇

宿迁高防,2C2G15M,22元/月;香港BGP,2C5G5M,25元/月 雨云优惠码:MjYwNzM=

相关文章

js常用代码

1.字符串截取substr(str,length)返回从指定位置开始,截取length长度的子字符串。substring(start,end)返回从start开始到end结束的字符串。end不写就到结尾。区别,前者截取长度,后者截取位置 2.页面跳转window.history.back();返回的是页面的状态,有可能删除的数据依然存在,需要locatio...

js中的DOM节点操作---增删改查

查找节点 getElementById(),getElementsByClassName(),getElementsByTagName() querySelector(),querySelectorAll() 创建节点 createElement():创建一个dom节点 示例代码 document.createElement('div'); 插入节点 a...

js 处理 xml对象和String字符串之间的转换

/** * xml工具 * xml对象和String字符串之间的转换 * ///convert string to xml object (将字符串转换成xml对象) function string2XML(xmlString) { //所有浏览器统一用这种方式处理(因为高版本的浏览器都支持) let parser = new DOM...

mysql 判断null 和 空字符串

mysql 判断null 和 空字符串 1.在mysql中null 不能使用任何运算符与其他字段或者变量(函数、存储过程)进行运算。若使用运算数据就可能会有问题。 2.对null 的判断: 创建一个user表:id 主健 name 可以为空 select * from user; insert into user values('33',null); #...

js table的笔记,实现添加 td,实现搜索功能

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <title>Examples</title&...

js 调用微信浏览器内置方法,启动支付

$.post("{php echo app_url('pay/cash')}",{orderno:orderno,paytype:paytype},function(m){ //todo: 跳转到微信支付,获取支付的相关信息 if(!m.errno){...