Dynamically create sub-objects and arrays when needed - javascript

I have an object created from JSON via AJAX from the server. The object has several sub-objects in an array, e.g.:
obj.subObj1[0].value="abc";
obj.subObj1[1].value="abc";
obj.subObj2[0].value="abc";
Now I want to set some values in this object but I dont know if they already exist.
obj.subObj1[0].value="new Value"; // No Problem
obj.subObj2[1].value="new Value2"; // Problem because obj.subObj2[1] is no Object.
I would need to do obj.subObj2[1]={} first.
Because I have this problem very often I am looking for method to automate this. A method or class which does automatically create the needed object (or array if I use an integer).
It should be able to handle an infinite depth of such sub-objects. Like this:
var obj = TheObject();
obj.sub1.sub2[10].sub3[1].sub4='value';
Now automatically all needed sub-objects and arrays should be created.

Cannot really guarantee anything about cross-browser compatibility, but how about trying this on for size (works in Chrome):
// Safely sets value property of index of an array of an object.
function setObj(obj, subObjName, index, val) {
// Ensure the object exists
if (typeof obj == 'undefined') {
obj = new Object();
}
// Ensure the array property exists
if (typeof obj[subObjName] == 'undefined') {
obj[subObjName] = new Array();
}
// Ensure the array properties index exists
if (typeof obj[subObjName][index] == 'undefined') {
obj[subObjName][index] = {};
}
// Set the value
obj[subObjName][index].value = val;
// Return the object
return obj;
}
Example use:
<script type="text/javascript">
var obj;
obj = setObj(obj, "something", 1, "val");
setObj(obj, "something", 0, "someValue");
alert(obj.something[1].value);
alert(obj.something[0].value);
</script>

If you can assume that the referenced item in the array will be either undefined or an object it simplifies things. Of course the simple (non-automatic) way would be something like this:
if (!obj.subObj2[1]) obj.subObj2[1] = {};
obj.subObj2[1].value = "new Value2";
A not-very generic function to do it for you would be:
function setArrayObjectProp(arr, index, prop, val) {
if (!arr[index])
arr[index] = {};
arr[index][prop] = val;
}
// called as
setArrayObjectProp(obj.subObj2, 1, "value", "new Value2");

heloo
try testing the type of the array item first if its not object then equal it to the new object format {value:"new Value2"}
if(typeof(obj.subObj2[1])!='object')
{
obj.subObj2[1] = {value:"new Value2"};
}
else
{
obj.subObj2[1].value = "new Value2";
}

Related

Get an object just by a property value

Let´s assume I have an object property which is passed into a function. In this case 'name' is filled with 'myObject.name' (which has the value 'Tom') - so basically 'Tom' gets passed into the function as the 'name'
function(name) {
do something //non-essential for my question
}
Is it possible to get the object, where 'Tom' is the property of, just by having the information 'Tom'? Basically I´m looking to get myObject.
Thanks :)
No, that's not possible.
All that the function knows is that one of its parameters was pointed to the string "Tom", not what else points to that string somewhere else in memory.
You can store objects within an array, filter the array to match property name of object to parameter passed to function using for..of loop, Object.entries(), which returns an array of property, values of an object.
const data = Array();
const setObjectPropertyName = _name => {
data.push({[_name]:_name});
return data
}
const getObjectByPropertyName = prop => {
let res = `${prop} property not found in data`;
for (let obj of data) {
for (let [key] of Object.entries(obj)) {
if(key === prop) return obj;
}
}
return res;
}
let s = setObjectPropertyName("Tom");
let g = getObjectByPropertyName("Tom");
let not = getObjectByPropertyName("Tome");
console.log(s,"\n", g, "\n", not);
Disclaimer: you absolutely should not do this. I'm only posting this because it is in fact possible (with some caveats), just really not advisable.
Going on the assumption that this is running in the browser and it's all running in the global scope (like in a script tag), you could technically iterate over the window object, check any objects in window for a name property and determine if their name property matches the name passed to your function.
var myObject = {
name: 'Tom',
thisIs: 'so awful',
imSorry: true,
};
function doSomethingWithName(name) {
for (var obj in window) {
var tmp = window[obj];
if (Object(tmp) === tmp && tmp.name === name) {
return tmp;
}
}
}
console.log(doSomethingWithName(myObject.name));

