Deleting object without causing null - javascript

I have the following function which needs to traverse an incredibly complicated json file. This json file goes in and out of arrays and objects:
removeRecords(data, id)
{
let k;
for (k of Object.keys(data)) {
if ((data[k] != null))
{
if ((data[k].hasOwnProperty('type')) && (data[k].hasOwnProperty('characterId')))
{
if ((data[k].type == "enableEscortingItem") || (data[k].type == "disableEscortingItem"))
{
if ((data[k].param1 == id))
{
delete data[k];
}
}
}
else
{
if ((typeof data[k] != 'string'))
{
this.removeRecords(data[k], id);
}
}
}
}
}
But when I delete and it's removing an object from an array I get: [null] whereas I want [] (if it's the only object in the array of course). I'm aware the appropriate way would be to use splice, but I can't use that since I don't know whether I'll be in an array or not at that time. I've also tried using .pop() and .shift().

Yes, when you delete an item from an array it is getting null instead of old value.
If you want replace null with something else use Array.map method.
If you want throw away element from the array - use Array.filter.
If you want to create completely new data type instead of you array (string, number, object etc) - use Array.reduce

Related

I need to recursively check a dynamic Tree Structure in Javascript

I need your help. So the goal this time is that i want to recursively check my tree structure.
Basically this is what i need it to do:
On the on side i have a so called treeNode (example: 'Article.Artnr') and on the other a so called contextEntry (which has an 'Article').
I need to check if the name in treeNode exists in contextEntry, if it exists i need to check the type of it and than go on. Now the tricky Part: The next name in the namesSplit is 'Artnr' which i need to check if it is an property from 'Article' in the contextEntry. Again if it is i need to check it's type and go on. I don't know beforehand how deep my structure will be so i really would appreciate your help on this one.
let namesSplit = treeNode.name.split('.');
let key = namesSplit[0];
let contextEntry = exprData.contextEntry.find(_x => _x.name === key);
I have implemented my Recursive check like so:
function recursive(names, contextEntry) {
for (let i = 0; i < names.length; i++) {
if (names[i] === contextEntry.name) {
// getType(contextEntry.value);
console.log('Name found in Context: ' + names[i]);
continue;
}
if (names[i] == Object.keys(contextEntry.value)) {
console.log(getType(contextEntry.value));
console.log('Child Name found in Context: ' + names[i]);
// console.log(Object.values(contextEntry.value));
}
}
}
recursive(namesSplit, contextEntry);
I also have to check the type of every value from the Context.
There are 4 possible datatypes: Primitive, Array of Primitive,
Object, Array of Objects
if the value in the context is either Primitive or an Array of Primitives it will throw an error, if it is an Object i need to just extract the value of it and if it is an Array of Objects i need to find the right object and than extract the value from it
VariableType is an enum.
My Check Function is implemented like so:
function getType(contextEntry.value) {
if (Array.isArray(contextEntry.value)) {
for (let i of contextEntry.value) {
if (isPrimitive(i)) {
return VariableType.ARRAY_OF_PRIMITIVES;
}
}
if (contextEntry.value.some(val => typeof val === 'object')) {
return VariableType.ARRAY_OF_OBJECTS;
}
}
if (typeof contextEntry.value === 'object' && contextEntry.value !== null) {
return VariableType.OBJECT;
}
if (isPrimitive(contextEntry.value)) {
return VariableType.PRIMITIVE;
}
}

replace object in array base on index

