Add item to JavaScript array from loop

Question

I am looking to replace this static array, with new data from a loop instead.

var tabledata = [
 { sku:'442398GE', asin:'B075MJ6TPK', current_week_rating: 4.5, wk9: 4.0, wk8: 4.1, wk7: 3.1, wk6: 1.1, total_ratings: 991 },
 { sku:'502764GE', asin:'B07NFLRN23', current_week_rating: 5.0, wk9: 3.2, wk8: 3.2, wk7: 5.0, wk6: 2.1, total_ratings: 389 },
 { sku:'502764GE', asin:'B07NFLRN23', current_week_rating: 4.2, wk9: 4.0, wk8: 3.0, wk7: 4.1, wk6: 3.7, total_ratings: 22 },
 { sku:'442398GE', asin:'B07NFLRN23', current_week_rating: 4.2, wk9: '', wk8: 4.8, wk7: 4.1, wk6: 4.1, total_ratings: 832 },
 { sku:'502764GE', asin:'B07NFLRN23', current_week_rating: 2.2, wk9: 1.5, wk8: 1.5, wk7: 4.1, wk6: 4.1, total_ratings: 103 },
 { sku:'442398GE', asin:'B07NFLRN23', current_week_rating: 4.2, wk9: 5.0, wk8: 5.0, wk7: 4.1, wk6: 4.1, total_ratings: 382 },
 { sku:'502764GE', asin:'B07NFLRN23', current_week_rating: 4.2, wk9: 4.0, wk8: 4.0, wk7: 4.1, wk6: 4.1, total_ratings: 111 },
 { sku:'442398GE', asin:'B07NFLRN23', current_week_rating: 1.2, wk9: 4.0, wk8: 4.0, wk7: 4.1, wk6: 4.1, total_ratings: 226 },
];

I removed all items from the static array and created a blank tabledata variable/array: var tabledata = [];

var tabledata = [];
var i;
for (i = 0; i < phpjs.amazon_ratings.length; i++) {
 tabledata.sku = phpjs.amazon_ratings[i].sku;
 tabledata.asin = phpjs.amazon_ratings[i].asin;
 tabledata.current_week_rating = phpjs.amazon_ratings[i].rating;
 tabledata.wk9 = '4.5'; // static for now, can be ignored.
 tabledata.wk8 = '4.0'; // static for now, can be ignored.
 tabledata.wk7 = '4.8'; // static for now, can be ignored.
 tabledata.wk6 = '3.0'; // static for now, can be ignored.
 tabledata.total_ratings = phpjs.amazon_ratings[i].ratings_total;
}
console.log(tabledata);

Here is the result of the console log:

[sku: "448741GE", asin: "B001AH2LKE", current_week_rating: "4.7", wk9: "4.5", wk8: "4.0", ...]

So, I can tell it's overriding each time and leaving the last one only. Presume I'll need to add the [i] key to my loop items but not sure where yet. Tried but failed with: tabledata[i]

• Nick: Can you explain "Tried but failed with: tabledata[i]"? What didn't work?
• Pointy: You'll have to create and initialize a new empty object inside the loop, and then .push() the object onto the end of the array.
• Emiel Zuurbier: Arrays are also object. So by doing: var arr = []; arr.something = 'hello'; you're assigning a property to the array. What you'll want is to create an object in the loop and use the push method to add the object to the array.
• charlietfl: Good use case for using Array#map() to create new array based on values in the phpjs.amazon_ratings array

Answer 1

To add items to the array, you should use the push() method. Your code will look somehow like this:

var tabledata = [];
var i;
for (i = 0; i < phpjs.amazon_ratings.length; i++) {
 // Create the item object
 var item = {};
 item.sku = phpjs.amazon_ratings[i].sku;
 item.asin = phpjs.amazon_ratings[i].asin;
 item.current_week_rating = phpjs.amazon_ratings[i].rating;
 item.wk9 = '4.5'; // static for now, can be ignored.
 item.wk8 = '4.0'; // static for now, can be ignored.
 item.wk7 = '4.8'; // static for now, can be ignored.
 item.wk6 = '3.0'; // static for now, can be ignored.
 item.total_ratings = phpjs.amazon_ratings[i].ratings_total;
 // Add it to the array
 tabledata.push(item);
}
console.log(tabledata);

Another approach is using map() method, which makes the code cleaner, IMHO. In this case, your code looks like below:

var tabledata = phpjs.amazon_ratings.map(item => {
 return {
 'sku': item.sku,
 'asin': item.asin,
 'current_week_rating': item.rating,
 'wk9': 4.5,
 'wk8': 4.0,
 'wk7': 4.8,
 'wk6': 3.0,
 'total_ratings': item.ratings_total
 };
});
console.log(tabledata);