实例详解JSON取值(key是中文或者数字)方式


Posted in Javascript onAugust 24, 2017

JSON取值(key是中文或者数字)方式详解

先准备一个json对象用于演示

var json = {'name':'zhangsan', '年龄':23, 404:'你可能迷路了'};

1.使用JS中with关键字

with(json) {
  console.log(name);//输出:zhangsan
  console.log(年龄);//输出:23
  console.log(404);//输出:404,用这种方法读取key是数字的属性,有问题
}

2.最常见的传统的读取key

console.log(json.name);//输出:zhangsan
//key是中文也是支持的
console.log(json.年龄);//输出:23
//key是Number类型或者String类型的数字都不能这么读取
console.log(json.404);//报错

3.通用万能型:json['key']

console.log(json['name']);/输出:zhangsan
console.log(json['年龄']);//输出:23
console.log(json['404']);//输出:你可能迷路了
json[key]
console.log(json[name]);/输出:undefinded
console.log(json[年龄]);//报错
console.log(json[404]);//输出:你可能迷路了

json处理动态key方式

先准备案例对象

var jsonArr = [
  {"id": "1", "name": "A1"},
  {"id": "2", "name": "A2"},
  {"id": "3", "name": "A3"},
  {"id": "4", "name": "A4"},
  {"id": "5", "name": "A5"}
]

1.如果数据量不大,偶尔查询一次,使用for...in遍历

2.如果数据量大,经常使用,建立查找表提升性能

//创建一个查找表函数
function createLookMap(field) {
  var map = {};//创建一个空的json对象
  for (var i = 0; i < jsonArr.length; i++) {
    var value = jsonArr[i];//将数组中的元素作为json对象的值
    var key = value[field];//选取一个属性作为新的json对象的key
    map[key] = value;
  }
  return map;
}

总结

以上所述是小编给大家介绍的实例详解JSON取值(key是中文或者数字)方式,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
JavaScript window.document的属性、方法和事件小结
Oct 24 Javascript
javascript中直接写php代码的方法
Jul 31 Javascript
使用phantomjs进行网页抓取的实现代码
Sep 29 Javascript
使用jquery插件qrcode生成二维码
Oct 22 Javascript
深入浅析javascript中的作用域(推荐)
Jul 19 Javascript
JS图片等比例缩放方法完整示例
Aug 03 Javascript
jquery横向纵向鼠标滚轮全屏切换
Feb 27 Javascript
JavaScript函数柯里化原理与用法分析
Mar 31 Javascript
react+redux的升级版todoList的实现
Dec 18 Javascript
解决vue中对象属性改变视图不更新的问题
Feb 23 Javascript
Vue结合Video.js播放m3u8视频流的方法示例
May 04 Javascript
vue过滤器用法实例分析
Mar 15 Javascript
JSON创建键值对(key是中文或者数字)方式详解
Aug 24 #Javascript
使用jquery+iframe做一个ajax上传效果(实例)
Aug 24 #jQuery
webpack学习笔记之优化缓存、合并、懒加载
Aug 24 #Javascript
基于JavaScript实现新增内容滚动播放效果附完整代码
Aug 24 #Javascript
快速理解 JavaScript 中的 LHS 和 RHS 查询的用法
Aug 24 #Javascript
vue不通过路由直接获取url中参数的方法示例
Aug 24 #Javascript
VueJS 集成 Medium Editor的示例代码 (自定义编辑器按钮)
Aug 24 #Javascript
You might like
索尼SONY ICF-SW7600GR电路分析与改良
2021/03/02 无线电
php中DOMDocument简单用法示例代码(XML创建、添加、删除、修改)
2010/12/19 PHP
PHP时间函数使用详解
2019/03/21 PHP
jQuery formValidator表单验证插件开源了 含API帮助、源码、示例
2008/08/14 Javascript
多浏览器支持的右下角浮动窗口
2010/04/01 Javascript
javascript中最常用的继承模式 组合继承
2010/08/12 Javascript
javaScript 页面自动加载事件详解
2014/02/10 Javascript
js动态创建上传表单通过iframe模拟Ajax实现无刷新
2014/02/20 Javascript
JS清空多文本框、文本域示例代码
2014/02/24 Javascript
一个简单的jQuery计算器实现了连续计算功能
2014/07/21 Javascript
jquery实现个人中心导航菜单效果和美观都非常不错
2014/09/02 Javascript
jQuery支持添加事件的日历特效代码分享(3种样式)
2015/08/24 Javascript
javascript实现加载xml文件的方法
2015/11/24 Javascript
详解JavaScript中this的指向问题
2017/01/20 Javascript
Vue-Router2.X多种路由实现方式总结
2018/02/09 Javascript
JS从非数组对象转数组的方法小结
2018/03/26 Javascript
工作中常用到的ES6语法
2018/09/04 Javascript
JavaScript学习笔记之数组基本操作示例
2019/01/09 Javascript
python简单获取数组元素个数的方法
2015/07/13 Python
Python字符串、元组、列表、字典互相转换的方法
2016/01/23 Python
python爬虫面试宝典(常见问题)
2018/03/02 Python
详解python tkinter教程-事件绑定
2019/03/28 Python
简单了解python单例模式的几种写法
2019/07/01 Python
django 做 migrate 时 表已存在的处理方法
2019/08/31 Python
Python select及selectors模块概念用法详解
2020/06/22 Python
Pytorch mask-rcnn 实现细节分享
2020/06/24 Python
如何利用python 读取配置文件
2021/01/06 Python
利用CSS3实现折角效果实例源码
2016/09/28 HTML / CSS
PHP开发工程师面试问题集锦
2012/11/01 面试题
服务员岗位职责
2014/01/29 职场文书
医学求职自荐信
2014/06/21 职场文书
煤矿安全知识竞赛活动总结
2014/07/07 职场文书
社区六一儿童节活动总结
2015/02/11 职场文书
2015年语文教研组工作总结
2015/05/23 职场文书
2015年暑期社会实践方案
2015/07/14 职场文书
导游词之清晏园
2019/11/22 职场文书