How to push object in specified index position in array? - javascript

I have an array.
var tableHeader = [
{
key: 1,
value: 'inputname',
defaultChecked: true,
columnName: 'input.name',
}, {
key: 3,
value: 'callname',
defaultChecked: true,
columnName: 'call.name',
}, {
key: 4,
value: 'rank',
defaultChecked: true,
columnName: 'call.rank',
}, {
key: 5,
value: 'threshold',
defaultChecked: true,
columnName: 'call.threshold',
}, {
key: 9,
value: 'matchname',
defaultChecked: true,
columnName: 'match.name',
},
]
My requirement: I will remove the object having key 3. While I will push the same object to the array it will push to same position as before. The same will happen if I do for other objects.

I just tried in Typescript I dnt know I much it helps to you,I added empty string in removed object place, after that I replaced with original object
let removedObj, removedIndex: any;
this.tableHeader.forEach((ele, i) => {
if (ele.key == 3) {
removedObj = ele; removedIndex = i;
this.tableHeader.splice(i, 1, '');
}
});
this.tableHeader.splice(removedIndex, 1, removedObj);
console.log(this.tableHeader);

to replace the array element use:
TheNewObject = { key: 9,
value: 'matchname',
defaultChecked: true,
columnName: 'match.name',};
tableHeader[3] = TheNewObject;
just like that ,
and to search for object Index you can use the following method :
function getObjectIndex(skey)
{
for (i = 0; i < tableHeader.length; i++) {
obj = tableHeader[i];
if (obj.hasOwnProperty('key') && obj.key == skey) {
return i;
}
}
}

This looks like two distinct problems, one is to filter out an element inside an array by its property, and the second (and slightly trickier to push a new element back in the same place if it has the same key). I think your best bet is to leave .push alone, and instead look into Array.filter and Array.sort after you add a new element (to restore order), Like this:
var tableHeader = [{
key: 1,
value: 'inputname',
defaultChecked: true,
columnName: 'input.name',
}, {
key: 3,
value: 'callname',
defaultChecked: true,
columnName: 'call.name',
}, {
key: 4,
value: 'rank',
defaultChecked: true,
columnName: 'call.rank',
}, {
key: 5,
value: 'threshold',
defaultChecked: true,
columnName: 'call.threshold',
}, {
key: 9,
value: 'matchname',
defaultChecked: true,
columnName: 'match.name',
}, ]
console.log('Original', tableHeader)
//Filter out {key:3}
tableHeader = tableHeader.filter(function(e) {
return e.key !== 3
})
console.log('Filtered', tableHeader)
tableHeader.push({
key: 3,
value: 'callname',
defaultChecked: true,
columnName: 'call.name',
})
tableHeader.sort(function(a, b) {
return a.key - b.key
})
console.log('Resorted', tableHeader)

Related

Conditional object properties in React

I am trying to use conditional statements (&& or ?) inside an object that is returned within method in React component. Is it possible?
The issue is I want to add to condition multiple properties. It works with just one like this:
arr: [
isInsidePlan
? {
label: 'anything1'
value: 1,
} :
{
label: 'anything2'
value: 2,
},
{
label: 'anything3'
value: 3,
},
{
label: 'anything4'
value: 4,
},
],
What I would like to achieve is to do it with all other properties inside else condition. Like this: (this code doesn't work)
arr: [
isInsidePlan
? ({
label: 'anything1'
value: 1,
}) :
({
label: 'anything2'
value: 2,
},
{
label: 'anything3'
value: 3,
},
{
label: 'anything4'
value: 4,
})
],
I get an error:
Left side of comma operator is unused and has no side effects.
You should make the if condition outside the array itself.
Something like:
arr: isInsidePlan ? [
{
label: 'anything1'
value: 1,
}] :
[{
label: 'anything2'
value: 2,
},
{
label: 'anything3'
value: 3,
},
{
label: 'anything4'
value: 4,
}]
],

Combine array of objects into a single object with a nested object

I'm trying to turn this data
[
{
key: 'myvar',
value: 'my value',
global: false,
},
{
key: 'foo',
value: 'bar',
global: false,
},
{
key: 'featureEnabled',
value: true,
global: true,
accountId: 123,
},
]
into this
{
myvar: 'my value'
foo: 'bar'
123: { 'featureEnabled': true }
}
I was thinking something along the lines of something like below but this will return undefined for objects that don't have an accountId property. I thought there might be a way to use an if statement here.
const globalResponse = Object.assign({}, ...getPreference.map(o => ({ [o.accountId]: { [o.key]: o.value } })))
You can use of reduce to build your new object and setup specific triggers for specifics use cases.
function mutateObject(tmpBasis, key, value) {
tmpBasis[key] = value;
return tmpBasis;
}
const ret = [{
key: 'myvar',
value: 'my value',
global: false,
},
{
key: 'foo',
value: 'bar',
global: false,
},
{
key: 'featureEnabled',
value: true,
global: true,
accountId: 123,
},
{
key: 'otherKey',
value: true,
global: true,
accountId: 123,
},
{
key: 'featureEnabled',
value: true,
global: true,
accountId: 512,
},
].reduce((tmp, {
key,
value,
global,
accountId,
}) => ({
...tmp,
// If we are in global case, we either create an empty object containing the new key
// or we add the new key inside of the existing object
[global ? accountId : key]: global ? mutateObject(tmp[accountId] || {}, key, value) : value,
}), {});
console.log(ret);
You can use reduce() with a condition inside like below
var myJSON = [{
key: 'myvar',
value: 'my value',
global: false,
},
{
key: 'foo',
value: 'bar',
global: false,
},
{
key: 'featureEnabled',
value: true,
global: true,
accountId: 123,
},
];
let newJSON = myJSON.reduce((target, item) => {
!!item.accountId ? target[item.accountId] = { [item.key]: item.value } : target[item.key] = item.value;
return target;
}, {});
console.log(newJSON);

