We Keep Coding

splice is not removing the first index from array of objects

I have two arrays of objects and I want to compare the objects of the first array to the ones of the second array. If they match, I use the splice to remove the object from the second array.
I have the following code
existing.forEach((existingitem, existingindex, existingfeatures) => {
(newdatafeat.features).forEach((newitem, newindex, newfeatures) => {
console.log('existing index-name --- new index-name', existingindex ,' - ',existingitem.values_.name,' - ',newindex,' - ',newitem.properties.name,'-----');
if (existingitem.values_.id == newitem.properties.id && existingitem.values_.cat == newitem.properties.cat){
console.log(' index to remove - ', newindex); (newdatafeat.features).splice(newindex,1);
}
})
});
So, If existing is
var existing= [
{ info: true, values_:{id:1, cat:true, name : "John"} },
{ info : true, values_:{id:2, cat:false, name : "Alice"} }
];
and newdatafeat.features is
var newdatafeat= {
status:scanned,
features : [ { info: true, properties:{id:1, cat:true, name : "Mike"} },
{ info : false, properties:{id:22, cat:false,name : "Jenny"} } ]
};
Then, Mike from newdatafeat.features should be removed.
The error is that every item of the newdatafeat.features array with index 0 is not removed. In the loop, I can see index to remove - 0, but Mike is never removed. I know, because if I console.log the newdatafeat.features after the loops, Mike is there
This is inside an angular6 code.
What am I missing here?
Thanks

I had to clean up some code, but it looks like yours is working fine. It identified one element to be removed, called slice and it was gone.
var existing = [{
info: true,
values_: {
id: 1,
cat: true,
name: "John"
}
},
{
info: true,
values_: {
id: 2,
cat: false,
name: "Alice"
}
}
];
var newdata = {
status: "scanned",
features: [
{
info: true,
properties: {
id: 1,
cat: true,
name: "Mike"
}
},
{
info: false,
properties: {
id: 22,
cat: false,
name: "Jenny"
}
}
]
};
existing.forEach(
(existingitem, existingindex, existingfeatures) => {
(newdata.features).forEach((newitem, newindex, newfeatures) => {
console.log('existing index-name --- new index-name', existingindex, ' - ', existingitem.values_.name, ' - ', newindex, ' - ', newitem.properties.name, '-----');
if (existingitem.values_.id == newitem.properties.id && existingitem.values_.cat == newitem.properties.cat) {
console.log(' index to remove - ', newindex);
(newdata.features).splice(newindex, 1);
}
})
});
console.log(newdata.features);

The main problem here is that you are iterating an array in a loop, but you are removing items from that array in the same loop. So the index will often be off, and the wrong element or no element will be removed. It can be hard to reproduce with simple examples, but here ya go:
function removeVowels(letters) {
letters.forEach((element, index, arr) => {
if ('aeiou'.indexOf(element) > -1) {
arr.splice(index, 1);
}
});
}
var myArray = ['a','b','c','d','e'];
removeVowels(myArray);
console.log(myArray);
// works great!
var myArray = ['a','e','c','d','b'];
removeVowels(myArray);
console.log(myArray);
// wtf!
A simple way to approach this problem is to handle the looping manually, and change the index manually if you DO remove an element.
function removeVowels(letters) {
for (var i=0; i < letters.length; i++) {
if ('aeiou'.indexOf(letters[i]) > -1) {
letters.splice(i, 1);
i--;
}
}
}
var myArray = ['a','b','c','d','e'];
removeVowels(myArray);
console.log(myArray);
// works great!
var myArray = ['a','e','c','d','b'];
removeVowels(myArray);
console.log(myArray);
// hurray!

Fill in missing properties in an array of objects