Javascript filter null object properties

I have an Array with one or more objects and I want to filter out all null properties:
asset = [{"ObjId":177791,"ObjCreditlineM":"DEU","ObjReprorechtM":null,"ObjKommentarM":null,"ObjZustandM":null,"ObjReserve01M":null,"ObjReserve02M":null,"ObjFeld01M":null,"ObjFeld02M":null,"ObjFeld03M":null,"ObjFeld04M":"Foto","ObjFeld05M":null,"ObjFeld06M":null,"ObjFeld07M":null,"ObjFeld01S":null,"ObjFeld02S":null,"ObjFeld03S":null,"ObjFeld04S":null,"ObjFeld05S":null,"ObjFeld06S":null,"ObjFeld07S":null,"ObjFeld01F":0,"ObjFeld02F":0,"ObjFeld01D":null,"ObjFeld02D":null,"ObjInv01S":null,"ObjInv02S":null,"ObjInv03S":null,"ObjInv04S":null,"ObjInv05S":null,"ObjInv06S":null,"ObjDinId":0,"ObjReferenz01Id":null,"ObjReferenz02Id":null,"ObjTransferId":null,"ObjGesperrtS":null,"ObjIconTextM":null}]
// My attempt:
var filledProps = asset.map(el => {
if (Object.keys(el)) { // check if object property value is not null
return el;
};
});
console.log(filledProps);
But I get the same object properties back. What am I missing?
It sounds like you want to create a new array with new objects that only have the properties that aren't null from the original. Is so, map is where you want to start, but Object.keys(el) is always truthy, since it returns an array of property names. You're close though:
var asset = [{"ObjId":177791,"ObjCreditlineM":"DEU","ObjReprorechtM":null,"ObjKommentarM":null,"ObjZustandM":null,"ObjReserve01M":null,"ObjReserve02M":null,"ObjFeld01M":null,"ObjFeld02M":null,"ObjFeld03M":null,"ObjFeld04M":"Foto","ObjFeld05M":null,"ObjFeld06M":null,"ObjFeld07M":null,"ObjFeld01S":null,"ObjFeld02S":null,"ObjFeld03S":null,"ObjFeld04S":null,"ObjFeld05S":null,"ObjFeld06S":null,"ObjFeld07S":null,"ObjFeld01F":0,"ObjFeld02F":0,"ObjFeld01D":null,"ObjFeld02D":null,"ObjInv01S":null,"ObjInv02S":null,"ObjInv03S":null,"ObjInv04S":null,"ObjInv05S":null,"ObjInv06S":null,"ObjDinId":0,"ObjReferenz01Id":null,"ObjReferenz02Id":null,"ObjTransferId":null,"ObjGesperrtS":null,"ObjIconTextM":null}]
// Use `map` to get a new array with new objects
var filledProps = asset.map(el => {
// Loop the property names of `el`, creating a new object
// with the ones whose values aren't `null`.
// `reduce` is commonly used for doing this:
return Object.keys(el).reduce((newObj, key) => {
const value = el[key];
if (value !== null) {
newObj[key] = value;
}
return newObj;
}, {});
});
console.log(filledProps);
What am I missing?
Since if (Object.keys(el)) is always truthy, your code was just always returning el unchanged. It wasn't creating a new object, or deleting properties with null values from the original object.
The above creates new objects, but if you like, you can just delete properties from the originals that have null values instead:
var asset = [{"ObjId":177791,"ObjCreditlineM":"DEU","ObjReprorechtM":null,"ObjKommentarM":null,"ObjZustandM":null,"ObjReserve01M":null,"ObjReserve02M":null,"ObjFeld01M":null,"ObjFeld02M":null,"ObjFeld03M":null,"ObjFeld04M":"Foto","ObjFeld05M":null,"ObjFeld06M":null,"ObjFeld07M":null,"ObjFeld01S":null,"ObjFeld02S":null,"ObjFeld03S":null,"ObjFeld04S":null,"ObjFeld05S":null,"ObjFeld06S":null,"ObjFeld07S":null,"ObjFeld01F":0,"ObjFeld02F":0,"ObjFeld01D":null,"ObjFeld02D":null,"ObjInv01S":null,"ObjInv02S":null,"ObjInv03S":null,"ObjInv04S":null,"ObjInv05S":null,"ObjInv06S":null,"ObjDinId":0,"ObjReferenz01Id":null,"ObjReferenz02Id":null,"ObjTransferId":null,"ObjGesperrtS":null,"ObjIconTextM":null}];
asset.forEach(el => {
Object.keys(el).forEach(key => {
if (el[key] === null) {
delete el[key];
}
});
});
console.log(asset);
Two aspects of that to call out, though:
It modifies the original objects (and thus, in a way, the original array).
When you delete a property from an object, it can have an impact on the performance of property lookup on that object afterward. 99.999% of the time you don't care, but it's there.
asset = [{"ObjId":177791,"ObjCreditlineM":"DEU","ObjReprorechtM":null,"ObjKommentarM":null,"ObjZustandM":null,"ObjReserve01M":null,"ObjReserve02M":null,"ObjFeld01M":null,"ObjFeld02M":null,"ObjFeld03M":null,"ObjFeld04M":"Foto","ObjFeld05M":null,"ObjFeld06M":null,"ObjFeld07M":null,"ObjFeld01S":null,"ObjFeld02S":null,"ObjFeld03S":null,"ObjFeld04S":null,"ObjFeld05S":null,"ObjFeld06S":null,"ObjFeld07S":null,"ObjFeld01F":0,"ObjFeld02F":0,"ObjFeld01D":null,"ObjFeld02D":null,"ObjInv01S":null,"ObjInv02S":null,"ObjInv03S":null,"ObjInv04S":null,"ObjInv05S":null,"ObjInv06S":null,"ObjDinId":0,"ObjReferenz01Id":null,"ObjReferenz02Id":null,"ObjTransferId":null,"ObjGesperrtS":null,"ObjIconTextM":null}]
var filledProps = asset.map(el => {
var obj = {};
for(var prop in el) {
if(el[prop] !== null) {
obj[prop] = el[prop];
}
}
return obj;
});
console.log(filledProps);