How to map value to key?

Map will not accept dot notation for a key, how would you map a key from an array of objects to a key in a new object? For example I would like to convert:
this
searchResults = [{ _id: 'qEJBC9gED8knEKhHF',
key: 'key1',
value: 1 },
{ _id: 'KeoMTbpuCeuQMH8LJ',
key: 'key2',
value: 5 },
{ _id: 'Foy5pXbDbtLABmCxC',
key: 'key3',
value: 4 }
]
to this
[{ _id: 'qEJBC9gED8knEKhHF',
key1: 1 },
{ _id: 'KeoMTbpuCeuQMH8LJ',
key2: 5 },
{ _id: 'Foy5pXbDbtLABmCxC',
key3: 4 }]
Example that does not work...
get_settings = function(doc) {
return {
doc.key: doc.value
}
};
currentUserSettings = searchResults.settings.map(get_settings);
You can achieve this with JS Array.Map prototype
Just use square brackets and pass in the value.
var data = [{
_id: 'qEJBC9gED8knEKhHF',
key: 'key1',
value: 1
},
{
_id: 'KeoMTbpuCeuQMH8LJ',
key: 'key2',
value: 5
},
{
_id: 'Foy5pXbDbtLABmCxC',
key: 'key3',
value: 4
}
]
var mappedData = data.map(function(item) {
return {
_id: item._id,
[item.key]: item.value
}
});
console.log(mappedData)

Extend two objects with no deep copy but without overwrite array of objects

I've two objects and I would like to join in one just by overwriting the same values.
var objOne = { current: 1, sort: { 'foo' : 'bar' }, search: [ { name: 'a', value: 1 }, { name: 'b', value: 2 } ] };
var objTwo = { sort: { 'john' : 'doe' }, search: [ { name: 'a', value: 3 } ] };
I tried with $.extends without deep copy and works well for all elements except for array objects.
var objAll = $.extend( {}, objOne, objTwo );
objAll -> { current: 1, sort: { 'john' : 'doe' }, search: [{ name: 'a', value: 3 }] };
My goal would be to get this
objAll -> { current: 1, sort: { 'john' : 'doe' }, search: [{ name: 'a', value: 3 },{ name: 'b', value: 2 }] };
Overwrite only the array of objects with the same name.
How can I do this? thanks
This can be done using ES6 Proxies, using set trap in the handler.
var objOne = { current: 1, sort: { 'foo' : 'bar' }, search: [ { name: 'a', value: 1 }, { name: 'b', value: 2 } ] };
var proxy = new Proxy(objOne, {
set(trapTarget, key, value, receiver) {
// not altering the existing array properties
if (trapTarget.hasOwnProperty(key) && Array.isArray(trapTarget[key])) {
return Reflect.set(trapTarget, key, trapTarget[key], receiver)
}
return Reflect.set(trapTarget, key, value, receiver);
} });
Object.assign(proxy,{ sort: { 'john' : 'doe' }, search: [ { name: 'a', value: 3 } ] });
console.log(objOne);
JsFiddle Link: https://jsfiddle.net/8n3c8hs0/

How to find the first property that is an array in an object?

I'm creating a function that loops through an array like this:
schema: [{
name: 'firstRow',
fields: [{
name: 'name',
text: 'Name',
type: 'text',
col: 12,
value: ''
}]
}, {
And returns a callback with the values of the objects:
eachDeep (array, callback) {
array.forEach(item => {
item.fields.forEach(field => {
callback(field)
})
})
},
As you can see the item.fields.forEach part is harcoded. How can I modify the function so it detects the first property that it's an array and loop through it? (e.g. in this case that property is fields).
To find whether a property of an object is an array or not you can also use this one:
//let item be your object's property
if(typeof item == "object" && item.length > 0){
//do whatever if it is an array
}
You can check if the field is not an array or not, if so loop it, otherwise do something else with it.
var data = [{
name: 'firstRow',
fields: [{
name: 'name',
text: 'Name',
type: 'text',
col: 12,
value: ''
}]
}, {
name: 'firstRow',
fields: [{
name: 'name',
text: 'Name',
type: 'text',
col: 12,
value: ''
}]
}];
eachDeep (array, callback) {
array.forEach(item => {
// loop through each property again
item.forEach(prop => {
// if property is an array
if (prop instanceof Array) {
prop.forEach(field => callback(field));
} else {
// property is not an array
// do something else
}
})
})
},
var big_array =
[
{
name: 'firstRow',
fields: [{
name: 'name',
text: 'Name',
type: 'text',
col: 12,
value: ''
}]
}
];
for (let item of big_array)
{
for (let key in item)
{
if (Array.isArray(item[key]) )
{
console.log('this is an array do something:', key);
}
}
}
You could check using Array.isArray()
If the goal is to find the first array property you can do the following. Using ES6.
const schema = [{
name: 'firstRow',
fields: [{
name: 'name',
text: 'Name',
type: 'text',
col: 12,
value: ''
}]
}]
let firstArr;
schema.forEach(item => {
firstArr = Object.keys(item).filter(k => Array.isArray(item[k]))[0];
})

Categories

Resources