最近工作上遇到一些问题,我这边需要把从后端拿到的一些数据进行绘图。
这里使用的是绘图方式是echarts-for-react,详细使用方法可以见 echarts-for-reac的使用方法 ,根据这个网址里的component props部分,可以知道ReactEchartsCore组件接受的打点的参数是option,话不多说,直接上例子。
我这边需要对目标数据进行object遍历以及array遍历,最后需要得到的是一个数组。
目标数据的数据结构是:
这里我需要对obj这个数据进行一些 *** 作,目标是得到一个这样的数据:
最后我想得到这样的数据类型。
这里从一开始我就没有思考把这个数据结构转变成数组来进行两次map *** 作来得到自己想要的结果,我一直都是考虑如何遍历这个对象,之后再遍历该对象里某个属性值的数组。
这里用了Objectkeys来遍历对象,但是一开始并不明白怎么用,所以我卡住了很久
这里拿官方的例子来简单说明一下这个方法怎么使用。
这里可以看到,对象使用了Objectkeys()方法变成了一个数组,数组里存储着对象的key值,如果你还需要对该对象key值里的数据进行 *** 作,可以用map来遍历这个存储了key值的数组,来达到目的。
比如,我在绘图的时候,需要拿到一个数组类型给options的series属性,对于我刚开始拿出的例子来说,解决办法就是:
哈哈哈我只是记录一下工作,如果这篇文章没有给你们带来帮助的话就点个赞再走吧~
obj['key'],点""
1 出现的bug,如果这个key的值是false,这里就会判断没有,或者value是undefined也一样
2 可以看到这俩都不行
3 如果对象上不存在改属性,则会返回undefined这种方式可以判断对象的自由属性和继承属性如果对象自身没有检测的属性,而原型链上有该属性,就会返回原型链上的属性值
1 返回一个布尔值,指示对象自身属性是否有指定的属性
2 原型链上的不会被访问到,和in不同,会忽略到从原型链上继承到的属性
3 即使属性的值是null,undefined,只要属性存在,hasOwnProperty依旧会返回true
4 注意:这个方法没有被保护,也就是说方法可以自定定义一个这样的方法,来让他的返回值永远是true或者false
1 !!('work' in obj)
2 如果指定的属性在指定的对象或其原型链中,则in 运算符返回true
3 使用delete删除的属性返回false
4 值为undefined的属性是可以的
1 和in方法完全一样,但是第一个参数不是对象会报错
2 这个方法更加形象
3 原型链上的方法同样可以会返回true
1 判断指定名称的属性是否为实例属性并且是可枚举的
2
1 也就是说,判断自身属性的时候用除了in的所有方法,判断继承属性使用in
2
var key = "name";
var val = "aaa";
var o = {};
str = "o"+key+"='"+val+"'";
eval(str);
alert(oname);
如果这个数组不是json的话,就可以for(var i=0;i <arraylength;i++{}来获取数组中的每一个对象,然后在{}里添加:
if(typeof array[i] == "object){
for(var key in array[i]){
//这里的array[i][key]就能遍历array数组里的对象的属性值了,key就是属性名,
}
}
如果最初的array也是个对象的话,就把for(var i=0;i <arraylength;i++{}改成for(var i in array){}就行了
如果是使用了 JQ EXTJS 的话本身就有 对象克隆的 函数库可以使用 如 extjs 使用
extuxutilclone()
没有用这些的话 可以自己写一个 克隆函数 网上有资源 比如
function deepClone(obj){ var result={},oClass=isClass(obj);// if(oClass==="Object"){
// result={};
// }else if(oClass==="Array"){
// result=[];
// }else{
// return obj;
// }
for(key in obj){
var copy=obj[key];
if(isClass(copy)=="Object"){
result[key]=argumentscallee(copy);
}else if(isClass(copy)=="Array"){
result[key]=argumentscallee(copy);
}else{
result[key]=obj[key];
}
}
return result;
}
function isClass(o){
if(o===null) return "Null";
if(o===undefined) return "Undefined";
return ObjectprototypetoStringcall(o)slice(8,-1);
}
或者参考 extjs 的方法
function(o) {if(!o || 'object' !== typeof o) { return o; }
if('function' === typeof oclone) { return oclone(); }
var c = '[object array]' === objectprototypetostringcall(o) [] : {};
var p, v;
for(p in o) {
if(ohasownproperty(p)) { v = o[p];
if(v && 'object' === typeof v) {
c[p] = extuxutilclone(v);
} else {
c[p] = v;
}
}
}
return c;};
以上就是关于JS Object.keys()的使用点全部的内容,包括:JS Object.keys()的使用点、js判断对象中是否有某个key、js中如何为对象添加自己定义的key和value等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)