What is the best way to fill in missing properties in an array of objects, such as this example:
[
{
name: 'Tom',
number: '01234 567 890',
website: 'http://www.tom.com'
},
{
name: 'Richard',
number '07777 666 555'
},
{
name: 'Harry',
website: 'http://www.harry.com'
}
]
I need to add the missing properties with a null value, so that when I pass this array on to be rendered in something such as a HTML table or CSV file, everything lines up correctly. I was thinking of passing over the array twice, once to get all the possible properties, and a second time to add those missing properties with a null value to each object where it doesn't exist. Is there a better way to do this?
EDIT: I won't know what the keys are until I have the data, it's coming from an API and the keys are not always requested explicitly.
My final solution
Thanks all, it seems the two pass approach is indeed the best approach. After I started to write this using the examples provided, I realised that the order of the properties wasn't being maintained. This is how I achieved filling in the missing props, and maintaining the correct order. Any suggestions for potential improvements are welcome.
var fillMissingProps = function(arr) {
// build a list of keys in the correct order
var keys = [];
arr.forEach(function(obj) {
var lastIndex = -1;
Object.keys(obj).forEach(function(key, i) {
if (keys.includes(key)) {
// record the position of the existing key
lastIndex = keys.lastIndexOf(key);
if (lastIndex < i) {
// this key is in the wrong position so move it
keys.splice(i, 0, keys.splice(lastIndex, 1)[0]);
lastIndex = i;
}
} else {
// add the new key in the correct position
// after the previous existing key
lastIndex++;
keys.splice(lastIndex, 0, key);
}
});
});
// build a template object with all props set to null
// and in the correct position
var defaults = {};
keys.forEach(function(key) {
defaults[key] = null;
});
// and update the array by overwriting each element with a
// new object that's built from the template and the original object
arr.forEach(function(obj, i, arr) {
arr[i] = Object.assign({}, defaults, obj);
});
return arr;
};
/** TEST **/
var currentArray = [
{
website: 'http://www.unknown.com'
},
{
name: 'Tom',
number: '01234 567 890',
website: 'http://www.tom.com'
},
{
title: 'Mr',
name: 'Richard',
gender: 'Male',
number: '04321 666 555'
},
{
id: '003ABCDEFGHIJKL',
name: 'Harry',
website: 'http://www.harry.com',
mobile: '07890 123 456',
city: 'Brentwood',
county: 'Essex'
}
];
var newArray = fillMissingProps(currentArray);
for (var i = 0; i < newArray.length; i++) {
for (var prop in newArray[i]) {
console.log(prop + ": " + newArray[i][prop]);
}
console.log('---------');
}

Given that you don't know apriori which keys are supposed to exist, you have no choice but to iterate over the array twice:
// build a map of unique keys (with null values)
var keys = {}
array.forEach(el => Object.keys(el).forEach(k => keys[k] = null));
// and update the array by overwriting each element with a
// new object that's built from the null map and the original object
array.forEach((el, ix, a) => a[ix] = Object.assign({}, keys, el));

Use Array.prototype.map():
const arr = [
{
name: 'Tom',
number: '01234 567 890',
website: 'http://www.tom.com',
},
{
name: 'Richard',
number: '07777 666 555',
},
{
name: 'Harry',
website: 'http://www.harry.com',
},
];
const newArr = arr.map(x => (
arr.map(x => Object.keys(x))
.reduce((a, b) =>
(b.forEach(z => a.includes(z) || a.push(z)), a)
)
.forEach(
y => (x[y] = x.hasOwnProperty(y) ? x[y] : null)
), x)
);
console.log(newArr);

Here is a more interesting answer, its a tad fun one but it will build up your objects on the fly as new properties appear:
var currentArray = [
{
name: 'Tom',
number: '01234 567 890',
website: 'http://www.tom.com'
},
{
name: 'Richard',
number: '07777 666 555'
},
{
name: 'Harry',
website: 'http://www.harry.com'
}
]
var newArray = []
function NewObject() {
}
for(var i = 0; i < currentArray.length; i++){
var nObj = new NewObject();
for(var prop in currentArray[i]){
if(!NewObject.hasOwnProperty(prop))
NewObject.prototype[prop] = null;
nObj[prop]=currentArray[i][prop];
}
newArray.push(nObj);
}
for(var i = 0; i < newArray.length; i++){
for(var prop in newArray[i]){
console.log(prop+ ": "+newArray[i][prop]);
}
console.log('---------');
}
It builds new objects from the ones you provide and adds new properties to the objects if they don't exist already.
This idea was more for curiosities sake tho so any comments would be interesting :)

