我试图使用动态名称访问对象的属性。这可能吗?
const something = { bar: "Foobar!" };
const foo = 'bar';
something.foo; // The idea is to access something.bar, getting "Foobar!"
我试图使用动态名称访问对象的属性。这可能吗?
const something = { bar: "Foobar!" };
const foo = 'bar';
something.foo; // The idea is to access something.bar, getting "Foobar!"
当前回答
ES5 //检查深嵌套变量
这段简单的代码可以检查嵌套深度的变量/值是否存在,而不需要检查每个变量…
var getValue = function( s, context ){
return Function.call( context || null, 'return ' + s )();
}
Ex. -嵌套很深的对象数组:
a = [
{
b : [
{
a : 1,
b : [
{
c : 1,
d : 2 // we want to check for this
}
]
}
]
}
]
而不是:
if(a && a[0] && a[0].b && a[0].b[0] && a[0].b[0].b && a[0].b[0].b[0] && a[0].b[0].b[0].d && a[0].b[0].b[0].d == 2 ) // true
我们现在可以:
if( getValue('a[0].b[0].b[0].d') == 2 ) // true
干杯!
其他回答
这是我的解决方案:
function resolve(path, obj) {
return path.split('.').reduce(function(prev, curr) {
return prev ? prev[curr] : null
}, obj || self)
}
使用例子:
resolve("document.body.style.width")
// or
resolve("style.width", document.body)
// or even use array indexes
// (someObject has been defined in the question)
resolve("part.0.size", someObject)
// returns null when intermediate properties are not defined:
resolve('properties.that.do.not.exist', {hello:'world'})
通过引用查找对象,字符串, 注意,确保你传递的对象是克隆的,我使用cloneDeep从lodash
如果对象看起来像
const obj = {data: ['an Object',{person: {name: {first:'nick', last:'gray'} }]
路径看起来像这样
const objectPath = ['data',1,'person',name','last']
然后调用下面的方法,它将按给定的路径返回子对象
const child = findObjectByPath(obj, objectPath)
alert( child) // alerts "last"
const findObjectByPath = (objectIn: any, path: any[]) => {
let obj = objectIn
for (let i = 0; i <= path.length - 1; i++) {
const item = path[i]
// keep going up to the next parent
obj = obj[item] // this is by reference
}
return obj
}
我问了一个类似于这个主题的问题,经过大量的研究,看到了很多应该在这里丢失的信息,我觉得我有一些有价值的东西可以添加到这篇旧文章中。
首先,我想说明有几种方法来获取属性的值并将其存储在动态变量中。第一个最受欢迎,也是最简单的方法是:
let properyValue = element.style['enter-a-property'];
然而,我很少走这条路,因为它不工作的属性值通过样式表分配。为了给您一个示例,我将使用一些伪代码进行演示。
let elem = document.getElementById('someDiv');
let cssProp = elem.style['width'];
Using the code example above; if the width property of the div element that was stored in the 'elem' variable was styled in a CSS style-sheet, and not styled inside of its HTML tag, you are without a doubt going to get a return value of undefined stored inside of the cssProp variable. The undefined value occurs because in-order to get the correct value, the code written inside a CSS Style-Sheet needs to be computed in-order to get the value, therefore; you must use a method that will compute the value of the property who's value lies within the style-sheet.
因此,getComputedStyle()方法!
function getCssProp(){
let ele = document.getElementById("test");
let cssProp = window.getComputedStyle(ele,null).getPropertyValue("width");
}
这提供了一个很好的例子,并让您可以使用它,然而,这个链接Mozilla CSS getComputedValue文档详细讨论了getComputedValue函数,任何有抱负的开发人员如果对这个主题不完全清楚,都应该阅读。
顺便说一句,getComputedValue方法只获取,不设置。这显然是一个主要的缺点,但是有一个方法可以从CSS样式表中获取,以及设置值,尽管它不是标准的Javascript。 JQuery方法…
$(selector).css(property,value)
...是get,是set。这就是我所使用的,唯一的缺点是你必须了解JQuery,但这是每个Javascript开发人员都应该学习JQuery的许多很好的理由之一,它只是让生活变得简单,并提供了一些方法,就像这个,这在标准Javascript中是不可用的。 希望这能帮助到一些人!!
演示对象示例
let obj = {
name: {
first_name: "Bugs",
last_name: "Founder",
role: "Programmer"
}
}
的值的虚线字符串键
let key = "name.first_name"
函数
const getValueByDottedKeys = (obj, strKey)=>{
let keys = strKey.split(".")
let value = obj[keys[0]];
for(let i=1;i<keys.length;i++){
value = value[keys[i]]
}
return value
}
调用getValueByDottedKeys函数
value = getValueByDottedKeys(obj, key)
console.log(value)
输出
Bugs
const getValueByDottedKeys = (obj, strKey)=>{ 让键= strKey.split(".") Let value = obj[keys[0]]; (让我= 1,< keys.length;我+ +){ Value = Value [key [i]] } 返回值 } 让obj = { 名称:{ first_name:“虫子”, last_name:“创始人”, 作用:“程序员” } } Let key = "name.first_name" value = getValueByDottedKeys(obj, key) console.log(值)
您应该使用JSON。解析,看看https://www.w3schools.com/js/js_json_parse.asp
const obj = JSON.parse('{ "name":"John", "age":30, "city":"New York"}')
console.log(obj.name)
console.log(obj.age)