js获取json中key所对应的value值的简单方法


Posted in Javascript onJune 17, 2020

实例如下:

<script type="text/javascript"> 
 getJson('age'); 
 
function getJson(key){ 
 var jsonObj={"name":"傅红雪","age":"24","profession":"刺客"}; 
 
 
 //1、使用eval方法  
 var eValue=eval('jsonObj.'+key); 
 alert(eValue); 
 
 
 //2、遍历Json串获取其属性 
 for(var item in jsonObj){ 
  if(item==key){ //item 表示Json串中的属性,如'name' 
   var jValue=jsonObj[item];//key所对应的value 
   alert(jValue); 
  } 
 } 
 
 
 //3、直接获取 
 alert(jsonObj[''+key+'']); 
} 
</script>

通过上边三种方法就可以取到json中key对应的值

用js方式取得接口里面json数据的key和value值

大家在实际操作中难免遇到对接口的问题,想必对一些小白来说取得里面想要是数据也是很是头疼,那么接下来我会结合接口实际情况教大家怎么取得里面相应的数据

接口数据例如:(数据为 模拟数据,json格式)

{
  "month": {
    "monthly": ["2018年4月", "2018年5月"]
  },
  "nameAndRateOperation": {
    "济南华阳炭素有限公司": ["91.67", "91.67"],
    "济南万瑞炭素有限责任公司": ["84", "84"],
    "济南龙山炭素有限公司": ["85.71", "85.71"],
    "德州欧莱恩永兴碳素有限公司": ["70", "80"],
    "德州永兴碳素有限公司": ["90", "90"],
    "德州乾海碳素有限公司": ["70", "75"],
    "济南海川投资集团有限公司": ["81.25", "81.25"],
    "济南汇丰炭素有限公司": ["86", "86"],
    "山东金利达碳素有限公司": ["86.68", "80"],
    "济南澳海炭素有限公司": ["85", "85"]
  },
  "nameAndYield": {
    "济南华阳炭素有限公司": ["1.2", "1.2"],
    "济南万瑞炭素有限责任公司": ["4", "4"],
    "济南龙山炭素有限公司": ["2.4", "2.4"],
    "德州欧莱恩永兴碳素有限公司": ["0.8", "1"],
    "德州永兴碳素有限公司": ["0.67", "0.5"],
    "德州乾海碳素有限公司": ["0.2", "0.25"],
    "济南海川投资集团有限公司": ["1.6", "1.6"],
    "济南汇丰炭素有限公司": ["0.8", "0.8"],
    "山东金利达碳素有限公司": ["2", "2.5"],
    "济南澳海炭素有限公司": ["4.33", "4.5"]
  },
  "nameAndDateTime": {
    "济南华阳炭素有限公司": ["2018年4月", "2018年5月"],
    "济南万瑞炭素有限责任公司": ["2018年4月", "2018年5月"],
    "济南龙山炭素有限公司": ["2018年4月", "2018年5月"],
    "德州欧莱恩永兴碳素有限公司": ["2018年4月", "2018年5月"],
    "德州永兴碳素有限公司": ["2018年4月", "2018年5月"],
    "德州乾海碳素有限公司": ["2018年4月", "2018年5月"],
    "济南海川投资集团有限公司": ["2018年4月", "2018年5月"],
    "济南汇丰炭素有限公司": ["2018年4月", "2018年5月"],
    "山东金利达碳素有限公司": ["2018年4月", "2018年5月"],
    "济南澳海炭素有限公司": ["2018年4月", "2018年5月"]
  },
  "regionAndCompany": {
    "华东": ["德州欧莱恩永兴碳素有限公司", "德州乾海碳素有限公司", "德州永兴碳素有限公司", "山东金利达碳素有限公司", "济南澳海炭素有限公司", "济南海川投资集团有限公司", "济南华阳炭素有限公司", "济南汇丰炭素有限公司", "济南龙山炭素有限公司", "济南万瑞炭素有限责任公司"]
  },
  "nameAndCapacity": {
    "济南华阳炭素有限公司": ["6", "6"],
    "济南万瑞炭素有限责任公司": ["5", "5"],
    "济南龙山炭素有限公司": ["7", "7"],
    "德州欧莱恩永兴碳素有限公司": ["30", "30"],
    "德州永兴碳素有限公司": ["20", "20"],
    "德州乾海碳素有限公司": ["20", "20"],
    "济南海川投资集团有限公司": ["8", "8"],
    "济南汇丰炭素有限公司": ["10", "10"],
    "山东金利达碳素有限公司": ["15", "15"],
    "济南澳海炭素有限公司": ["10", "10"]
  },
  "storageWithCompany": {
    "济南华阳炭素有限公司": ["0.8", "0.8"],
    "济南万瑞炭素有限责任公司": ["3.2", "3.2"],
    "济南龙山炭素有限公司": ["2.2", "2.2"],
    "德州欧莱恩永兴碳素有限公司": ["1.2", "1.2"],
    "德州永兴碳素有限公司": ["0.5", "0.5"],
    "德州乾海碳素有限公司": ["0.15", "0.15"],
    "济南海川投资集团有限公司": ["1", "1"],
    "济南汇丰炭素有限公司": ["0.5", "1"],
    "山东金利达碳素有限公司": ["1.5", "1.5"],
    "济南澳海炭素有限公司": ["2.5", "2.5"]
  }
}

