实例详解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与vbscript数据共享
Jan 09 Javascript
jquery text()要注意啦
Oct 30 Javascript
动态加载JS文件的三种方法
Nov 08 Javascript
SeaJS入门教程系列之SeaJS介绍(一)
Mar 03 Javascript
基于BootStrap Metronic开发框架经验小结【八】框架功能总体界面介绍
May 12 Javascript
webpack+vue.js实现组件化详解
Oct 12 Javascript
JS实现用户注册时获取短信验证码和倒计时功能
Oct 27 Javascript
jQuery UI Grid 模态框中的表格实例代码
Apr 01 jQuery
关于jQuery.ajax()的jsonp碰上post详解
Jul 02 jQuery
详解Vue单元测试Karma+Mocha学习笔记
Jan 31 Javascript
微信小程序项目总结之记账小程序功能的实现(包括后端)
Aug 20 Javascript
vue 计算属性和侦听器的使用小结
Jan 25 Vue.js
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
PHP正则的Unknown Modifier错误解决方法
2010/03/02 PHP
PHP模拟asp.net的StringBuilder类实现方法
2015/08/08 PHP
thinkPHP框架实现图像裁剪、缩放、加水印的方法
2017/03/14 PHP
php识别翻转iphone拍摄的颠倒图片
2018/05/17 PHP
jQuery textarea的长度进行验证
2009/05/06 Javascript
img标签中onerror用法
2009/08/13 Javascript
JS操作select下拉框动态变动(创建/删除/获取)
2013/06/02 Javascript
JS关闭窗口或JS关闭页面的几种代码分享
2013/10/25 Javascript
js获取url中的参数且参数为中文时通过js解码
2014/03/19 Javascript
jQuery实现简单网页遮罩层/弹出层效果兼容IE6、IE7
2014/06/16 Javascript
JavaScript实现的in_array函数
2014/08/27 Javascript
js中用cssText设置css样式的简单方法
2016/09/19 Javascript
详解vue父子模版嵌套案例
2017/03/04 Javascript
JS使用插件cryptojs进行加密解密数据实例
2017/05/11 Javascript
Vue 中的compile操作方法
2018/02/26 Javascript
用python实现k近邻算法的示例代码
2018/09/06 Python
Python实现DDos攻击实例详解
2019/02/02 Python
使用OpenCV实现仿射变换—平移功能
2019/08/29 Python
Pytorch修改ResNet模型全连接层进行直接训练实例
2019/09/10 Python
用Python去除图像的黑色或白色背景实例
2019/12/12 Python
Python3搭建http服务器的实现代码
2020/02/11 Python
Python flask路由间传递变量实例详解
2020/06/03 Python
Python 实现将numpy中的nan和inf,nan替换成对应的均值
2020/06/08 Python
Numpy中的数组搜索中np.where方法详细介绍
2021/01/08 Python
用HTML5实现鼠标滚轮事件放大缩小图片的功能
2015/06/25 HTML / CSS
Willer台湾:日本高速巴士/夜行巴士预约
2017/07/09 全球购物
在线购买澳大利亚设计师手拿包和奢华晚装手袋:Olga Berg
2019/03/20 全球购物
香港百佳网上超级市场:PARKNSHOP.com
2020/06/10 全球购物
final, finally, finalize的区别
2012/03/01 面试题
2014广电局实施党的群众路线教育实践活动方案思想汇报
2014/09/22 职场文书
反对四风自我剖析材料
2014/10/07 职场文书
休假证明书
2015/06/24 职场文书
当你焦虑迷茫时,请读读这6句话
2019/07/24 职场文书
小学秋季运动会加油口号及加油稿
2019/08/19 职场文书
python中的装饰器该如何使用
2021/06/18 Python
windows server 2012安装FTP并配置被动模式指定开放端口
2022/06/10 Servers