You can get all keys and set all keys using for..of loop, .map() to iterate all Object.keys(), redefine original array
var arr = [{
name: 'Harry',
website: 'http://www.harry.com'
},{
name: 'Tom',
number: '01234 567 890',
website: 'http://www.tom.com'
}, {
name: 'Richard',
number: '07777 666 555'
}];
for (var obj of arr) {
for (var key of Object.keys(obj)) {
arr = arr.map(o => (o[key] = o[key] || null, o))
}
};
console.log(arr);

Something like this could work:
for (var i = 0; i < arrayLength; i++) {
yourArray[i].name = yourArray[i].name || null;
yourArray[i].number = yourArray[i].number || null;
yourArray[i].website= yourArray[i].website|| null;
}

How to convert mongo ObjectId .toString without including 'ObjectId()' wrapper -- just the Value?

What I'm trying to solve is: preserving the order of my array of Ids with $in using this suggested method (mapReduce):
Does MongoDB's $in clause guarantee order
I've done my homework, and saw it's ideal to convert them to strings:
Comparing mongoose _id and strings.
Code:
var dataIds = [ '57a1152a4d124a4d1ad12d80',
'57a115304d124a4d1ad12d81',
'5795316dabfaa62383341a79',
'5795315aabfaa62383341a76',
'57a114d64d124a4d1ad12d7f',
'57953165abfaa62383341a78' ];
CollectionSchema.statics.all = function() {
var obj = {};
//adds dataIds to obj.scope as inputs , to be accessed in obj.map
obj.scope = {'inputs': dataIds};
obj.map = function() {
//used toString method as suggested in other SO answer, but still get -1 for Id.
var order = inputs.indexOf(this._id.toString());
emit(order, {
doc : this
});
};
obj.reduce = function() {};
obj.out = {inline: 1};
obj.query = {"_id": {"$in": dataIds } };
obj.finalize = function(key, value) {
return value;
};
return Product
.mapReduce(obj)
.then(function(products){
console.log('map products : ', products)
})
};
This is what I keep getting back for my console.log in the products promise :
[{ _id: -1, value: null } ]
Which, leads me to believe it's not able to match the ObjectId from this, with an index of dataIds. However, if I just use the $in clause within a .find(), the correct products are returned -- but, in the incorrect order.
Update:
getting unexpected behavior with this.
obj.map = function() {
for(var i = 0; i < inputs.length; i++){
if(inputs[i] == this._id.toString()){
}
emit(inputs[i], this);
}
};
emits:
[ { _id: '5795315aabfaa62383341a76', value: null },
{ _id: '57953165abfaa62383341a78', value: null },
{ _id: '5795316dabfaa62383341a79', value: null },
{ _id: '57a114d64d124a4d1ad12d7f', value: null },
{ _id: '57a1152a4d124a4d1ad12d80', value: null },
{ _id: '57a115304d124a4d1ad12d81', value: null } ]
obj.map = function() {
for(var i = 0; i < inputs.length; i++){
if(inputs[i] == this._id.toString()){
var order = i;
}
emit(this._id.toString(), this);
}
};
emits:
[ { _id: 'ObjectId("5795315aabfaa62383341a76")', value: null },
{ _id: 'ObjectId("57953165abfaa62383341a78")', value: null },
{ _id: 'ObjectId("5795316dabfaa62383341a79")', value: null },
{ _id: 'ObjectId("57a114d64d124a4d1ad12d7f")', value: null },
{ _id: 'ObjectId("57a1152a4d124a4d1ad12d80")', value: null },
{ _id: 'ObjectId("57a115304d124a4d1ad12d81")', value: null } ]
Now, how do I get rid of the ObjectId() wrapper? Preferably, something more clean than str.slice(), which would work -- However, I feel there must be a more "mongo" / safer way of converting the Id.
I checked out the docs, but it only mentions the toString() method, which does not seem to be working correctly within map: https://docs.mongodb.com/manual/reference/method/ObjectId.toString/