So, Im using react and I need to keep adding objects to an array of objects (object may have the same index, thats why I check for label and index). When the object that I want to add has the same label property as one that already is in that array, it should replace the previous object. So, lets say, only one object for each label. What I have works until I work with more then one label. When I do so, the array accepts more than one objects for each label...
if (this.state.thumbnailsAtivas.some(thumbnail => {
thumbnail.index === textura.index
}) && this.state.thumbnailsAtivas.some(thumbnail => {
thumbnail.label === textura.label
})) {
console.log("already in array");
}
else if (this.state.thumbnailsAtivas.some(thumbnail => thumbnail.label === textura.label)) {
console.log("label already with item");
this.state.thumbnailsAtivas.some((thumbnail, index) => {
const tempData = (this.state.thumbnailsAtivas).slice(0);
tempData[index] = textura;
this.setState({thumbnailsAtivas: tempData})
})
} else {
this.setState({thumbnailsAtivas: [...this.state.thumbnailsAtivas, textura]},);
}
You can use another Array function called findIndex which have the same usage as some but returns a result like indexOf does (returns the index of the element in an array or -1 if no element matches):
let index = this.state.thumbnailsAtivas.findIndex(
thumbnail => thumbnail.label === textura.label
);
if(index !== -1) {
this.state.thumbnailsAtivas[index] = yourNewObject;
}
Note: To optimise your code a little bit, you could get rid of the call to some and use findIndex (once) for both checking existence and finding the index.

Checking if object is already in array not working

I am trying to check if an object is already in an array, following this answer here: How to determine if object is in array
I adjusted the function to suit my needs, and now it looks like this:
var _createDatesArray, _objInArray;
_objInArray = function(array, obj) {
var i;
i = 0;
while (i < array.length) {
console.log("array[i] == obj is ", array[i] === obj, " array[i] is ", array[i], " and obj is ", obj);
if (array[i] === obj) {
return true;
}
i++;
}
};
_createDatesArray = function(val) {
var result;
if (val != null) {
result = {
text: val
};
if (!_objInArray(scope.datesQuestion.dates, result)) {
scope.datesQuestion.dates.push(result);
}
return console.log(scope.datesQuestion.dates);
}
};
What I need to do, is basically see if the object is already in the array, and if is,t return true.
When debugging, the result of the console log is the following:
array[i] == obj is false array[i] is {text: "10/08/17"} and obj is
{text: "10/08/17"}
and the function says they are different (array[i] == obj is false) but they look the same to me.
I also checked the type of both, which is this:
typeof array[i] is "object"
typeof obj is "object"
can you help me with this? Why are they different? what can be different?
_createDatesArray is called when $scope of my angular app changes its value based on a ng-model, but I don't think this is relevant
They're two different objects with the same content. Comparing them with == or === will yield false.
Since you're using AngularJS, you can use angular.equals() instead to perform a deep comparison of the object's properties.
The objects you are comparing don't have the same reference, so == is returning false. See Object comparison in JavaScript for a more detailed explanation.
In this particular case, you could simply compare the text of dates to see if they are equivilant. However this wouldn't work for all objects like the function name suggests.
if (arr[i].text === obj.text)
Alternatively, you could create a method specific for checking if your array includes a given date and simplify it greatly using Array.prototype.some:
dateInArray = function (array, date) {
return array.some(function (arrayDate) {
return arrayDate.text === date.text
})
}
Or, more succinctly using ES6 arrow functions:
dateInArray = (array, date) => array.some(arrayDate => arrayDate.text === date.text)
array[i] === obj will return true ONLY if its the same object. In the link that you have referred the object being checked is the same object that is inserted in the array, thats why it returns true. In your case, you are creating a new object 'result' and adding the value in there. So the array does not contain the exact same object and hence returns false.
If 'text' is the only property in the object, instead of checking for the entire object you could check if the 'text' property in both the objects is same.
_objInArray = function(array, obj) {
var i;
i = 0;
while (i < array.length) {
if (array[i].text === obj.text) {
return true;
}
i++;
}
};
This happens because objects in JS are compared by reference, but not by values they have. But you need to compare objects by their value. So you need to get some third-party function or to write your own. One more option is to use angular built-in equals function.
angular.equals($scope.user1, $scope.user2);
For a better understanding you can read a good article on this subject here.

Building and maintaining an options array/object in JavaScript

