Adding dynamic properties to object only if the name is defined - javascript

i have a function like this:
const getKeysAs = (key1, key2) => {
return {
[key1]: state.key1,
[key2]: state.key2
}
}
So if state.key1 is 'a' and state.key2 is 'b', calling getKyesAs('one', 'two') would return
{
one: 'a',
two: 'b'
}
Now, if one of the argument is undefined, is there a way to not include it in the returned object ?

You can Conditionally add properties to an Object with object destructuring
const obj = {
...(key1 && { [key1]: state[key1] }),
...(key2 && { [key2]: state[key2] })
};
If some of the args function is undefined, null or 0 (falsy values) then it will no be added to the object.

There is a very scalable way to do it:
const state= {
a: "hello",
}
function getKeysAs (keys) {
return [...arguments].reduce((acc, cur)=> {
const newValue = state[cur] && {[cur]: state[cur]}
return {...acc, ...newValue}
}, {})
}
console.log(getKeysAs("a", "b"))
This way, you can pass as much keys as you need without worrying about scalability & undefined values.

Use Object.assign().
const getKeysAs = (key1, key2) => {
return Object.assign({}, key1 && {[key1]: state[key1]}, key2 && {[key2]: state[key2]});
}

Assuming you actually mean to do state[key1], not state.key1, here is a solution that doesn't create superfluous objects:
const getKeysAs = (...keys) => {
const result = {};
for (const key of keys) {
if (key != null) {
result[key] = state[key];
}
}
return result;
}

Related

Get the key of a JS Object from the value

I am trying to get the key of a JS Object in Typescript from an input value, the problem is that the values are inside an Array.
This is what I have seen in the case that the value is not in an array:
const exampleObject = {
key1: 'Geeks',
key2: 'Javascript'
};
function getKeyByValue(object, value) {
for (var prop in object) {
if (object.hasOwnProperty(prop)) {
if (object[prop] === value)
return prop;
}
}
}
console.log(getKeyByValue(exampleObject,'Geeks')) // key1
This is an example of my object that I want to get the key from:
const exampleObject = {
key1: ['Geeks','test1','test2'],
key2: ['Javascript','test3','test4']
};
function getKeyByValue(object, value) {
for (var prop in object) {
if (object.hasOwnProperty(prop)) {
if (object[prop] === value)
return prop;
}
}
}
console.log(getKeyByValue(exampleObject,'Geeks')) // undefined
I need to get the key without using Array.prototype.includes(), because typing the resulting variable as String gives me an error that it may be undefined.
My problem: I don't know how to go through the array inside the function to find the value and get the key
Update:
What I want is to avoid the possibility of returning an undefined, since the input value will always be inside the object, how can I achieve this?
#segmet
You can use my code
const exampleObject = {
key1: ['Geeks', 'test1', 'test2'],
key2: ['Javascript', 'test3', 'test4']
};
function getKeyByValue(object, value) {
var output = "";
for (var prop in object) {
// finding and removing element from array
object[prop].find(i => {
if (i === value) {
output = prop;
return prop;
}
}
)
}
return output
}
console.log(getKeyByValue(exampleObject, 'Geeks'))
You can achieve this with a single line of code by using 3 JavaScript methods - Object.keys(), Array.find() & Array.indexOf() :
const exampleObject = {
key1: ['Geeks','test1','test2'],
key2: ['Javascript','test3','test4']
};
function getKeyByValue(object, value) {
const res = Object.keys(exampleObject).find(key => exampleObject[key].indexOf(value) !== -1);
return res || ''
}
console.log(getKeyByValue(exampleObject,'Geeks'))
function getKeyByValue(object, value) {
const key = Object.entries(object).filter(([key, val]) => val.includes(value));
return Object.fromEntries(key);
}
Try this function instead
You will get the object matching your keys
You can do something like this and then check for null
const getKeyFromValue = (obj:Object, value:string | string[]) => {
for (let key in obj) {
if (typeof value === 'string') {
if (obj[ key ].includes(value)) {
return key;
}
}
else if (Array.isArray(value)) {
if (obj[ key ].every(val => value.includes(val))) {
return key;
}
}
}
return null;
}
One more try:
const exampleObject = {
key1: ['Geeks','test1','test2'],
key2: ['Javascript','test3','test4']
};
function getKeyByValue(obj, data) {
for (const [key, value] of Object.entries(obj)) {
return (~value.indexOf(data)) ? key : false
}
}
console.log(getKeyByValue(exampleObject,'Geeks'))

