程序员经验分享-hwhale

西瓜的JSON笔记

2023-05-16

1.JSON是什么

JSON 指的是 JavaScript 对象表示法（JavaScript Object Notation/java,，脚本，对象，注释）JSON的特点：JSON 使用 Javascript语法来描述数据对象，但是 JSON 仍然独立于语言和平台。JSON 解析器和 JSON 库支持许多不同的编程语言。 目前非常多的动态（PHP，JSP，.NET）编程语言都支持JSON

2.JSON与XMl的相似之处

JSON 具有层级结构（值中存在值）

JSON 可通过 JavaScript 进行解析

JSON 数据可使用 AJAX 进行传输

（AJAX即“Asynchronous Javascript And XML”（异步JavaScript和XML），是指一种创建交互式网页应用的网页开发技术。）

3.JSON与XMl的不同之处

读写的速度更快

使用数组

不使用保留字

4.JSON语法规则

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

4.1数据在名称/值对中

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

名称/值对包括字段名称（在双引号中），后面写一个冒号，然后是值：

"name" : "一颗西瓜"

4.1.2JSON 值可以是：

数字（整数或浮点数）

字符串（在双引号中）

逻辑值（true 或 false）

数组（在中括号中）

对象（在大括号中）

Null

4.1.3JSON 对象在大括号（{}）中书写：

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

{ "name":"菜鸟教程" , "url":"www.runoob.com" }

4.1.4JSON 数组在中括号中书写：

数组可包含多个对象：

{ "sites":[ { "name":"菜鸟教程" ,

 "url":"www.runoob.com" },

{ "name":"google" ,

 "url":"www.google.com" },

{ "name":"微博" ,

"url":"www.weibo.com" } ] }

在上面的例子中，对象 "sites" 是包含三个对象的数组。每个对象代表一条关于某个网站（name、url）的记录。

4.15JSON 布尔值可以是true或者false：

{ "flag":true }

4.16JSON 可以设置 null 值：

{ "runoob":null }

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

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

实例

var sites =[ { "name":"runoob" ,

"url":"www.runoob.com" },

{ "name":"google" ,"url":"www.google.com" },

{ "name":"微博" ,"url":"www.weibo.com" } ];

可以像这样访问 JavaScript 对象数组中的第一项（索引从 0 开始）：

sites[0].name;

返回的内容是：

runoob

可以像这样修改数据：

sites[0].name="菜鸟教程";

 

4.18JSON 文件的文件类型是 ".json"

JSON 文本的 MIME 类型是 "application/json"

 

 

4.2数据由逗号分隔

4.3大括号保存对象

4.4中括号保存数组

JSON 对象中的数组

对象属性的值可以是一个数组：

实例

{ "name":"网站","num":3,"sites":[ "Google","Runoob","Taobao" ] }

我们可以使用索引值来访问数组：

实例

x =myObj.sites[0];


循环数组

你可以使用 for-in 来访问数组：

实例

for (i in myObj.sites) { x +=myObj.sites[i] +"<br>";}


你也可以使用 for 循环：

实例

for (i =0;i <myObj.sites.length;i++) { x +=myObj.sites[i] +"<br>";}


嵌套 JSON 对象中的数组

JSON 对象中数组可以包含另外一个数组，或者另外一个 JSON 对象：

实例

myObj ={ "name":"网站","num":3,"sites":[ { "name":"Google","info":[ "Android","Google 搜索","Google 翻译" ] },{ "name":"Runoob","info":[ "菜鸟教程","菜鸟工具","菜鸟微信" ] },{ "name":"Taobao","info":[ "淘宝","网购" ] } ] }

我们可以使用 for-in 来循环访问每个数组：

实例

for (i in myObj.sites) { x +="<h1>" +myObj.sites[i].name +"</h1>";for (j in myObj.sites[i].info) { x +=myObj.sites[i].info[j] +"<br>";} }


 

修改数组值

你可以使用索引值来修改数组值：

实例

myObj.sites[1] ="Github";


 

删除数组元素

我们可以使用 delete 关键字来删除数组元素：

实例

delete myObj.sites[1];

JSON.parse()

JSON 通常用于与服务端交换数据。

在接收服务器数据时一般是字符串。