Memory efficient way to make an object empty in javascript?

Basically what I want to do is, to use single object everytime after make it empty when my purpose is served.
For array in javascript, I used to write arr.length=0 to make any array empty, instead of pointing it to different memory location. is there any way through which I can empty an object in javascript ?
Scenario is:
var obj = {};
obj["name"]="Aman";
obj["country"]="India";
console.log(obj); // output is { name: 'Aman', country: 'India' }
Can I reused this obj object after removing its content ? if so how ?
The only way I can think of would be to loop over the object and delete each property in turn.
var obj = {};
obj["name"]="Aman";
obj["country"]="India";
for (var prop in obj) {
// Possibly with a hasOwnProperty test, depending on how empty you want it to be
delete obj[prop];
}
console.log(obj);
Obviously, if you aren't dealing with multiple references to the object, you can just overwrite it with a new one.
var obj = {};
obj["name"]="Aman";
obj["country"]="India";
obj = {};
console.log(obj);
for (var member in myObject) {
if ( myObject.hasOwnProperty(member) ) {
delete myObject[member];
}
}
use ECMAScript 6 Map:
var obj = new Map();
obj.set("name", "Aman");
obj.set("country", "India");
obj.clear();

Set Javascript Instance Variables programmatically

I'm going to be getting an array of objects and want to set instance variables inside of a class based on a property. So if I get this:
ary = [{type: 'walrus', name: 'GorbyPuff'}, {type: 'humanoid', occupation: 'KingSlayer'}]
I want to initialize an object where #walrus == ary[0] and #humanoid == ary[1]
In Ruby I could user instance_variable_set, but how can this be accomplished in the Javascripts?
I'm not sure if I get what you're trying to acchieve, but the easiest way to do this would be:
var theObj = {};
for(var i=0;i<ary.length;i++)
{
theObj[ary[i].type] = ary[i];
}
The worry here is, that by altering the ary variable you will inadvertently alter the theObj:
console.log(theObj.walrus.name);//Outputs: GorbyPuff
ary[0].name = 'Nips!';
console.log(theObj.walrus.name);//Outputs: Nips! <-- objects are passed by reference, always
If the ary variable is part of a function scope, and the resulting object is its return value, you needn't worry. But if both are part of the global scope (Which they shouldn't, it's bad practice), this becomes an issue.
I therefore propose this approach:
var obj = {};
var i;
while (ary.length !== 0)
{
i = ary.splice(0,1)[0];//removes element from array
if (i.hasOwnProperty('type'))//always best to check the property you're going to use is there
{
obj[i.type] = i;
}
}
There's nothing in JS that can do this for you, just do a loop to build the object you want:
ary = [{type: 'walrus', name: 'GorbyPuff'}, {type: 'humanoid', occupation: 'KingSlayer'}]
instances={}
for(x=0;x<ary.length;x++) instances[ary[x].type]=ary[x]
document.write(instances.walrus.name) //GorbyBuff
document.write(instances.humanoid.occupation) //KingSlayer
If you want to use that array of objects as prototypes, you can do this:
var Walrus = function(){};
Walrus.prototype=ary[0];
var aWalrus = new Walrus(); // creates a new Walrus. aWalrus.name => GorbyPuff
In Javascript the Good Parts, Douglas Crawford describes a more general way of doing it:
if (typeof Object.create !== 'function') {
Object.create = function (o) {
var F = function () {};
F.prototype = o;
return new F();
};
}
Which you can use like this:
var aWalrus = Object.create(ary[0]);
here is a example of what you want:
// the class:
function MyClass(){
// stuff
}
// the data object
var o = [
{type:"MyClass",name:"a name"}
]
// how to instantiate:
var instances = [];
for(var i=0;i<o.length;i++){
if(typeof this[o[i].type] == "function")
instances.push(new this[o[i].type](o[i].name))
}
If you create the classes in a function you need to use "this" as a reference to that function, else you can use "window"