Filtering Everything But Functions

I have this object
{
helloWorld: function () {
console.log("Test")
},
debug: false,
foo: {
test: "test",
bar: function () {
console.log(false)
}
}
}
However, programmatically I want it to look like this:
{
helloWorld: function() {
console.log("Test")
},
foo: {
bar: function() {
console.log(false)
}
}
}
Basically removing everything but the functions of an object.
You could do a recursive call. For every key-value pairs of the object, check the value:
if it is function, keep it
else do a recursive call on that value
Base condition for on recursive call
if it is not object, return null
if the object is empty, also return null
After map through the key-value pairs, filter the pairs with value not equal null.
Finally, transform the pairs back to object
function keepFunc(obj) {
if (!isObject(obj)) {
return null
}
if (Object.keys(obj).length === 0) {
return null
}
return Object.fromEntries(
Object.entries(obj)
.map(([key, value]) => [
key,
isFunction(value) ? value : keepFunc(value)
])
.filter(([key, value]) => value !== null)
)
}
Runnable example
const obj = {
helloWorld: function() {
console.log('Test')
},
debug: false,
moreDebug: {},
foo: {
test: 'test',
bar: function() {
console.log(false)
},
moreTest: {
weather: 'cool',
say: function () {
console.log('phew')
}
}
}
}
const isObject = obj => typeof obj === 'object' && obj !== null
const isFunction = func => typeof func === 'function'
function keepFunc(obj) {
if (!isObject(obj)) {
return null
}
if (Object.keys(obj).length === 0) {
return null
}
return Object.fromEntries(
Object.entries(obj)
.map(([key, value]) => [
key,
isFunction(value) ? value : keepFunc(value)
])
.filter(([key, value]) => value !== null)
)
}
console.log(keepFunc(obj))
References
Object.entries(): to transform object into key-value pairs
Object.fromEntries(): to transform key-value pairs into object
You can use recursive function call in javascript to achieve that. For each key in the object check if it is an object or function and if it is keep it:
var input = {
helloWorld: function() {
console.log("Test")
},
debug: false,
foo: {
test: "test",
bar: function() {
console.log(false)
}
}
};
function buildObjectsOnlyObject(obj) {
let retVal = {};
for (let key in obj) {
const val = obj[key];
if (typeof val === 'object') {
if (!val) { // undefined and null also have object type
continue;
}
if (val.__proto__ === Array.prototype) { // check if object is an array
retVal[key] = val;
} else {
retVal[key] = buildObjectsOnlyObject(obj[key]);
}
} else if (typeof val === 'function') {
retVal[key] = val;
}
}
return retVal;
}
console.log(buildObjectsOnlyObject(input));
Object.entries and Object.fromEntries help here, as does Array.prototype.some.
For objects, filter the object's entries and keep only entries whose values are functions or objects with descendants that are functions. This can be checked recursively.
Then let each value be either the function or the stripped nested object.
This strip function will return undefined if nothing is kept.
let example =
{
helloWorld: function () {
console.log("Test")
},
debug: false,
foo: {
test: "test",
bar: function () {
console.log(false)
}
}
};
let isobj = val => typeof val == 'object' && val !== null;
let isfn = val => typeof val == 'function';
let keep = val => isobj(val) ? Object.entries(val).some(keepEntry) : isfn(val)
let keepEntry = ([key, val]) => keep(val);
let stripEntry = ([key, val]) => [key, strip(val)];
let strip = val => keep(val) ? isobj(val) ?
Object.fromEntries(Object.entries(val).filter(keep).map(stripEntry)) :
isfn(val) ? val : undefined : undefined
console.log(strip(example));
(Surprisingly this took more code than I thought it would.)

