如何在JavaScript中访问数组中的数据

时间:2020-12-14 23:55:21
  var lotsData = [
    {
        index: 0,
        data: 'I want to be in HTML',

    },
    {
        index: 1,
        data: 'I dont' want to be in HTML',
    }]

Lets say I prefer to have one var with an array. How do I access the index 0, say its connected to a click event and I want to use data:

让我们说我更喜欢有一个带阵列的var。如何访问索引0,说它连接到click事件并且我想使用数据:

    $('.tab').live('click', function() {
          console.log("I was clicked");
                      $('#fancy').text(WHAT GOES HERE TO ACCESS data from index 0?);
        });

4 个解决方案

#1


2  

jQuery is written in Javascript, and Javascript itself provides the Array object.

jQuery是用Javascript编写的,Javascript本身提供了Array对象。

So accessing the 0th element of an array is array_name[0]

因此访问数组的第0个元素是array_name [0]

In your example, you're storing objects as the elements of the array. Your objects are including an "index" property, but beware, your "index" property has nothing to do with the element index in the array. You should NOT include an "index" property... Eg:

在您的示例中,您将对象存储为数组的元素。您的对象包含“index”属性,但要注意,您的“index”属性与数组中的元素索引无关。你不应该包括“索引”属性......例如:

 var lotsData = [
{ // this is the first array element, index value in the array is 0
    index: 1,
    data: 'I want to be in HTML',

},
{  // this is the second array element, index value in the array is 1
    index: 0,
    data: "I don't want to be in HTML",
}]

lotsData[0].data // value: 'I want to be in HTML' 

The better example would be:

更好的例子是:

 var lotsData = [
{  // this is the first array element, index value in the array is 0
    category: 'shoe',
    detail: 'red'

},
{  // this is the second array element, index value in the array is 1
    category: 'fruit',
    detail: 'apple'
}]

lotsData[0].detail // value: 'red'

Added: trailing commas

补充:尾随逗号

Note that while Javascript is a powerful language, it does have its quirks. An important one is trailing commas, such as

请注意,虽然Javascript是一种强大的语言,但确实有它的怪癖。一个重要的是尾随逗号,例如

...
    index: 0,
    data: "I don't want to be in HTML",  // Trailing comma. DON'T DO THIS!
}]

The problem is that the trailing comma is not a formal part of the Javascript language. Most JS engines support it, but a very important one does not: the Internet Explorer browser does not support trailing commas and will die a sad death when it encounters one.

问题是尾随逗号不是Javascript语言的正式部分。大多数JS引擎都支持它,但是一个非常重要的引擎不支持:Internet Explorer浏览器不支持尾随逗号,并且在遇到逗号时会死于悲伤。

Your testing should always include IE due to its unique ways of doing things.

由于其独特的处理方式,您的测试应始终包含IE。

I test in IE 7.

我在IE 7中测试。

#2


1  

 $('.tab').live('click', function() {
          console.log("I was clicked");
                      $('#fancy').text(lotsData[0].data);
        });

of course this is assuming your indexes are in correct order (as they seem to be from your example data).

当然这是假设您的索引处于正确的顺序(因为它们似乎来自您的示例数据)。

And in that case there is no reason to keep a index property of your array'd objects. using a simple string array would be much easier to work with.

在这种情况下,没有理由保留数组对象的索引属性。使用简单的字符串数组将更容易使用。

example

var lotsData = ["I want to be in HTML","I don't want to be in HTML"];

this way you would just have to simply reference lotsData[0]

这样你只需要引用lotsData [0]

#3


1  

First off don't use .live() unless you really really need to ( http://jupiterjs.com/news/why-you-should-never-use-jquery-live )