figured it out:
obj.map = function() {
for(var i = 0; i < inputs.length; i++){
if(this._id.equals(inputs[i])) {
var order = i;
}
}
emit(order, {doc: this});
};

Loop through multidimensional array with all unique IDs

I have a multidimensional array but the ID's are unique across parents and children, so I have a problem looping through using a for loop. The problem is that I cannot seem to grab the ID of the children. How do you think I should handle this?
var Options = [
{
id: 0,
children: []
},
{
id: 2,
children: []
},
{
id: 3,
children: [
{
id: 4,
children: []
},
{
id: 5,
children: []
},
{
id: 6,
children: []
}
]
},
{
id: 7,
children: [
{
id: 8,
children: []
},
{
id: 9,
children: []
}
]
}
];
I have kept the code concise for the sake of brevity. What I am trying to do is iterate through the array to compare ID's.

This does not look like a "multidimensional array", but rather like a tree. Looping one level can be done with a simple for-loop:
for (var i=0; i<Options.length; i++) // do something
To loop the tree in-order, you will need a recursive function:
function loop (children, callback) {
for (var i=0; i<children.length; i++) {
callback(children[i]);
loop(children[i].children, callback);
}
}
loop(Options, console.log);
To get all children by their id, so that you can loop through the ids (regardless of the tree structure), use a lookup table:
var nodesById = {};
loop(Options, function(node) {
nodesById[node.id] = node;
});
// access:
nodesById[4];
…and to loop them sorted by id, you now can do
Object.keys(nodesById).sort(function(a,b){return a-b;}).forEach(function(id) {
var node = nodesById[id];
// do something
});

How about recursion?
var findById = function (arr, id) {
var i, l, c;
for (i = 0, l = arr.length; i < l; i++) {
if (arr[i].id === id) {
return arr[i];
}
else {
c = findById(arr[i].children, id);
if (c !== null) {
return c;
}
}
}
return null;
}
findById(Options, 8);

Ah, use recursion :D
var Options = "defined above";//[]
var OptionArray = []; //just as an example (not sure what you want to do after looping)
(function looper(start){
for( var i = 0, len = start.length; i < len; i++ ){
var currentOption = start[i];
if( currentOption.id > 3 ){//could be more complex
OptionArray.push(currentOption);
}
if( currentOption.children.length > 0 ){
looper(currentOption.children);
}
}
})(Options);

combine js array's

pretty simple question, can't quite fig. it out.
I have 2 js array's that I need to combine into a new array, based on sub_key.
var items = [
Object {
OBJECTID=1,
Name="COMMAND B",
ID="AR0xx",
sub_key="1000"
},
Object {
OBJECTID=2,
Name="95TH PCT",
ID="AR0xx",
sub_key="1001"
},
Object {
OBJECTID=379,
Name="dummy4",
ID="AR0xx",
sub_key="9999"
}
];
var subitems = [
Object {
OBJECTID=787,
ID="AR0xx",
sub_key=1000,
Long_Name = foo
},
Object {
OBJECTID=789,
ID="AR0xx",
sub_key=1001,
Long_Name = "bar"
},
Object {
OBJECTID=1,
ID="AR0xx",
sub_key=1001,
Long_Name="baz"
},
Object {
OBJECTID=788,
ID="AR0xx",
sub_key=1001,
Long_Name="buzzz"
}
];
I'd like to create an array like so, which just combines the above 2, based on sub_key
var data = [
COMMAND B=["foo"],
95TH PCT=["bar","baz","buzz"]
dummy4=[]
];
Here's what I tried but it doesn't work... i think i'm close?? thanks for any help!
data = [];
for (var key in items){
var o = items[key];
//data.push(o.Name);
for (var subkey in subitems){
subo = subitems[subkey];
if (o.sub_key == subo.sub_key){
data[o.Name].push(subo.Long_Name)
}
}
}

