实例详解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 相关文章推荐
jquery 指南/入门基础
Nov 30 Javascript
jQuery EasyUI API 中文文档 - Tree树使用介绍
Nov 19 Javascript
用js的for循环获取radio选中的值
Oct 21 Javascript
AngularJS模块管理问题的非常规处理方法
Apr 29 Javascript
JavaScript高级教程5.6之基本包装类型(详细)
Nov 23 Javascript
node.js中module.exports与exports用法上的区别
Sep 02 Javascript
JavaScript中in和hasOwnProperty区别详解
Aug 04 Javascript
微信小程序webview组件交互,内联h5页面并网页实现微信支付实现解析
Aug 16 Javascript
layer更改皮肤的实现方法
Sep 11 Javascript
微信小程序后端(java)开发流程的详细步骤
Nov 13 Javascript
ant design vue导航菜单与路由配置操作
Oct 28 Javascript
详解TS数字分隔符和更严格的类属性检查
May 06 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
中篇:安装及配置PHP
2006/12/13 PHP
php 利用array_slice函数获取随机数组或前几条数据
2015/09/30 PHP
php 解析xml 的四种方法详细介绍
2016/10/26 PHP
浅谈Coreseek、Sphinx-for-chinaese、Sphinx+Scws的区别
2016/12/15 PHP
JQuyer $.post 与 $.ajax 访问WCF ajax service 时的问题需要注意的地方
2011/09/20 Javascript
使用js Math.random()函数生成n到m间的随机数字
2014/10/09 Javascript
javascript实现点击商品列表checkbox实时统计金额的方法
2015/05/15 Javascript
用JavaScript实现PHP的urlencode与urldecode函数
2015/08/13 Javascript
值得分享的Bootstrap Ace模板实现菜单和Tab页效果
2015/12/30 Javascript
RequireJS使用注意细节
2016/05/15 Javascript
基于gulp合并压缩Seajs模块的方式说明
2016/06/14 Javascript
js 判断各种数据类型的简单方法(推荐)
2016/08/29 Javascript
微信小程序 转发功能的实现
2017/08/04 Javascript
js实现音乐播放控制条
2017/09/09 Javascript
小程序图片长按识别功能的实现方法
2018/08/30 Javascript
详解vscode中vue代码颜色插件
2018/10/11 Javascript
iView框架问题整理小结
2018/10/16 Javascript
VueCli3构建TS项目的方法步骤
2018/11/07 Javascript
微信小程序实现顶部导航特效
2019/01/28 Javascript
微信小程序 wx.getUserInfo引导用户授权问题实例分析
2020/03/09 Javascript
vue 子组件watch监听不到prop的解决
2020/08/09 Javascript
关于vue属性使用和不使用冒号的区别说明
2020/10/22 Javascript
Python写的贪吃蛇游戏例子
2014/06/16 Python
django开发之settings.py中变量的全局引用详解
2017/03/29 Python
python join方法使用详解
2019/07/30 Python
基于python及pytorch中乘法的使用详解
2019/12/27 Python
德国大型箱包和皮具商店:Koffer
2019/10/01 全球购物
美国价格实惠的在线眼镜网站:Zeelool
2020/12/25 全球购物
致接力运动员广播稿
2014/02/17 职场文书
建筑安全生产责任书
2014/07/22 职场文书
小学向国旗敬礼活动方案
2014/09/27 职场文书
2014年少先队工作总结
2014/12/03 职场文书
读《工匠精神》有感:热爱工作,精益求精
2019/12/28 职场文书
idea编译器vue缩进报错问题场景分析
2021/07/04 Vue.js
什么是Python装饰器?如何定义和使用?
2022/04/11 Python
python中redis包操作数据库的教程
2022/04/19 Python