我们可以使用 JSON.parse() 方法将数据转换为 JavaScript 对象。

语法

JSON.parse(text[, reviver])

参数说明：

· text:必需，一个有效的 JSON 字符串。

· reviver: 可选，一个转换结果的函数， 将为对象的每个成员调用此函数。

 

JSON 解析实例

例如我们从服务器接收了以下数据：

{ "name":"runoob","alexa":10000,"site":"www.runoob.com" }

我们使用 JSON.parse() 方法处理以上数据，将其转换为 JavaScript 对象：

var obj =JSON.parse('{ "name":"runoob", "alexa":10000, "site":"www.runoob.com" }');

解析前要确保你的数据是标准的 JSON 格式，否则会解析出错。

你可以使用我们的在线工具检测：https://c.runoob.com/front-end/53。

解析完成后，我们就可以在网页上使用 JSON 数据了：

实例

<p id="demo"></p> <script> var obj = JSON.parse('{ "name":"runoob", "alexa":10000, "site":"www.runoob.com" }'); document.getElementById("demo").innerHTML = obj.name + "：" + obj.site;</script>


 

从服务端接收 JSON 数据

我们可以使用 AJAX 从服务器请求 JSON 数据，并解析为 JavaScript 对象。

实例

var xmlhttp =new XMLHttpRequest();xmlhttp.onreadystatechange =function() { if (this.readyState ==4 &&this.status ==200) { myObj =JSON.parse(this.responseText);document.getElementById("demo").innerHTML =myObj.name;} };xmlhttp.open("GET","/try/ajax/json_demo.txt",true);xmlhttp.send();


查看服务端数据： json_demo.txt

 

从服务端接收数组的 JSON 数据

如果从服务端接收的是数组的 JSON 数据，则 JSON.parse 会将其转换为 JavaScript 数组：

实例

var xmlhttp =new XMLHttpRequest();xmlhttp.onreadystatechange =function() { if (this.readyState ==4 &&this.status ==200) { myArr =JSON.parse(this.responseText);document.getElementById("demo").innerHTML =myArr[1];} };xmlhttp.open("GET","/try/ajax/json_demo_array.txt",true);xmlhttp.send();


查看服务端数据： json_demo_array.txt

 

异常

解析数据

JSON 不能存储 Date 对象。

如果你需要存储 Date 对象，需要将其转换为字符串。

之后再将字符串转换为 Date 对象。

实例

var text ='{ "name":"Runoob", "initDate":"2013-12-14", "site":"www.runoob.com"}';var obj =JSON.parse(text);obj.initDate =new Date(obj.initDate);document.getElementById("demo").innerHTML =obj.name +"创建日期:" +obj.initDate;


我们可以启用 JSON.parse 的第二个参数 reviver，一个转换结果的函数，对象的每个成员调用此函数。

实例

var text ='{ "name":"Runoob", "initDate":"2013-12-14", "site":"www.runoob.com"}';var obj =JSON.parse(text,function (key,value) { if (key =="initDate") { return new Date(value);} else { return value;}});document.getElementById("demo").innerHTML =obj.name +"创建日期：" +obj.initDate;


 

解析函数

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

实例

var text ='{ "name":"Runoob", "alexa":"function () {return 10000;}", "site":"www.runoob.com"}';var obj =JSON.parse(text);obj.alexa =eval("(" +obj.alexa +")");document.getElementById("demo").innerHTML =obj.name +" Alexa 排名：" +obj.alexa();


不建议在 JSON 中使用函数。

 

浏览器支持

主流浏览器都支持 JSON.parse() 函数：

· Firefox 3.5

· Internet Explorer 8

· Chrome

· Opera 10

· Safari 4

JSON.stringify()

JSON 通常用于与服务端交换数据。

在向服务器发送数据时一般是字符串。

我们可以使用 JSON.stringify() 方法将 JavaScript 对象转换为字符串。

语法

JSON.stringify(value[, replacer[, space]])

参数说明：

· value:

必需， 一个有效的 JSON 字符串。

· 

· replacer:

可选。用于转换结果的函数或数组。

· 

如果 replacer 为函数，则 JSON.stringify 将调用该函数，并传入每个成员的键和值。使用返回值而不是原始值。如果此函数返回 undefined，则排除成员。根对象的键是一个空字符串：""。

