Although I have some basic JavaScript background, I stumbled upon this code that I wrote:
var data=[{"_id":"57b3e7ec9b209674f1459f36","fName":"Tom","lName":"Moody","email":"Tom#example.com","age":30},{"_id":"57b3e8079b209674f1459f37","fName":"Pat","lName":"Smith","email":"pat#example.com","age":32},{"_id":"57b3e8209b209674f1459f38","fName":"Sam","lName":"Dawn","email":"sam#example.com","age":28},{"_id":"57b3e8219b209674f1459f39","fName":"Sam","lName":"Dawn","email":"sam#example.com","age":28}]
var tempArr=[];
var table=[];
var dataArr = Object.keys(data).map(function(k) { return data[k] });
dataArr.forEach(function(user) {
tempArr[0]=user.fName;
tempArr[1]=user.lName;
tempArr[2]=user.email;
tempArr[3]=user.age;
table.push(tempArr);
console.log('table'+JSON.stringify(table));
});
In the final loop, I expected table to contain the arrays for Tom, Pat, and Sam . Instead, this is what I got:
table[["Tom","Moody","Tom#example.com",30]]
table[["Pat","Smith","pat#example.com",32],["Pat","Smith","pat#example.com",32]]
table[["Sam","Dawn","sam#example.com",28],["Sam","Dawn","sam#example.com",28],["Sam","Dawn","sam#example.com",28]]
table[["Sam","Dawn","sam#example.com",28],["Sam","Dawn","sam#example.com",28],["Sam","Dawn","sam#example.com",28],["Sam","Dawn","sam#example.com",28]]
Why is push() replacing the previous entry in table? Any help will be highly appreciated.
The others already pointed out problems in your code.
However, you also make things more complicated than necessary. You can just do this:
var data=[{"_id":"57b3e7ec9b209674f1459f36","fName":"Tom","lName":"Moody","email":"Tom#example.com","age":30},{"_id":"57b3e8079b209674f1459f37","fName":"Pat","lName":"Smith","email":"pat#example.com","age":32},{"_id":"57b3e8209b209674f1459f38","fName":"Sam","lName":"Dawn","email":"sam#example.com","age":28},{"_id":"57b3e8219b209674f1459f39","fName":"Sam","lName":"Dawn","email":"sam#example.com","age":28}];
var table = data.map(function(user) {
return [
user.fName,
user.lName,
user.email,
user.age,
];
});
console.log(table);
Or if you use ES6:
var table = data.map(user => [ user.fName, user.lName, user.email, user.age ];
You don't need to write all the boilerplate code by hand. Use a proper array iterator (map in your case).
var table = data.map(function(user) {
return [user.fName, user.lName, user.email, user.age];
});
Obviously map isthe way to go for the sake of functional approach however if you like imperative styles one simplistic way could be using for of loop as follows.
var data = [{"_id":"57b3e7ec9b209674f1459f36","fName":"Tom","lName":"Moody","email":"Tom#example.com","age":30},{"_id":"57b3e8079b209674f1459f37","fName":"Pat","lName":"Smith","email":"pat#example.com","age":32},{"_id":"57b3e8209b209674f1459f38","fName":"Sam","lName":"Dawn","email":"sam#example.com","age":28},{"_id":"57b3e8219b209674f1459f39","fName":"Sam","lName":"Dawn","email":"sam#example.com","age":28}],
table = [];
for (var user of data) table.push([user.fName,user.lName,user.email,user.age]);
console.log(table);
Problem here is not with push. Variable in javascript store reference to array. And in table you are pushing reference to same array tempArr. You need to create new array before pushing it or create deep copy of array before pushing it.
Example
var data=[{"_id":"57b3e7ec9b209674f1459f36","fName":"Tom","lName":"Moody","email":"Tom#example.com","age":30},{"_id":"57b3e8079b209674f1459f37","fName":"Pat","lName":"Smith","email":"pat#example.com","age":32},{"_id":"57b3e8209b209674f1459f38","fName":"Sam","lName":"Dawn","email":"sam#example.com","age":28},{"_id":"57b3e8219b209674f1459f39","fName":"Sam","lName":"Dawn","email":"sam#example.com","age":28}]
var table=[];
var dataArr = Object.keys(data).map(function(k) { return data[k] });
dataArr.forEach(function(user) {
var tempArr=[];
tempArr[0]=user.fName;
tempArr[1]=user.lName;
tempArr[2]=user.email;
tempArr[3]=user.age;
table.push(tempArr);
console.log('table'+JSON.stringify(table));
});
Well, unlike a lot of other languages, JavaScript has passes everything by reference. That means that when you table.push(tempArr);, you're not actually pushing the values of tempArr, you're pushing a reference to tempArr. So, if you do this:
var a = 'a';
var table = [];
table.push(a);
a = 'b';
console.log(table[0]);
You'll get b as your output. What you want to do is define a new variable to push, like this
var data=[{"_id":"57b3e7ec9b209674f1459f36","fName":"Tom","lName":"Moody","email":"Tom#example.com","age":30},{"_id":"57b3e8079b209674f1459f37","fName":"Pat","lName":"Smith","email":"pat#example.com","age":32},{"_id":"57b3e8209b209674f1459f38","fName":"Sam","lName":"Dawn","email":"sam#example.com","age":28},{"_id":"57b3e8219b209674f1459f39","fName":"Sam","lName":"Dawn","email":"sam#example.com","age":28}]
var table=[];
var dataArr = Object.keys(data).map(function(k) { return data[k] });
dataArr.forEach(function(user) {
var tempArr=[];
tempArr[0]=user.fName;
tempArr[1]=user.lName;
tempArr[2]=user.email;
tempArr[3]=user.age;
table.push(tempArr);
});
console.log('table'+JSON.stringify(table));
var data = [{"_id": "57b3e7ec9b209674f1459f36","fName": "Tom","lName": "Moody","email": "Tom#example.com","age": 30}, {"_id": "57b3e8079b209674f1459f37","fName": "Pat","lName": "Smith","email": "pat#example.com","age": 32}, {"_id": "57b3e8209b209674f1459f38","fName": "Sam","lName": "Dawn","email": "sam#example.com","age": 28}, {"_id": "57b3e8219b209674f1459f39","fName": "Sam","lName": "Dawn","email": "sam#example.com","age": 28}],
table = [];
data.forEach(function(user) {
table.push([user.fName, user.lName, user.email, user.age]);
});
console.log(table);
I'm new to javascript and probably trying to do something stupid since an hour of googling didn't result in any examples.
I'm trying to learn objects so I made a constructor function like this:
//generic object
function clip(name, xposition, firstVisibleFrame, lastVisibleFrame, playStart, playEnd, defaultFrame, seqLoopStart, seqLoopEnd, backStateLevel){
this.name = name;
this.xposition = xposition;
this.outlinesArray =[];
this.firstVisibleFrame = firstVisibleFrame;
this.lastVisibleFrame = lastVisibleFrame;
this.outlinePath = ("outlines/" +this.name +"_");
this.playStart = playStart;
this.playEnd = playEnd;
this.defaultFrame = defaultFrame;
this.seqLoopStart = seqLoopStart;
this.seqLoopEnd = seqLoopEnd;
this.backStateLevel = backStateLevel;
};
Next I will create a new instance of that object with something like:
livingroomTable = new clip("livingroomTable");
...but now I'm really stuck because the next parameter I should pass to the function is actually a huge array with hundreds of values..
I tried to put the array inside the argument like this:
livingroomTable = new clip("livingroomTable", [value1, value2, value3, value4, value5 and so on and so on]);
but this gives me a syntax error.
I don't want to make this array a global variable either. What is the correct syntax of passing an array of values as a part of the function call's arguments?
EDIT:
Here is the actual code:
//generic object
function clip(name, xposition, firstVisibleFrame, lastVisibleFrame, playStart, playEnd, defaultFrame, seqLoopStart, seqLoopEnd, backStateLevel){
this.name = name; //objektin nimi tulee funktion kutsusta
this.xposition = xposition;
this.outlinesArray =[];
this.firstVisibleFrame = firstVisibleFrame;
this.lastVisibleFrame = lastVisibleFrame;
this.outlinePath = ("outlines/" +this.name +"_");
this.playStart = playStart;
this.playEnd = playEnd;
this.defaultFrame = defaultFrame;
this.seqLoopStart = seqLoopStart;
this.seqLoopEnd = seqLoopEnd;
this.backStateLevel = backStateLevel;
};
livingroomTable = new clip(
"livingroomTable", //name
["1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1220.69","1216.69","1207.69","1194.69","1167.69","1157.01","1147.24","1137.62","1127.74","1118.55","1109.88","1100.17","1090.51","1080.69","1070.28","1059.5","1048.87","1038.21","1027.6","1017.31","1007.31","997.208","987.153","977.152","967.848","959.258","950.808","942.887","935.103","927.326","919.256","910.834","902.452","894.231","886.561","879.269","872.072","865.057","858.292","851.484","844.527","837.655","830.747","823.629","815.898","807.221","798.142","789.152","780.341","771.358","762.248","753.089","743.97","734.954","726.148","717.699","709.299","700.826","692.102","682.849","673.258","663.37","653.188","642.48","631.498","620.551","609.866","599.544","589.439","579.088","568.508","557.794","547.028","536.037","524.912","514.043","502.899","491.412","480.102","469.097","457.844","446.368","434.919","423.84","412.74","401.657","390.55","379.284","368.162","357.316","346.606","335.973","325.144","314.01","302.658","291.207","279.392","267.133","254.62","241.775","229.179","216.763","204.423","192.239","180.41","168.484","155.502","141.701","127.828","114.008","100.403","87.0368","73.5946","59.7342","45.3524","31.0484","16.8761","helmi.96","-11.522","-25.6947","-39.5332","-53.1723","-66.7146","-80.253","-93.1294","-106.086","-119.531","-133.534","-148.801","-165.444","-183.67","-202.813","-222.634","-242.769","-263.074","-283.495","-303.787","-322.998","-341.376","-359.338","-377.081","-395.064","-413.628","-432.233","-451.409","-472.675","-493.827","-515.078","-537.029","-558.747","-583.8","-610.595","-645.864","-695.789","-711.965","-737.979","-752.979","-836.048","-862.75","-864.75","-884.835","-911.473","-927.473","-969.103","-1030.36","-1002.83","-1036.08","-1048.08","-1048.08","-1048.08","-1048.08","-1048.08","-1048.08","-1048.08","-1048.08","-1048.08","-1048.08","-1048.08","-1048.08","-1048.08","-1048.08","-1048.08","-1048.08","-1048.08","-1048.08","-1048.08","-1048.08","-1048.08","-1048.08","-1048.08","-1048.08","-1048.08","-1048.08","-1048.08","-1048.08","-1048.08","-1048.08","-1048.08","-1048.08","-1048.08","-1048.08","-1048.08"];, //xposition
352, //firstVisibleFrame
545, //lastVisibleFrame
2058, //playStart
2304, //playEnd
2175, //defaultFrame
-1000, //seqLoopStart
-1000, //seqLoopEnd
1 //backStateLevel
);
Hmmmm actually I think my problem is the semicolon at the end of array right? :D
You're getting a SyntaxError because you have a ; semicolon at the end of the Array.
Remove that, and the error should go away.
["1220.69","1220.69", ..., "-1048.08","-1048.08","-1048.08"];, // <-- right here
It should look like this...
["1220.69","1220.69", ..., "-1048.08","-1048.08","-1048.08"], // <-- just a comma
You may want to consider using a code validator like JSHint.
There is nothing wrong with the principle that you are using.
You can put the array in a variable, and pass that to the function:
theArray = [1,2,3,4,5];
livingroomTable = new clip("livingroomTable", theArray);
Or you can use an array literal directly in the call:
livingroomTable = new clip("livingroomTable", [1,2,3,4,5]);
So, your constructor don't expect string and array parameters. You must call like that:
livingroomTable = new clip("livingroomTable", value1, value2, value3, value4, ...);