json数据

获取代码

//取出来所有的地区:华南华北....
            for (var key in data.regionAndCompany) {
              region.push(key);
            }
            // console.log(region)
            
            //接口取出来的仓储的数组
            for (key in data.storageWithCompany) {
              storageWithCompany.push(data.storageWithCompany[key])
            }
            // console.log(storageWithCompany)

            // //接口取出来的产能的数组
            // for(key in data.nameAndCapacity){
            //   capacity.push(data.nameAndCapacity[key])
            // }
            // // console.log(capacity)

            //接口取出来的开工率的数组
            for (key in data.nameAndRateOperation) {
              rateOperation.push(data.nameAndRateOperation[key])
            }
            // console.log(rateOperation)

            //全部的公司名字
            for (key in data.nameAndRateOperation) {
              companyRateOperation.push(key);
            }
            // console.log(companyRateOperation)
            
            //全部的时间数据,二维数组
            for (var key in data.nameAndDateTime) {
              date.push(data.nameAndDateTime[key])
            }
            // console.log(date)
            
            //全部的产量数组,二维,每个公司的产量是一个数组
            for (var key in data.nameAndYield) {
              yield.push(data.nameAndYield[key])
            }
            // console.log(yield)

再放上网上的方法

js中获取object类型里键值的方法

最近遇到一个问题:

var obj = {"name1":"张三","name2":"李四"};
var key = "name1";
var value = obj.key;//得到了"undefined"
value = obj.name1;//得到了"张三"

其实我是想动态给key赋值,然后得到key为多少所对就的值。但这种做法行不通,obj.key会去找obj下key为"key"所对应的值,结果当然是找不到喽。
于是,我想到了js中遍历对象属性的方法:

function printObject(obj){
	//obj = {"cid":"C0","ctext":"区县"};
	var temp = "";
	for(var i in obj){//用javascript的for/in循环遍历对象的属性
		temp += i+":"+obj[i]+"\n";
	}
	alert(temp);//结果:cid:C0 \n ctext:区县
}

这样,就可以清楚的知道js中一个对象的key和value分别是什么了。
回到刚才的问题,怎么动态给key赋值,然后以obj.key的方式得到对应的value呢?
其实以上printObject中有提示,那就是用obj[key]的方法,key可以是动态的,这样就解决了我上面提出的问题了。
最后说一下,还有一个方法也可以,那就是:eval("obj."+key)。

总结:

js中想根据动态key得到某对象中相对应的value的方法有二:

一、var key = "name1";var value = obj[key];
二、var key = "name1";var value = eval("obj."+key);