· 

如果 replacer 是一个数组，则仅转换该数组中具有键值的成员。成员的转换顺序与键在数组中的顺序一样。当 value 参数也为数组时，将忽略 replacer 数组。

· 

· space:

可选，文本添加缩进、空格和换行符，如果 space 是一个数字，则返回值文本在每个级别缩进指定数目的空格，如果 space 大于 10，则文本缩进 10 个空格。space 有可以使用非数字，如：\t。

· 

 

JavaScript 对象转换

例如我们向服务器发送以下数据：

var obj ={ "name":"runoob","alexa":10000,"site":"www.runoob.com"};

我们使用 JSON.stringify() 方法处理以上数据，将其转换为字符串：

var myJSON =JSON.stringify(obj);

myJSON 为字符串。

我们可以将 myJSON 发送到服务器：

实例

var obj ={ "name":"runoob","alexa":10000,"site":"www.runoob.com"};var myJSON =JSON.stringify(obj);document.getElementById("demo").innerHTML =myJSON;


 

JavaScript 数组转换

我们也可以将 JavaScript 数组转换为 JSON 字符串：

实例

var arr =[ "Google","Runoob","Taobao","Facebook" ];var myJSON =JSON.stringify(arr);

myJSON 为字符串。

我们可以将 myJSON 发送到服务器：

实例

var arr =[ "Google","Runoob","Taobao","Facebook" ];var myJSON =JSON.stringify(arr);document.getElementById("demo").innerHTML =myJSON;


 

异常

解析数据

JSON 不能存储 Date 对象。

JSON.stringify() 会将所有日期转换为字符串。

实例

var obj ={ "name":"Runoob","initDate":new Date(),"site":"www.runoob.com"};var myJSON =JSON.stringify(obj);document.getElementById("demo").innerHTML =myJSON;


之后你可以再将字符串转换为 Date 对象。

 

解析函数

JSON 不允许包含函数，JSON.stringify() 会删除 JavaScript 对象的函数，包括 key 和 value。

实例

var obj ={ "name":"Runoob",

"alexa":function () {return 10000;}, 

"site":"www.runoob.com"}; 

var myJSON =JSON.stringify(obj); 

document.getElementById("demo").innerHTML =myJSON;


我们可以在执行 JSON.stringify() 函数前将函数转换为字符串来避免以上问题的发生：

实例

var obj ={ "name":"Runoob","alexa":function () {return 10000;},"site":"www.runoob.com"};obj.alexa =obj.alexa.toString();var myJSON =JSON.stringify(obj);document.getElementById("demo").innerHTML =myJSON;



本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

json

西瓜的JSON笔记 的相关文章