Cleaning up your script, here is what you are trying to do. It craetes an array of objects using the Name from items and matching sub_key from sub_items.
var items = [
{ OBJECTID: 1,
Name: 'COMMAND B',
ID: 'AR0xx',
sub_key: '1000'
},
{ OBJECTID: 2,
Name: '95TH PCT',
ID: 'AR0xx',
sub_key: '1001'
},
{ OBJECTID: 379,
Name: 'dummy4',
ID: 'AR0xx',
sub_key: '9999'
}
];
var subitems = [
{ BJECTID: 787,
ID: 'AR0xx',
sub_key: '1000',
Long_Name: 'foo'
},
{ OBJECTID: '789',
ID: 'AR0xx',
sub_key: '1001',
Long_Name: 'bar'
},
{ OBJECTID: '1',
ID: 'AR0xx',
sub_key: 1001,
Long_Name: 'baz'
},
{ OBJECTID: '788',
ID: 'AR0xx',
sub_key: '1001',
Long_Name: 'buzzz'
}
];
var j = subitems.length;
var result = {};
var p;
var sub_key;
var obj;
for (var i=0, iLen = items.length; i<iLen; i++) {
p = items[i].Name;
result[p] = [];
sub_key = items[i].sub_key;
for (var j=0, jLen=subitems.length; j<jLen; j++) {
if (subitems[j].sub_key == sub_key) {
result[p].push(subitems[j].Long_Name);
}
}
}
alert(result['95TH PCT']); // bar, baz, buzz
Edit
Return a single object rather than an array of objects, which I think is what is required.

var newarray = items.slice(0); // make a copy
addloop: for (var i=0; i<subitems.length; i++) {
for (var j=0; j<newarray.length; j++)
if (subitems[i].sub_key == newarray[j].sub_key)
continue addloop;
newarray.push(subitems[i]);
}
should work. Another solution:
Array.prototype.combine = function(a, test) {
if (typeof test == "function") {
for (var i=0; i<a.length; i++)
if (! this.some(test.bind(null, a[i])))
this.push(a[i]);
} else {
for (var i=0; i<a.length; i++)
if (this.indexOf(a[i]) == -1)
this.push(a[i]);
}
return this;
};
var newarray = items.slice(0).combine(subitems, function(a, b) {
return a.sub_key == b.sub_key;
});

I wrote this on the train but didn't get to post it, and it looks like a couple of other people posted good answers since, but it might still be helpful so I'll post it anyways
I had a few different things to note:
var items = [
Object {
OBJECTID=1,
Name="COMMAND B",
ID="AR0xx",
sub_key="1000"
},
...
You don't need the word Object here, you can just write { ... } and JS knows it's an object.
Within an object, you need : instead of =
It's not required, but putting the key in quotes is good practice because some keys won't work otherwise.
So it should look like this:
var items = [
{
"OBJECTID": 1,
"Name": "COMMAND B",
"ID": "AR0xx",
"sub_key": "1000"
},
...
Next up, I'm not completely clear on what you're doing with your data array in the second block, but it looks like you're overriding it with an empty array in the third block.
Also, I think you may be confusing Objects and Arrays somewhat. http://nfriedly.com/techblog/2009/06/advanced-javascript-objects-arrays-and-array-like-objects/ has a good overview of the differences, but here's some key points:
Array is a subclass of Object
Array values always have numeric indexes, not string keys
push() is a method of Array not Object
Next up, your loop. for .. in style loops do work on arrays, but they're not generally recommended because they can also hit keys that were added to the underlying Object. forEach is my favorite but it's not always available in older browsers without a library such as underscore.js.
for(var i=0, len=MyArray.length; i<len; i++) {...} is the other option that you'll see very commonly because it covers all of the array items but does not have the possibility of hitting the underlying object.
But, since Bergi and RobG both have good loops, I'll stop here.