实例详解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 相关文章推荐
Prototype RegExp对象 学习
Jul 19 Javascript
jQuery获取地址栏参数插件(模仿C#)
Oct 26 Javascript
jQuery EasyUI API 中文文档 - ComboBox组合框
Oct 07 Javascript
js怎么判断flash swf文件是否加载完毕
Aug 14 Javascript
基于jQuery实现select下拉选择可输入附源码下载
Feb 03 Javascript
js数组方法reduce经典用法代码分享
Jan 07 Javascript
vue的style绑定background-image的方式和其他变量数据的区别详解
Sep 03 Javascript
详解Vue-axios 设置请求头问题
Dec 06 Javascript
微信小程序 JS动态修改样式的实现方法
Dec 16 Javascript
vue.js实现简单的计算器功能
Feb 22 Javascript
Vue路由 重定向和别名的区别说明
Sep 09 Javascript
微信小程序实现音乐播放页面布局
Dec 11 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
用Apache反向代理设置对外的WWW和文件服务器
2006/10/09 PHP
PHP数组交集的优化代码分析
2011/03/06 PHP
php常用hash加密函数
2014/11/22 PHP
php连接与操作PostgreSQL数据库的方法
2014/12/25 PHP
php判断当前用户已在别处登录的方法
2015/01/06 PHP
PHP正则表达式之捕获组与非捕获组
2015/11/06 PHP
PHP使用ActiveMQ实例
2018/02/05 PHP
24款热门实用的jQuery插件推荐
2014/12/24 Javascript
JavaScript Math.floor方法(对数值向下取整)
2015/01/09 Javascript
JS扩展方法实例分析
2015/04/15 Javascript
再JavaScript的jQuery库中编写动画效果的指南
2015/08/13 Javascript
vue日期组件 支持vue1.0和2.0
2017/01/09 Javascript
JavaScript中transform实现数字翻页效果
2017/03/08 Javascript
angular使用bootstrap方法手动启动的实例代码
2017/07/18 Javascript
用javascript获取任意颜色的更亮或更暗颜色值示例代码
2017/07/21 Javascript
JS Testing Properties 判断属性是否在对象里的方法
2017/10/01 Javascript
Js中使用正则表达式验证输入是否有特殊字符
2018/09/07 Javascript
JavaScript函数定义方法实例详解
2019/03/05 Javascript
jQuery实现的鼠标拖动画矩形框示例【可兼容IE8】
2019/05/17 jQuery
javascript实现导航栏分页效果
2019/06/27 Javascript
Vue v-text指令简单使用方法示例
2019/09/19 Javascript
Python编写检测数据库SA用户的方法
2014/07/11 Python
如何优雅地改进Django中的模板碎片缓存详解
2018/07/04 Python
python实现QQ空间自动点赞功能
2019/04/09 Python
windows10下安装TensorFlow Object Detection API的步骤
2019/06/13 Python
Matplotlib scatter绘制散点图的方法实现
2020/01/02 Python
python GUI库图形界面开发之PyQt5工具栏控件QToolBar的详细使用方法与实例
2020/02/28 Python
CSS3中border-radius属性设定圆角的使用技巧
2016/05/10 HTML / CSS
欧舒丹比利时官网:L’OCCITANE比利时
2017/04/25 全球购物
说出ArrayList,Vector, LinkedList的存储性能和特性
2015/01/04 面试题
运动会领导邀请函
2014/01/10 职场文书
八项规定整改措施
2014/02/12 职场文书
大学生迟到检讨书500字
2014/10/17 职场文书
JavaScript实现简单拖拽效果
2021/09/15 Javascript
mysql主从复制的实现步骤
2021/10/24 MySQL
Python查找算法的实现 (线性、二分,分块、插值查找算法)
2022/04/24 Python