js 解析 JSON 数据简单示例


Posted in Javascript onApril 21, 2020

本文实例讲述了js 解析 JSON 数据。分享给大家供大家参考,具体如下:

JSON 数据如下:

{
  "name": "mkyong",
  "age": 30,
  "address": {
    "streetAddress": "88 8nd Street",
    "city": "New York"
  },
  "phoneNumber": [
    {
      "type": "home",
      "number": "111 111-1111"
    },
    {
      "type": "fax",
      "number": "222 222-2222"
    }
  ]
}

要在JavaScript中访问JSON对象,使用 JSON.parse() 解析它,并通过“.”或“[]”访问。

JS 代码如下:

<script>
    var data = '{"name": "mkyong","age": 30,"address": {"streetAddress": "88 8nd Street","city": "New York"},"phoneNumber": [{"type": "home","number": "111 111-1111"},{"type": "fax","number": "222 222-2222"}]}';

  var json = JSON.parse(data);
      
  console.log(json["name"]); //mkyong
  console.log(json.name); //mkyong
  
  console.log(json.address.streetAddress); //88 8nd Street
  console.log(json["address"].city); //New York
      
  console.log(json.phoneNumber[0].number); //111 111-1111
  console.log(json.phoneNumber[1].type); //fax
      
  console.log(json.phoneNumber.number); //undefined
</script>

运行结果:

js 解析 JSON 数据简单示例

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

Javascript 相关文章推荐
jQuery .tmpl(), .template()学习资料小结
Jul 18 Javascript
Jquery实现网页跳转或用命令打开指定网页的解决方法
Jul 09 Javascript
js中arguments,caller,callee,apply的用法小结
Jan 28 Javascript
探讨js字符串数组拼接的性能问题
Oct 11 Javascript
js对字符的验证方法汇总
Feb 04 Javascript
Node.js使用gm拼装sprite图片
Jul 04 Javascript
JS实现unicode和UTF-8之间的互相转换互转
Jul 05 Javascript
微信小程序报错:this.setData is not a function的解决办法
Sep 27 Javascript
微信小程序保存多张图片的实现方法
Mar 05 Javascript
详解js中let与var声明变量的区别
Apr 05 Javascript
WebSocket的简单介绍及应用
May 23 Javascript
JavaScript严格模式不支持八进制的问题讲解
Nov 07 Javascript
react 原生实现头像滚动播放的示例
Apr 21 #Javascript
解决angular 使用原生拖拽页面卡顿及表单控件输入延迟问题
Apr 21 #Javascript
javascript设计模式 ? 策略模式原理与用法实例分析
Apr 21 #Javascript
javascript设计模式 ? 备忘录模式原理与用法实例分析
Apr 21 #Javascript
VUE+elementui组件在table-cell单元格中绘制微型echarts图
Apr 20 #Javascript
Vue的全局过滤器和私有过滤器的实现
Apr 20 #Javascript
深入浅析JavaScript中的in关键字和for-in循环
Apr 20 #Javascript
You might like
php获取文件后缀的9种方法
2016/03/22 PHP
OAuth认证协议中的HMACSHA1加密算法(实例)
2017/10/25 PHP
Javascript判断对象是否相等实现代码
2013/03/18 Javascript
JS实现标签页效果(配合css)
2013/04/03 Javascript
js对图片base64编码字符串进行解码并输出图像示例
2014/03/17 Javascript
js实现弹出窗口、页面变成灰色并不可操作的例子分享
2014/05/10 Javascript
实例讲解JQuery中this和$(this)区别
2014/12/08 Javascript
node.js+express制作网页计算器
2016/01/17 Javascript
使用Bootstrap框架制作查询页面的界面实例代码
2016/05/27 Javascript
JS实现的相册图片左右滚动完整实例
2016/11/23 Javascript
JS开发中百度地图+城市联动实现实时触发查询地址功能
2017/04/13 Javascript
uni-app微信小程序登录并使用vuex存储登录状态的思路详解
2019/11/04 Javascript
Vue2.0 实现页面缓存和不缓存的方式
2019/11/12 Javascript
javaScript 实现重复输出给定的字符串的常用方法小结
2020/02/20 Javascript
Vue this.$router.push(参数)实现页面跳转操作
2020/09/09 Javascript
ES5和ES6中类的区别总结
2020/12/21 Javascript
Python实现全局变量的两个解决方法
2014/07/03 Python
Python中asyncore的用法实例
2014/09/29 Python
低版本中Python除法运算小技巧
2015/04/05 Python
Python自动化测试ConfigParser模块读写配置文件
2016/08/15 Python
Python中easy_install 和 pip 的安装及使用
2017/06/05 Python
Python之re操作方法(详解)
2017/06/14 Python
Python实现按照指定要求逆序输出一个数字的方法
2018/04/19 Python
Python 中的参数传递、返回值、浅拷贝、深拷贝
2019/06/25 Python
python 实现一个反向单位矩阵示例
2019/11/29 Python
python、PyTorch图像读取与numpy转换实例
2020/01/13 Python
使用Tensorflow实现可视化中间层和卷积层
2020/01/24 Python
python pandas dataframe 去重函数的具体使用
2020/07/20 Python
python根据用户需求输入想爬取的内容及页数爬取图片方法详解
2020/08/03 Python
python+selenium实现12306模拟登录的步骤
2021/01/21 Python
有机婴儿毛毯和衣服:Monica + Andy
2020/03/01 全球购物
我爱我家教学反思
2014/05/01 职场文书
效能风暴心得体会
2014/09/04 职场文书
药店采购员岗位职责
2014/09/30 职场文书
培训通知书模板
2015/04/17 职场文书
写给女朋友的保证书
2015/05/09 职场文书