随机推荐

  • 工作站启动不起来的解决方案

    我是一个运维小白 xff0c 今天遇到了公司工作站启动不起来的情况 工作站是DELL的 xff0c 尝试强制启动了好几次 xff0c 都没有启动起来 拔了电源 xff0c 静置一段时间后 xff0c 再插上电源 xff0c 再启动工作站 x

  • VNC连不上服务器，无法远程控制

    我是在服务器上添加了分帐户 xff0c 然后使用vnc连接 xff0c 遇到了vnc连不上的问题 有好几个问题导致这个原因 xff0c 这里说两个我遇到的 xff1a 第一 xff1a vnc连接失败 xff0c 此时 xff0c 可以试试

  • UCOS III移植到STM32F407过程

    UCOS III移植步骤 第一步 首先打开找到Mirium的官网 找到下载区域 按照MCU制造商来查找 看图 来下载对应的UCOS III系统 由于官方并没有直接对stm32f407系列的移植 所以我们就在官网上找到和stm32f407相近

  • Android 7.0手机打开相机或相册报错解决方案

    原文地址 xff1a http www jianshu com p edec55192944 在android 7 0以上的手机上打开相机 相册会报如下错误 android os FileUriExposedException expose

  • Python爬虫：用BeautifulSoup进行NBA数据爬取

    爬虫主要就是要过滤掉网页中无用的信息 xff0c 抓取网页中有用的信息 一般的爬虫架构为 xff1a 在python爬虫之前先要对网页的结构知识有一定的了解 xff0c 如网页的标签 xff0c 网页的语言等知识 xff0c 推荐去W3Sc

  • Python 不带参数和带参数装饰器

    链接1 xff1a https blog csdn net u010358168 article details 77773199 链接2 xff1a https blog csdn net qq 34788903 article deta

  • VLAN网络支持ipv6的交换机和虚机配置

    VLAN支持ipv6的交换机和虚机配置 前言一 创建VLAN网络并配置交换机1 规划并在OpenStack上创建 VLAN网络2 在交换机上配置VLAN 二 Ubuntu虚机配置1 创建虚机2 在OpenStack上查看port3 登录虚机

  • MyBatis-Plus-Generator 3.5.2 配置详解

    官方用例 所需MAVEN依赖 span class token tag span class token tag span class token punctuation lt span dependencies span span cla

  • 用keras搭建一个简单的一维卷积神经网络

    编程环境 xff1a python 3 6 8 tensorflow 1 12 3 点击下载离线包 matplotlib 3 1 2 numpy 1 17 4 数据集说明 xff1a 我所采用的数据集 xff0c 是我自己构建的一个网络流量

  • java中的编码转换（以utf8和gbk为例）

    在正常javaweb开发中经常会发现字符转换的需求 xff0c 会存在中文字符转换乱码的现象 xff0c 如何解决以及其转换原理我至今懵懵懂懂 xff0c 于是专门写了个测试代码进行尝试 xff0c 总算理清了编码 xff0c 先上结论 x

  • ERROR com.alibaba.druid.pool.DruidDataSource - init datasource error, url jdbcmysql

    部署一个开源项目报错 ERROR com alibaba druid pool DruidDataSource init datasource error url jdbcmysql 很明显是数据库连接错误 但排除一下错误后 xff0c 我

  • KVM下的Windows虚拟机盘符扩容

    今天发现工作站上的一个Windows虚拟机的一个盘符没有空间了 xff0c 需要为其进行扩容 探究过程如下 xff1a 1 确认需要调整的盘符对应的文件 2 关闭虚拟机 3 调整存储文件的大小 打开终端 xff0c 进入文件在所目录 xff

  • IDEA lombok包的@Data注解报错找不到符号

    问题描述 xff1a 工程编译报错 java 找不到符号 问题抽象 定位错误可以发现是getter setter的问题 由于采用了 64 Data注解 xff0c 所以优先考虑是lombok的问题 解决方案 首先排除以下可能 lombok插

  • python配合阿里云域名解析实现DDNS功能

    前置工作 安装阿里模块 pip span class token function install span aliyun python sdk core v3 pip span class token function install s

  • linux开机自启服务简单配置

    使用任意方式在 usr lib systemd system路径下新建一个demo service文件并在其中以如下模板编写内容 span class token punctuation span Unit span class token

  • git取消超过范围大文件并重新提交

    问题报错 remote error File db383b59a623629b36cc62dd3917db21c1375cf0 span class token number 690 93 span MB exceeds span clas

  • 基于pyqt的无边框浏览器

    自己写了个基于pyqt的无边框浏览器 xff0c 可以配合源阅读的web看书 xff0c 自用自取 目录结构 xff1a ui ui webview pycall webview y 环境安装 xff1a pip span class to

  • Pycharm默认输入状态是insert状态，选中文字无法直接输入替换或删除

    最近开始学习python xff0c 使用Pycharm编辑器进行学习过程中却发现 xff1a 打开一个新的py文件 xff0c 我的光标处于加粗状态 xff0c 也就是编程软件经常出现的insert插入编辑模式 xff0c 我就点击了一下

  • 输入字体之间的间隔突然变大了

    额 xff0c 这个问题之前也遇到几次 xff0c 后来莫名其妙变好了 我就没深究 最近写代码又出现了这种情况 就是敲了个快捷键 xff0c 就变成 后来发现是IDE的快捷键和输入法快捷键冲突了 解决方法 xff1a 按一下 shift 4

  • 西瓜的JSON笔记

    1 JSON是什么 JSON 指的是 JavaScript 对象表示法 xff08 J ava S cript O bject N otation java xff0c 脚本 xff0c 对象 xff0c 注释 xff09 JSON的特点

热门标签