以上这篇js获取json中key所对应的value值的简单方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js 跨域和ajax 跨域问题小结
Jul 01 Javascript
Extjs中DisplayField的日期或者数字格式化扩展
Sep 03 Javascript
JS中Iframe之间传值及子页面与父页面应用
Mar 11 Javascript
javascript解析json实例详解
Nov 05 Javascript
基于jQuery实现的扇形定时器附源码下载
Oct 20 Javascript
浅谈layer的iframe弹窗给里面的标签赋值的问题
Nov 10 Javascript
如何制作幻灯片(代码分享)
Jan 06 Javascript
AngularJS Toaster使用详解
Feb 24 Javascript
JS判断时间段的实现代码
Jun 14 Javascript
js实现登录注册框手机号和验证码校验(前端部分)
Sep 28 Javascript
基于vue中对鼠标划过事件的处理方式详解
Aug 22 Javascript
浅谈layui数据表格判断问题(加入表单元素),设置单元格样式
Oct 26 Javascript
ng2学习笔记之bootstrap中的component使用教程
Mar 09 #Javascript
Angular.js中处理页面闪烁的方法详解
Mar 09 #Javascript
jQuery插件HighCharts实现的2D对数饼图效果示例【附demo源码下载】
Mar 09 #Javascript
JS实现课堂随机点名和顺序点名
Mar 09 #Javascript
JavaScript实现两个select下拉框选项左移右移
Mar 09 #Javascript
js实现年月日表单三级联动
Apr 17 #Javascript
js实现3D图片展示效果
Mar 09 #Javascript
You might like
php基础知识:类与对象(5) static
2006/12/13 PHP
浅谈php函数serialize()与unserialize()的使用方法
2014/08/19 PHP
PHP序列化/对象注入漏洞分析
2016/04/18 PHP
php实现通过stomp协议连接ActiveMQ操作示例
2020/02/23 PHP
doctype后如何获得body.clientHeight的方法
2007/07/11 Javascript
jQuery基础知识小结
2014/12/22 Javascript
jQuery中empty()方法用法实例
2015/01/16 Javascript
简介EasyUI datagrid editor combogrid搜索框的实现
2016/04/01 Javascript
JS生成不重复的随机数组的简单实例
2016/07/10 Javascript
JavaScript中的冒泡排序法
2016/08/03 Javascript
jquery的checkbox,radio,select等方法小结
2016/08/30 Javascript
使用vue构建一个上传图片表单
2017/07/04 Javascript
BootStrap的双日历时间控件使用
2017/07/25 Javascript
使用vs code开发Nodejs程序的使用方法
2017/09/21 NodeJs
详解vuex之store拆分即多模块状态管理(modules)篇
2018/11/13 Javascript
element-ui中Table表格省市区合并单元格的方法实现
2019/08/07 Javascript
vue中使用rem布局代码详解
2019/10/30 Javascript
JavaScript 俄罗斯方块游戏实现方法与代码解释
2020/04/08 Javascript
javascript设计模式 ? 工厂模式原理与应用实例分析
2020/04/09 Javascript
vue实现滚动鼠标滚轮切换页面
2020/12/13 Vue.js
基于Python的关键字监控及告警
2017/07/06 Python
python numpy元素的区间查找方法
2018/11/14 Python
python中嵌套函数的实操步骤
2019/02/27 Python
Python OpenCV利用笔记本摄像头实现人脸检测
2020/08/20 Python
python使用mitmproxy抓取浏览器请求的方法
2019/07/02 Python
Python-jenkins模块之folder相关操作介绍
2020/05/12 Python
Python容器类型公共方法总结
2020/08/19 Python
Champion澳大利亚官网:美国冠军运动服装
2018/05/07 全球购物
信息系统专业个人求职信范文
2013/12/07 职场文书
2014年计划生育工作总结
2014/11/14 职场文书
亮剑观后感300字
2015/06/05 职场文书
酒店开业主持词
2015/07/02 职场文书
大学生奖学金获奖感言(范文)
2019/08/15 职场文书
2019年妇科护士的自我鉴定(3篇)
2019/09/26 职场文书
一篇文章带你深入了解Mysql触发器
2021/08/02 MySQL
InterProcessMutex实现zookeeper分布式锁原理
2022/03/21 Java/Android