使用变量引用对象属性？

I've got an object with a bunch of key's and values: (I've reduced it to one value for readability)

我有一个带有一堆键和值的对象:(为了便于阅读,我把它减少到一个值)

var linksarray = {
getting_Started : "Getting Started"
};

The aim is to go through a bunch of links on my page, manipulate the href attribute and dependent on the end result, i.e. getting_Started, use that as the key to get the value 'Getting Started' from the object.

目的是遍历我的页面上的一堆链接,操纵href属性并依赖于最终结果,即getting_Started,使用它作为从对象获取值'Getting Started'的键。

To visualize:

Here is the code, comments of values as it's being manipulated:

这是代码,值被操纵的值的注释:

var link = jQuery(this).attr('href');       //link = ../getting_Started.htm

var res = link.split('/'); 
var lastEl = res.pop();                     //link = getting_Started.htm

var testEl = firstEl.split('.'); 
var testElUse = testEl[0];                  //link = getting_Started

testElUse = '\'' + testElUse + '\'';        //link = 'getting_Started'

This all works as it should and I get the correct string that I'm looking for.

这一切都按预期工作,我得到了正在寻找的正确字符串。

From here on I've used so many different solutions that I found on Google but none of them work. I've wasted one and a half days on this. Here is the two solutions that I expected to work...but don't.

从这里开始,我使用了许多不同的解决方案,这些解决方案都是我在Google上找到的,但都没有。我浪费了一天半的时间。这是我期望工作的两个解决方案......但不是。

Solution 1:

var stringJson = JSON.stringify(linksarray);

var obj=JSON.parse(stringJson) ;
alert(obj[testElUse]);                 //this results in 'undefined'

Solution 2:

alert(linksarray[testElUse]);          //this results in 'undefined'

I know there is dot and block annotation, but as far as I understand block is the way to go if you want to dynamically reference a property according to this link: Dynamically access object property using variable

我知道有点和块注释,但据我所知,如果你想根据这个链接动态引用属性,那么块是要走的路:使用变量动态访问对象属性

No matter what I do, I get undefined returned...not the "Getting Started" that I'm looking for.

无论我做什么,我都会得到不确定的回复...而不是我正在寻找的“入门”。

Please help :)

请帮忙 :)

4 个解决方案

#1

First of all it might be a lot easier and cleaner to extract the variable from the href attribute you are looking for using a regExp. Saves you a lot of popping and slicing (: http://www.regexr.com/ is a good site to tweak and test your regExp. Using a regExp it would look something like this:

首先,使用regExp从您正在寻找的href属性中提取变量可能会更容易和更简洁。为您节省大量的弹出和切片(http://www.regexr.com/是一个很好的网站来调整和测试您的regExp。使用regExp它看起来像这样:

var link = $('a');
var href = link.attr('href');

console.log(href); // http:www.google.com/getting_started.html

// .*/           - captures everything up to the last '/'
// (.*)          - captures everything in between the previous selection and 
//                 the next and puts in into a group.
// \.(html|htm)  - captures .html or .htm
var regExp = /.*\/(.*)\.(html|htm)/g;    

// replace the entire url with the value found in the first group selection.    
var testElUse = href.replace(regExp, '$1');

console.log(testElUse); // getting_started

Then you should be able to extract the value from your Object using the bracket notation:

然后,您应该能够使用括号表示法从Object中提取值:

// retrieve the value from the linksArray
console.log( linksArray[testElUse] ); // Getting started

Just make sure the names match (: Hope this helps.

只要确保名称匹配(:希望这会有所帮助。

#2

The reason looks to be that 'getting_Started' !== 'getting_started' You defined the links_array property with a capital S on 'started'.

原因似乎是'getting_Started'!=='getting_started'您在“已启动”中使用大写S定义了links_array属性。

Sometimes its just the small things that catch us out. :)

有时它只是抓住我们的小东西。 :)

#3

It's because the variable and properties are different.

这是因为变量和属性是不同的。

The property is getting_Started and testElUse = "\getting_started\";

该属性为getting_Started,testElUse =“\ getting_started \”;

That's why it is undefined

这就是它未定义的原因

#4

Remove this part of your parsing code

删除这部分解析代码

testElUse = '\'' + testElUse + '\'';

The extra apostrophe's mean you are looking for a property called 'getting_Started', not getting_Started (these are 2 different strings).

额外的撇号意味着你正在寻找一个名为'getting_Started'的属性,而不是get_Started(这是两个不同的字符串)。

See this fiddle.

看到这个小提琴。

#1

var link = $('a');
var href = link.attr('href');

console.log(href); // http:www.google.com/getting_started.html

// .*/           - captures everything up to the last '/'
// (.*)          - captures everything in between the previous selection and 
//                 the next and puts in into a group.
// \.(html|htm)  - captures .html or .htm
var regExp = /.*\/(.*)\.(html|htm)/g;    

// replace the entire url with the value found in the first group selection.    
var testElUse = href.replace(regExp, '$1');

console.log(testElUse); // getting_started