I'm building a faceted/filtering search for a project I'm currently working on and I'm looking for a function (or jquery plugin) to help me do this. Let's say I have an object like the following:
var options = {
"country": 2,
"Gender": 1
}
I then have a function called filter(). I pass filter the key and value of the option I want to toggle/add/update. My current function is causing me nothing but trouble and I'm too far down the debugging rabbit hole to make it worth posting. Essentially I have this:
filter('country', 3);
would update the 'country' key to have '3' as its new value.
filter('Age Group', 4);
would add that key/value pair to the options object.
filter('Gender', 1);
would remove the 'Gender' key from the object completely.
How about this obvious implementation:
​function filter(o, key, val)​ {
if (o.hasOwnProperty(key) && o[key] == val) {
delete o[key];
} else {
o[key] = val;
}
}
?
I'd suggest this:
​function filter(o, key, val)​ {
if (o[key] === val) {
delete o[key];
} else {
o[key] = val;
}
}
If the key does not exist as a property of the object, then o[key] will be undefined which will not match val so it will add the key/value.
If the key exists, but the val does not match, it will set the key/value
If the key exists and the val matches, it will remove the key.
Note: it's important to use === to make sure there's no auto-type conversion in the comparison.
Or, if you want a function that automatically works with your options variable, then you could use this:
​function filter(key, val)​ {
if (options[key] === val) {
delete options[key];
} else {
options[key] = val;
}
}
Personally, I think code is more readable if you make explicit setKey and removeKey functions rather than this variable operation based on whether the key previously exists or whether it matches.

How to identify anonymous types in JSON?

I am writing one function on Javascript which needs to address all the anynymous types in a JSON object.
For example,
Typed= {
emails: [{email:'a#a.com'}, {email:'b#a.com'}, {email:'c#a.com'}, {email:'d#a.com'}]
};
is an example of typed array in a JSON because each element inside the array is typed email
while,
Anon= {
emails: ['a#a.com', 'b#a.com', 'c#a.com', 'd#a.com']
};
is a JSON object where emails is collection of some anonymous objects.
Is there any ways that I can differentiate between both in JQuery or Javascript?
The simplest solution is to have the JSON source only return one of the two forms. Then you don't have to branch in your client.
If that's not an option, you could get the values out with JavaScript's handy lazy-evaluation of boolean expressions:
var em = json.emails[0].email || json.emails[0];
That statement will prefer the array-of-objects version, but use the array-of-strings version as a fallback.
(edited in response to clarifying comment below)
You can determine what properties a JS object has at runtime like this:
function enumerate(targetObject){
var props = [];
for (var propName in targetObject ){
props.push(propName);
}
return props;
}
console.log(enumerate({foo:1, bar:'baz'}),join(',')); //"foo, bar"
you could then modulate your logic on the basis of the properties you get back. You'll want to make sure you understand prototypes (specifically what Object.hasOwnProperty does and means), too.
You can use Array iteration methods to quickly check if all (or some) elements of the array have the desired type:
Anon.emails.every(function(e) { return typeof e == "object" }) // false
Typed.emails.every(function(e) { return typeof e == "object" }) // true
or a more generic solution
typeCheck = function(type) {
return function() {
return typeof arguments[0] == type
}
}
Anon.emails.every(typeCheck("object")) // false
Typed.emails.every(typeCheck("object")) // true
(An obligatory warning about iteration methods not being supported in ancient browsers)
How about this:
var istyped = function (a) {
if (typeof(a) !== 'object') {
return false;
}
var count = 0;
for (var key in a) {
count = count + 1;
}
return (count === 1);
}
I'm assuming here you just want to distinguish between regular variables (this would be your anonymous variable) and objects with just one key/value pair inside (this would be your typed variable).
To check if array contains only typed variables you'd just have to loop through it with that function. For example (in newer versions of JavaScript):
Typed.emails.every(istyped) = true
Anon.emails.every(istyped) = false
Why not do a map first:
emails = emails.map(function (email) {
if (typeof email.email === 'string')
return email.email;
});
That will make your emails array an array of just strings. Then you can just process it as usual. There aren't any side-effects if it is an array of strings (email.email will be undefined).
I do stuff like this when I have to make one client deal with multiple versions of an API. Alternatively, you could do the map the other way:
emails = emails.map(function (email) {
if (typeof email === 'string')
return {email: email};
});
This would work better if there could be other information in each object in your emails array.

Categories

Resources