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 相关文章推荐
不能再简单的无闪刷新验证码原理很简单
Nov 05 Javascript
Jquery操作Select 简单方便 一个js插件搞定
Nov 12 Javascript
用XMLDOM和ADODB.Stream实现base64编码解码实现代码
Nov 28 Javascript
jquery如何把参数列严格转换成数组实现思路
Apr 01 Javascript
JavaScript实现弹出子窗口并传值给父窗口
Dec 18 Javascript
JavaScript实现MIPS乘法模拟的方法
Apr 17 Javascript
Jquery attr()方法 属性赋值和属性获取详解
Apr 15 Javascript
vue-router 中router-view不能渲染的解决方法
May 23 Javascript
Easyui在treegrid添加控件的实现方法
Jun 23 Javascript
关于layui toolbar和template的结合使用方法
Sep 19 Javascript
js实现动态时钟
Mar 12 Javascript
js实现随机点名功能
Dec 23 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
linux系统下php安装mbstring扩展的二种方法
2014/01/20 PHP
PHP Filter过滤器全面解析
2016/08/09 PHP
thinkPHP框架实现的短信接口验证码功能示例
2018/06/20 PHP
PHP封装的mysqli数据库操作类示例
2019/02/16 PHP
jQuery 性能优化指南(3)
2009/05/21 Javascript
JS数组去重与取重的示例代码
2014/01/24 Javascript
鼠标拖拽移动子窗体的JS实现
2014/02/25 Javascript
jquery京东商城双11焦点图多图广告特效代码分享
2015/09/06 Javascript
jquery 表单验证之通过 class验证表单不为空
2015/11/02 Javascript
jquery html动态添加的元素绑定事件详解
2016/05/24 Javascript
Angular2 (RC5) 路由与导航详解
2016/09/21 Javascript
AngularJS入门教程之数据绑定用法示例
2016/11/01 Javascript
JavaScript如何实现图片懒加载(lazyload) 提高用户体验(增强版)
2016/11/30 Javascript
javascript浏览器用户代理检测脚本实现方法
2017/10/27 Javascript
利用vue+elementUI实现部分引入组件的方法详解
2017/11/22 Javascript
微信小程序wepy框架笔记小结
2018/08/08 Javascript
layer.confirm取消按钮绑定事件的方法
2018/08/17 Javascript
webpack的CSS加载器的使用
2018/09/11 Javascript
Python深入学习之对象的属性
2014/08/31 Python
Python 使用requests模块发送GET和POST请求的实现代码
2016/09/21 Python
Python实现PS图像抽象画风效果的方法
2018/01/23 Python
Python后台开发Django会话控制的实现
2019/04/15 Python
详解python tcp编程
2020/08/24 Python
Melissa鞋马来西亚官方网站:MDreams马来西亚
2018/04/05 全球购物
运行时异常与一般异常有何异同?
2014/01/05 面试题
OLEDBConnection和SQLConnection有什么区别
2013/05/31 面试题
编写一个 C 函数,该函数在一个字符串中找到可能的最长的子字符串,且该字符串是由同一字符组成的
2015/07/23 面试题
医院护士的求职信范文
2013/12/26 职场文书
公司部门司机岗位职责
2014/01/03 职场文书
秋季婚礼证婚词
2014/01/11 职场文书
优秀女职工事迹材料
2014/02/06 职场文书
信用卡工资证明范本
2014/10/17 职场文书
催款通知书范文
2015/04/17 职场文书
肖申克的救赎观后感
2015/06/02 职场文书
CentOS下安装Jenkins的完整步骤
2022/04/07 Servers
HttpClient实现文件上传功能
2022/08/14 Java/Android