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 相关文章推荐
javascript中字符串替换函数replace()方法与c# 、vb 替换有一点不同
Jun 25 Javascript
jQuery实现的Email中的收件人效果(按del键删除)
Mar 20 Javascript
不同的jQuery API来处理不同的浏览器事件
Dec 09 Javascript
2012年开发人员的16款新鲜的jquery插件体验分享
Dec 28 Javascript
JavaScript DOM 编程艺术(第2版)读书笔记(JavaScript的最佳实践)
Oct 01 Javascript
node.js中的fs.appendFileSync方法使用说明
Dec 17 Javascript
javascript原型继承工作原理和实例详解
Apr 07 Javascript
Bootstrap源码解读下拉菜单(4)
Dec 23 Javascript
AngularJs的UI组件ui-Bootstrap之Tooltip和Popover
Jul 13 Javascript
Vue中使用vux配置代码详解
Sep 16 Javascript
js 根据对象数组中的属性进行排序实现代码
Sep 12 Javascript
layui对工具条进行选择性的显示方法
Sep 19 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
JS与PHP向函数传递可变参数的区别实例代码
2011/05/18 PHP
Codeigniter操作数据库表的优化写法总结
2014/06/12 PHP
PHP MSSQL 分页实例
2016/04/13 PHP
Thinkphp 中 distinct 的用法解析
2016/12/14 PHP
Laravel中log无法写入问题的解决
2017/06/17 PHP
Yii框架视图、视图布局、视图数据块操作示例
2019/10/14 PHP
Mootools 1.2教程 同时进行多个形变动画
2009/09/15 Javascript
toString()一个会自动调用的方法
2010/02/08 Javascript
jquery prop的使用介绍及与attr的区别
2013/12/19 Javascript
一个网页标题title的闪动提示效果实现思路
2014/03/22 Javascript
javascript中Math.random()使用详解
2015/04/15 Javascript
谈谈JSON对象和字符串之间的相互转换JSON.stringify(obj)和JSON.parse(string)
2015/10/01 Javascript
基于jQuery实现搜索关键字自动匹配功能
2020/03/26 Javascript
JS中作用域和变量提升(hoisting)的深入理解
2016/10/31 Javascript
jquery结合html实现中英文页面切换
2016/11/29 Javascript
详解Vue监听数据变化原理
2017/03/08 Javascript
Angular多选、全选、批量选择操作实例代码
2017/03/10 Javascript
JavaScript反弹动画效果的实现代码
2017/07/13 Javascript
Node.js 使用jade模板引擎的示例
2018/05/11 Javascript
微信小程序实现动态获取元素宽高的方法分析
2018/12/10 Javascript
jQuery实现根据身份证号获取生日、年龄、性别等信息的方法
2019/01/09 jQuery
[01:58]2018DOTA2亚洲邀请赛趣味视频——交流
2018/04/03 DOTA
九步学会Python装饰器
2015/05/09 Python
Python的randrange()方法使用教程
2015/05/15 Python
pandas通过字典生成dataframe的方法步骤
2019/07/23 Python
解决Pycharm中恢复被exclude的项目问题(pycharm source root)
2020/02/14 Python
基于pygame实现童年掌机打砖块游戏
2020/02/25 Python
sklearn的predict_proba使用说明
2020/06/28 Python
世界上最好的威士忌和烈性酒购买网站:The Whisky Exchange
2016/11/20 全球购物
致全体运动员广播稿
2014/02/01 职场文书
大学新闻系自荐书
2014/05/31 职场文书
大学军训自我鉴定大全
2014/09/18 职场文书
安全保证书格式
2015/02/28 职场文书
2015年出纳年终工作总结
2015/05/14 职场文书
Python打包为exe详细教程
2021/05/18 Python
详解Python中*args和**kwargs的使用
2022/04/07 Python