CouchDB: Adding fields to "doc" in view

In my view I want to create a new object to return instead of the object that is passed to my map function. I would like to do some validation and add some fields to the new object. My map function for the view looks like this (there isn't a reduce):
function(doc) {
if(doc.type == "mytype") {
var newobj = null;
if( doc.someObjField ) {
newobj = doc.someObjField; //LINE 5: want a copy but get a reference
}
else {
newobj = new Object(); //field didn't exist create a new object
}
newobj.superId = doc._id; //these fields get added to the DB
newobj.superName = doc.name;
newobj.newField = doc.field;
emit(doc._id, newobj);
}
}
The problem is that when this view runs, it ends up adding some new fields to the documents in the database. I cannot see the fields when editing the doc in Futon, but they show up in every view of the document.
I think this is because because of LINE 5 creates a reference to that field of the document instead of a copy. Does this mean I have to include a clone() function in all my views to get what I want? Maybe I'm thinking about this wrong?
Update: I was using CouchDB version 1.0.0 and upgraded to version 1.0.1 and it seems that the behavior has changed. In the previous version when "doc" was modified in one view, the modification appeared in all views. In the newest version, this does not seem to be the case.
newobj = doc.someObjField does indeed make a reference and not a copy, so you'll will have to iterate over the properties of doc.someObjField and copy them over to a new object.
This is not that trivial, the following shows an example of how to make a shallow clone:
// get the class of an object, this is a lot better than messing with typeof and instanceof
function is(type, obj) {
return Object.prototype.toString.call(obj).slice(8, -1) === type;
}
function copy(val) {
if (is('Object', val)) { // shallow clone objects
var obj = {};
for (var f in val) {
if (val.hasOwnProperty(f)) {
obj[f] = val[f];
}
}
return obj;
} else {
return is('Array', val) ? val.slice() : val; // shallow clone arrays
}
}
Your code would look like this:
newobj = doc.someObjField ? copy(doc.someObjField) : {};
Now if you someObjField has objects or arrays as its properties those will yet again only be references, so you have to recursively clone them.

Categories