Creating an associative array in Javascript by utilizing a for loop

Question

Creating an associative array in Javascript by utilizing a for loop

I am attempting to create an array called userRow{} by using:

$('#divResults tr').find('td:nth-child(2)').text();

This will fetch 12 first names from a column in an HTML table, such as John, Dave, and so on.

$('#divResults tr').find('td:nth-child(3)').text();

Similarly, this line retrieves middle names, etc.

Here's what I have tried:

for (var i = 0; i < 12; i++) {
    userRow[i]['jurorFN'] = $('#divResults tr').find('td:nth-child(2)').text();
    userRow[i]['jurorMN'] = $('#divResults tr').find('td:nth-child(3)').text();
    userRow[i]['jurorLN'] = $('#divResults tr').find('td:nth-child(4)').text();
}

However, this code does not output anything to the console.

My goal is to iterate through all the items in the table and, for example, if I alert userRow[1], it should display Dave, M, Johnson (first middle last) and so on.

javascript arrays associative-array

Answer 1

Answer №1

Make sure to iterate through each $('#divResults tr'):

var userRow = [];
$('#divResults tr').each(function(i) {
    var tds = $(this).find('td');
    userRow[i] = {}
    userRow[i].jurorFN = tds.eq(2).text();
    userRow[i].jurorMN = tds.eq(3).text();
    userRow[i].jurorLN = tds.eq(4).text();
});

Otherwise, you will end up duplicating the first row in the array multiple times

Alternatively, you can use map:

var userRow = $('#divResults tr').map(function() {
    var tds = $(this).find('td');
    return {
        jurorFN: tds.eq(2).text(),
        jurorMN: tds.eq(3).text(),
        jurorLN: tds.eq(4).text()
    };
}).get();

I also made some cosmetic changes:

Replaced .find('e:nth-child(n)') with .find('e').eq(n), which optimizes the code by calculating find('e') only once
Replaced obj['validIdentifier'] with obj.validIdentifier

Answer 2

Make sure to iterate through each $('#divResults tr'):

var userRow = [];
$('#divResults tr').each(function(i) {
    var tds = $(this).find('td');
    userRow[i] = {}
    userRow[i].jurorFN = tds.eq(2).text();
    userRow[i].jurorMN = tds.eq(3).text();
    userRow[i].jurorLN = tds.eq(4).text();
});

Otherwise, you will end up duplicating the first row in the array multiple times

Alternatively, you can use map:

var userRow = $('#divResults tr').map(function() {
    var tds = $(this).find('td');
    return {
        jurorFN: tds.eq(2).text(),
        jurorMN: tds.eq(3).text(),
        jurorLN: tds.eq(4).text()
    };
}).get();

I also made some cosmetic changes:

Replaced .find('e:nth-child(n)') with .find('e').eq(n), which optimizes the code by calculating find('e') only once
Replaced obj['validIdentifier'] with obj.validIdentifier

Answer 3

Answer №2

In JavaScript, there is no direct equivalent to an associative array; instead, objects are accessed in array style. It is recommended to define an object before assigning data to it, like so: userRow[i] = {}

I find the remaining code to be somewhat ambiguous...

Answer 4

In JavaScript, there is no direct equivalent to an associative array; instead, objects are accessed in array style. It is recommended to define an object before assigning data to it, like so: userRow[i] = {}

I find the remaining code to be somewhat ambiguous...

Answer 5

Answer №3

If you take a look at the provided code snippet, you can try the following approach:

let userList = [];
for ( let i=0; i < 12; i++) {
  let jurorFN = $('#divResults tr').find('td:nth-child(2)').text();
  let jurorMN = $('#divResults tr').find('td:nth-child(3)').text();
  let jurorLN = $('#divResults tr').find('td:nth-child(4)').text();
  let fullName = jurorFN + ' ' + jurorMN + ' ' + jurorLN;
  userList.push(fullName);
}
console.log(userList[0]); // from userList[0] to userList[11]

Answer 6

If you take a look at the provided code snippet, you can try the following approach:

let userList = [];
for ( let i=0; i < 12; i++) {
  let jurorFN = $('#divResults tr').find('td:nth-child(2)').text();
  let jurorMN = $('#divResults tr').find('td:nth-child(3)').text();
  let jurorLN = $('#divResults tr').find('td:nth-child(4)').text();
  let fullName = jurorFN + ' ' + jurorMN + ' ' + jurorLN;
  userList.push(fullName);
}
console.log(userList[0]); // from userList[0] to userList[11]

Creating an associative array in Javascript by utilizing a for loop

Answer №1

Answer №2

Answer №3

Similar questions

Development versions of npm libraries

Is there a way to enclose a mention within a unique span tag after highlighting it? Similar to how tags are implemented on platforms such

When submitting an Asp net mvc Form, some fields may not be posted as expected

What steps should I follow to create a large Angular single page application using ASP.NET MVC?

Create a more concise JavaScript function for updating MongoDB using if/else statements

Node.js command-line interface for chat application

Display PDF file retrieved from the server using javascript

Customize the appearance of disabled dates in the eonasdan-datetimepicker styling

Stream-Awesome #12: The Return of Duplexer in Nodesville

Discover the way to utilize the java enum toString() function in jQuery

How to interact with a C# List using JavaScript

transfer an image file to a php script using ajax

The success function of the Ajax request remains untouched by the response

gdal.vectorTranslate causing output files to be void

Utilize HTML5 to enable fullscreen functionality for embedded SWF files

Sinon respects my intern functions during testing in ExpressJS

What is the best way to combine objects that share the same id?

Issue with displaying marker information on Angular Google Maps

The improper utilization or replacement of Jest mock in an Angular standalone component's unit test is causing issues

What could be causing the ajax request to not go through?