A way to access a property without knowing its path in a nested js object

is there a way to access a nested property within an object without knowing its path?
For instance I could have something like this
let test1 = {
location: {
state: {
className: 'myCalss'
}
}
};
let test2 = {
params: {
className: 'myCalss'
}
};
Is there neat way to 'extract' className property?
I have a solution but it's pretty ugly, and it accounts just for this two cases, I was wondering if there is something more flexible I could do
Here's a somewhat elegant approach to creating nested property getters:
const getProperty = property => {
const getter = o => {
if (o && typeof o === 'object') {
return Object.entries(o)
.map(([key, value]) => key === property ? value : getter(value))
.filter(Boolean)
.shift()
}
}
return getter
}
const test1 = {
location: {
state: {
className: 'test1'
}
}
}
const test2 = {
params: {
className: 'test2'
}
}
const test3 = {}
const getClassName = getProperty('className')
console.log(getClassName(test1))
console.log(getClassName(test2))
console.log(getClassName(test3))
If you want to prevent cyclical objects from causing a stack overflow, I suggest using a WeakSet to keep track of iterated object references:
const getProperty = property => {
const getter = (o, ws = new WeakSet()) => {
if (o && typeof o === 'object' && !ws.has(o)) {
ws.add(o)
return Object.entries(o)
.map(([key, value]) => key === property ? value : getter(value, ws))
.filter(Boolean)
.shift()
}
}
return getter
}
const test1 = {
location: {
state: {
className: 'test1'
}
}
}
const test2 = {
params: {
className: 'test2'
}
}
const test3 = {}
const test4 = {
a: {
b: {}
}
}
test4.a.self = test4
test4.a.b.self = test4
test4.a.b.className = 'test4'
const getClassName = getProperty('className')
console.log(getClassName(test1))
console.log(getClassName(test2))
console.log(getClassName(test3))
console.log(getClassName(test4))
Sure. Give this a try. It recursively iterate over the object and returns the first match. You can configure the for loop to match all or last, according to your needs
let test1 = {
location: {
state: {
className: 'myCalss'
}
}
};
let test2 = {
params: {
className: 'myCalss'
}
};
function getClassName(obj) {
if(typeof obj === "object" && 'className' in obj) {
return obj.className
}
const keys = Object.keys(obj)
for(let i = 0; i < keys.length; i++) {
let key = keys[i]
let res = getClassName(obj[key])
if(res) return res
}
return null
}
console.log(getClassName(test1), getClassName(test2))

how to get keys of nested object

If I have a flat object then this works:
let stateCopy={...this.state}
Object.entries(dictionary).map(([key,value])=>{
stateCopy.key = value.toString())
})
Is there a way to do this if dictionary contains a nested object. Suppose a dictionary looks like:
dictionary={left:{name:'WORK',
min:2,
sec:0,}
start:true}
I need some way of updating stateCopy, i.e
stateCopy.left.name='WORK'
stateCopy.left.min=2
stateCopy.left.sec=0
stateCopy.start=true
function flattenDictionary(dict) {
if (!dict) {
return {};
}
/** This will hold the flattened keys/values */
const keys = {};
// Perform the flatten
flattenH(dict);
return keys;
function flattenH(obj, prefix) {
Object.keys(obj).forEach((key) => {
const val = obj[key];
/** This is what we pass forward as a new prefix, or is the flattened key */
let passKey;
// Only expect to see this when the original dictionary is passed as `obj`
if (!prefix || prefix === '') {
passKey = key;
} else {
// "Ignore" keys that are empty strings
passKey = ((key === '') ? prefix : `${prefix}.${key}`);
}
if (typeof obj[key] !== 'object') {
keys[passKey] = val;
} else {
flattenH(val, passKey);
}
});
}
}
Seems like you can do this with a little recursive function:
let state = {
left:{
start: "mark",
anotherLevel: {
test: 'leveltest'
}
},
test: "will be replaced"
}
let dictionary={
test2: {
foo: 'bar'
},
left:{
name:'WORK',
min:2,
sec:0,
anotherLevel: {
test_add: 'leveltest_add'
}
},
start:true,
test: 'replaced with me'
}
let stateCopy={...state}
function merge(obj, dict){
Object.entries(dict).forEach(([k, v]) =>{
if (!obj[k] || typeof v !== 'object') obj[k] = v
else merge(obj[k], v)
})
}
merge(stateCopy, dictionary)
console.log(stateCopy)