首先不要使用.live(),除非你真的需要(http://jupiterjs.com/news/why-you-should-never-use-jquery-live)

But if you look at the .live() documentation ( http://api.jquery.com/live/ ) you will see the fact that you can pass data to .live(), that will be available in the callback.

但是如果你看看.live()文档(http://api.jquery.com/live/),你会发现你可以将数据传递给.live(),这将在回调中提供。

.live( eventType, eventData, handler )

.live(eventType,eventData,handler)

So:

$('.tab').live('click',lotsData,function(event){
    console.log('I was clicked');
    $('#fancy').text(event.data[0].data);
});

Is that what you are asking?

那是你在问什么?

Or are you looking at a a way to iterate through lotsdata and find out which item in the array has .index = 0?

或者你正在寻找一种迭代lotdata的方法,找出数组中的哪个项目.index = 0?

#4


0  

You can try this, not best solutuion:

你可以尝试这个,而不是最好的解决方案:

$('.tab').live('click', function() {
    console.log("I was clicked");
    var realIndex;
    for (var i = 0; i < lotsData.length; i++ )
    {
        if (lotsData[i].index == 0) {
            realIndex = i;
            break;
        }
    }
    $('#fancy').text(lotsData[realIndex].index);
});

#1


2  

jQuery is written in Javascript, and Javascript itself provides the Array object.

jQuery是用Javascript编写的,Javascript本身提供了Array对象。

So accessing the 0th element of an array is array_name[0]

因此访问数组的第0个元素是array_name [0]

In your example, you're storing objects as the elements of the array. Your objects are including an "index" property, but beware, your "index" property has nothing to do with the element index in the array. You should NOT include an "index" property... Eg:

在您的示例中,您将对象存储为数组的元素。您的对象包含“index”属性,但要注意,您的“index”属性与数组中的元素索引无关。你不应该包括“索引”属性......例如:

 var lotsData = [
{ // this is the first array element, index value in the array is 0
    index: 1,
    data: 'I want to be in HTML',

},
{  // this is the second array element, index value in the array is 1
    index: 0,
    data: "I don't want to be in HTML",
}]

lotsData[0].data // value: 'I want to be in HTML' 

The better example would be:

更好的例子是:

 var lotsData = [
{  // this is the first array element, index value in the array is 0
    category: 'shoe',
    detail: 'red'

},
{  // this is the second array element, index value in the array is 1
    category: 'fruit',
    detail: 'apple'
}]

lotsData[0].detail // value: 'red'

Added: trailing commas

补充:尾随逗号

Note that while Javascript is a powerful language, it does have its quirks. An important one is trailing commas, such as

请注意,虽然Javascript是一种强大的语言,但确实有它的怪癖。一个重要的是尾随逗号,例如

...
    index: 0,
    data: "I don't want to be in HTML",  // Trailing comma. DON'T DO THIS!
}]

The problem is that the trailing comma is not a formal part of the Javascript language. Most JS engines support it, but a very important one does not: the Internet Explorer browser does not support trailing commas and will die a sad death when it encounters one.

问题是尾随逗号不是Javascript语言的正式部分。大多数JS引擎都支持它,但是一个非常重要的引擎不支持:Internet Explorer浏览器不支持尾随逗号,并且在遇到逗号时会死于悲伤。

Your testing should always include IE due to its unique ways of doing things.

由于其独特的处理方式,您的测试应始终包含IE。

I test in IE 7.

我在IE 7中测试。

#2


1  

 $('.tab').live('click', function() {
          console.log("I was clicked");
                      $('#fancy').text(lotsData[0].data);
        });

of course this is assuming your indexes are in correct order (as they seem to be from your example data).

当然这是假设您的索引处于正确的顺序(因为它们似乎来自您的示例数据)。

And in that case there is no reason to keep a index property of your array'd objects. using a simple string array would be much easier to work with.

在这种情况下,没有理由保留数组对象的索引属性。使用简单的字符串数组将更容易使用。

example

var lotsData = ["I want to be in HTML","I don't want to be in HTML"];

this way you would just have to simply reference lotsData[0]

这样你只需要引用lotsData [0]

#3


1  

First off don't use .live() unless you really really need to ( http://jupiterjs.com/news/why-you-should-never-use-jquery-live )

首先不要使用.live(),除非你真的需要(http://jupiterjs.com/news/why-you-should-never-use-jquery-live)

But if you look at the .live() documentation ( http://api.jquery.com/live/ ) you will see the fact that you can pass data to .live(), that will be available in the callback.

但是如果你看看.live()文档(http://api.jquery.com/live/),你会发现你可以将数据传递给.live(),这将在回调中提供。

.live( eventType, eventData, handler )

.live(eventType,eventData,handler)

So:

$('.tab').live('click',lotsData,function(event){
    console.log('I was clicked');
    $('#fancy').text(event.data[0].data);
});

Is that what you are asking?

那是你在问什么?

Or are you looking at a a way to iterate through lotsdata and find out which item in the array has .index = 0?

或者你正在寻找一种迭代lotdata的方法,找出数组中的哪个项目.index = 0?

#4


0  

You can try this, not best solutuion:

你可以尝试这个,而不是最好的解决方案:

$('.tab').live('click', function() {
    console.log("I was clicked");
    var realIndex;
    for (var i = 0; i < lotsData.length; i++ )
    {
        if (lotsData[i].index == 0) {
            realIndex = i;
            break;
        }
    }
    $('#fancy').text(lotsData[realIndex].index);
});