Removing object properties with Lodash

I have to remove unwanted object properties that do not match my model. How can I achieve it with Lodash?
My model is:
var model = {
fname: null,
lname: null
}
My controller output before sending to the server will be:
var credentials = {
fname: "xyz",
lname: "abc",
age: 23
}
I am aware I can use
delete credentials.age
but what if I have lots of unwanted properties? Can I achieve it with Lodash?
You can approach it from either an "allow list" or a "block list" way:
// Block list
// Remove the values you don't want
var result = _.omit(credentials, ['age']);
// Allow list
// Only allow certain values
var result = _.pick(credentials, ['fname', 'lname']);
If it's reusable business logic, you can partial it out as well:
// Partial out a "block list" version
var clean = _.partial(_.omit, _, ['age']);
// and later
var result = clean(credentials);
Note that Lodash 5 will drop support for omit
A similar approach can be achieved without Lodash:
const transform = (obj, predicate) => {
return Object.keys(obj).reduce((memo, key) => {
if(predicate(obj[key], key)) {
memo[key] = obj[key]
}
return memo
}, {})
}
const omit = (obj, items) => transform(obj, (value, key) => !items.includes(key))
const pick = (obj, items) => transform(obj, (value, key) => items.includes(key))
// Partials
// Lazy clean
const cleanL = (obj) => omit(obj, ['age'])
// Guarded clean
const cleanG = (obj) => pick(obj, ['fname', 'lname'])
// "App"
const credentials = {
fname:"xyz",
lname:"abc",
age:23
}
const omitted = omit(credentials, ['age'])
const picked = pick(credentials, ['age'])
const cleanedL = cleanL(credentials)
const cleanedG = cleanG(credentials)
Get a list of properties from model using _.keys(), and use _.pick() to extract the properties from credentials to a new object:
var model = {
fname:null,
lname:null
};
var credentials = {
fname:"xyz",
lname:"abc",
age:23
};
var result = _.pick(credentials, _.keys(model));
console.log(result);
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.16.4/lodash.min.js"></script>
If you don't want to use Lodash, you can use Object.keys(), and Array.prototype.reduce():
var model = {
fname:null,
lname:null
};
var credentials = {
fname:"xyz",
lname:"abc",
age:23
};
var result = Object.keys(model).reduce(function(obj, key) {
obj[key] = credentials[key];
return obj;
}, {});
console.log(result);
You can easily do this using _.pick:
var model = {
fname: null,
lname: null
};
var credentials = {
fname: 'abc',
lname: 'xyz',
age: 2
};
var result = _.pick(credentials, _.keys(model));
console.log('result =', result);
<script src="https://cdn.jsdelivr.net/lodash/4.16.4/lodash.min.js"></script>
But you can simply use pure JavaScript (specially if you use ECMAScript 6), like this:
const model = {
fname: null,
lname: null
};
const credentials = {
fname: 'abc',
lname: 'xyz',
age: 2
};
const newModel = {};
Object.keys(model).forEach(key => newModel[key] = credentials[key]);
console.log('newModel =', newModel);
Lodash unset is suitable for removing a few unwanted keys.
const myObj = {
keyOne: "hello",
keyTwo: "world"
}
unset(myObj, "keyTwo");
console.log(myObj); /// myObj = { keyOne: "hello" }
Here I have used omit() for the respective 'key' which you want to remove... by using the Lodash library:
var credentials = [{
fname: "xyz",
lname: "abc",
age: 23
}]
let result = _.map(credentials, object => {
return _.omit(object, ['fname', 'lname'])
})
console.log('result', result)
You can use _.omit() for emitting the key from a JSON array if you have fewer objects:
_.forEach(data, (d) => {
_.omit(d, ['keyToEmit1', 'keyToEmit2'])
});
If you have more objects, you can use the reverse of it which is _.pick():
_.forEach(data, (d) => {
_.pick(d, ['keyToPick1', 'keyToPick2'])
});
To select (or remove) object properties that satisfy a given condition deeply, you can use something like this:
function pickByDeep(object, condition, arraysToo=false) {
return _.transform(object, (acc, val, key) => {
if (_.isPlainObject(val) || arraysToo && _.isArray(val)) {
acc[key] = pickByDeep(val, condition, arraysToo);
} else if (condition(val, key, object)) {
acc[key] = val;
}
});
}
https://codepen.io/aercolino/pen/MWgjyjm
This is my solution to deep remove empty properties with Lodash:
const compactDeep = obj => {
const emptyFields = [];
function calculateEmpty(prefix, source) {
_.each(source, (val, key) => {
if (_.isObject(val) && !_.isEmpty(val)) {
calculateEmpty(`${prefix}${key}.`, val);
} else if ((!_.isBoolean(val) && !_.isNumber(val) && !val) || (_.isObject(val) && _.isEmpty(val))) {
emptyFields.push(`${prefix}${key}`);
}
});
}
calculateEmpty('', obj);
return _.omit(obj, emptyFields);
};
For array of objects
model = _.filter(model, a => {
if (!a.age) { return a }
})
Recursively removing paths.
I just needed something similar, not removing just keys, but keys by with paths recursively.
Thought I'd share.
Simple readable example, no dependencies
/**
* Removes path from an object recursively.
* A full path to the key is not required.
* The original object is not modified.
*
* Example:
* const original = { a: { b: { c: 'value' } }, c: 'value' }
*
* omitPathRecursively(original, 'a') // outputs: { c: 'value' }
* omitPathRecursively(original, 'c') // outputs: { a: { b: {} } }
* omitPathRecursively(original, 'b.c') // { a: { b: {} }, c: 'value' }
*/
export const omitPathRecursively = (original, path, depth = 1) => {
const segments = path.split('.')
const final = depth === segments.length
return JSON.parse(
JSON.stringify(original, (key, value) => {
const match = key === segments[depth - 1]
if (!match) return value
if (!final) return omitPathRecursively(value, path, depth + 1)
return undefined
})
)
}
Working example: https://jsfiddle.net/webbertakken/60thvguc/1/
While looking for a solution that would work for both arrays and objects, I didn't find one and so I created it.
/**
* Recursively ignore keys from array or object
*/
const ignoreKeysRecursively = (obj, keys = []) => {
const keyIsToIgnore = (key) => {
return keys.map((a) => a.toLowerCase()).includes(key)
}
const serializeObject = (item) => {
return Object.fromEntries(
Object.entries(item)
.filter(([key, value]) => key && value)
.reduce((prev, curr, currIndex) => {
if (!keyIsToIgnore(curr[0]))
prev[currIndex] =
[
curr[0],
// serialize array
Array.isArray(curr[1])
? // eslint-disable-next-line
serializeArray(curr[1])
: // serialize object
!Array.isArray(curr[1]) && typeof curr[1] === 'object'
? serializeObject(curr[1])
: curr[1],
] || []
return prev
}, []),
)
}
const serializeArray = (item) => {
const serialized = []
for (const entry of item) {
if (typeof entry === 'string') serialized.push(entry)
if (typeof entry === 'object' && !Array.isArray(entry)) serialized.push(serializeObject(entry))
if (Array.isArray(entry)) serialized.push(serializeArray(entry))
}
return serialized
}
if (Array.isArray(obj)) return serializeArray(obj)
return serializeObject(obj)
}
// usage
const refObject = [{name: "Jessica", password: "ygd6g46"}]
// ignore password
const obj = ignoreKeysRecursively(refObject, ["password"])
// expects returned array to only have name attribute
console.log(obj)
let asdf = [{"asd": 12, "asdf": 123}, {"asd": 121, "asdf": 1231}, {"asd": 142, "asdf": 1243}]
asdf = _.map(asdf, function (row) {
return _.omit(row, ['asd'])
})

Categories

Resources