This question already has answers here:
Convert a JavaScript string in dot notation into an object reference
(34 answers)
Closed 5 years ago.
I have this code :
success(JSON.parse(xhr.responseText).items[0].snippet.title);
The problem is I can access what I want with this but I'd like to be able to do this :
var path = 'items[0].snippet.title';
success(JSON.parse(xhr.responseText).path);
And it doesn't work :(
It's probably nothing but I can't figure out why.
Thanks!
For accessing object properties by string you need to use [ ] notation:
var foo = {bar : 2};
foo['bar']; // 2
But that won't work for nested properties, here is the approach I would follow using Array.reduce and ES6:
let path = 'items.snippet.title';
let response = JSON.parse(xhr.responseText);
let result = path.split('.').reduce((pre,cur) => {
return pre[cur];
}, response);
success(result);
In the first iterarion pre will be response, and cur 'items' returning result.items and so on, it won't work when accesing array indexes though so you will need to add some extra logic inside the reduce function.
const [, cur, position] = cur.match(/^([^\[]+)(?:\[(\d+)])?$/);
// filter foo[1] capturing foo and 1, then assign them using destructuring.
// Thanks for edit!
return ( Array.isArray(pre[cur]) ? pre[cur][position] : pre[cur]);
Related
This question already has answers here:
Accessing nested JavaScript objects and arrays by string path
(44 answers)
Closed 29 days ago.
In JS/typescript, lets say I have an object like this
var obj = {
a: {
b:{
c:1
}
}
}
And I have a string "b.c". How can I evaluate this using only those variables and get the value 1 from the object without using hacks like eval since typescript would complain.
Thanks
It I understood you question, the keys are known, if so you can use the '[]' to access it :
const a = b.c
is the same thing as
const a = b['c']
but in the second case you can of course use a variable.
Applying this to your object, it would look something like this :
const obj = {
a: {
b: {
c: 1
}
}
}
const outerKey = 'a'
const middleKey = 'b'
const innerKey = 'c'
const value = obj[outerKey][middleKey][innerKey]
console.log(value)
Hope it helped you !
This question already has answers here:
Accessing an object property with a dynamically-computed name
(19 answers)
Closed 7 months ago.
I am new to javascript oop
i have been trying to get the desired value but it gives me undefined
class person {
constructor(isGreat, brain, personality) {
this.isGreat = isGreat;
this.brain = brain;
this.personality = personality;
}
getDetails(req) {
this.req = req;
let dic = {
isGreat: this.isGreat,
brain: `they have ${this.brain} brain`,
personality: `they have ${this.personality} personality`,
};
return dic.req;
}
}
let person0 = new person(true, "massive", "great");
console.log(person0.getDetails("isGreat"));
req can get read but dic.req shows undefined
The problem is console.log shows undefined.
dic doesn't have a req property. If you want to get a property whose name is stored in req variable, use the following syntax:
dic[req]
Just like accessing array members. In fact, a.b and a['b'] are equivalent in JavaScript.
BTW: The assignment this.req = req is not necessary.
You are returning the req property of your object, not the property with the key stored inside req. You need to use square brackets to get the index stored inside req.
return dic[req]
This is because it gets parsed as dic['isgreat'] rather than dic['req'].
This question already has answers here:
How to remove undefined and null values from an object using lodash?
(27 answers)
Closed 5 years ago.
I am using library Lodash and I need from my javascript object remove just possible undefined properties, but I want keep null properties.
for example if I would have object like this:
var fooObject = {propA:undefined, propB:null, propC:'fooo'};
I expect output like this:
{propB:null, propC:'fooo'}
I tried this:
.pickBy(fooObject, _.identity);
but it remove also null values. Does Lodash contain some function for that? Thanks.
Try with:
_.pickBy(fooObject, v => v !== undefined)
Return anything that is NOT _.isUndefined :
_.pickBy({propA:undefined, propB:null, propC:'fooo'}, function(val){
return !_.isUndefined(val);
});
Or even more nicely :
_.omitBy({propA:undefined, propB:null, propC:'fooo'}, _.isUndefined);
Try using .omitBy method .
For undefined and null values.
_.isUndefined and _.isNull
var fooObject = {propA:undefined, propB:null, propC:'fooo'};
To remove undefined values from object
var newObj= _(fooObject).omitBy(_.isUndefined).value();
console.log(newObj);
Incase,If you want to remove both undefined and null
var result = _(fooObject).omitBy(_.isUndefined).omitBy(_.isNull).value();
console.log(result);
Hope this helps..!
//simple javascript
var fooObject = {propA:undefined, propB:null, propC:'fooo'};
for(var prop in fooObject)
{
if(fooObject[prop]===undefined)
delete fooObject[prop];
}
console.log(fooObject);
This question already has answers here:
Difference between ES6 object method assignment: a, 'a', and ['a']?
(2 answers)
Closed 6 years ago.
I've found some wild code on the web i don't understand:
return Object.assign({}, state, {
[action.subreddit]: posts(state[action.subreddit], action)
})
What is [action.subreddit] doing? I thought that object keys had to be strings but this appears to be an array?
I'm hoping to understand mechanically how this code works.
thank you!
That's not an array as key, it's the es6 way to use a variable (/ a computed property) as the key.
Consider this:
var a = "foo";
function getKey() {
return "myKey";
}
var obj = {
[a] : "bar",
[getKey()] : "baz"
};
console.log(obj.foo); // bar
console.log(obj.myKey) // baz
So [action.subreddit] just sets the key's name to whatever value action.subreddit is holding.
This question already has answers here:
What do square brackets around a property name in an object literal mean?
(2 answers)
Closed 7 years ago.
Look at the example here:
https://github.com/rackt/redux/blob/master/examples/real-world/actions/index.js
return {
[CALL_API]: {
types: [ USER_REQUEST, USER_SUCCESS, USER_FAILURE ],
endpoint: `users/${login}`,
schema: Schemas.USER
}
}
CALL_API is in square brackets so I assumed maybe it was an array and this was a destructuring thing.
But CALL_API is defined as
export const CALL_API = Symbol('Call API')
So it's not an array or anything. I've also seen the use of square braces with non-symbols. So what's the difference between
CALL_API: {}
and
[CALL_API]: {}
This is a computed property - it's the equivalent of:
let result = {}
result[CALL_API] = { ... };
return result;
Combining this with Symbol lets the library author create a protocol that will not collide with other protocols (e. g. if the protocol was a string "call" then it could collide with other libraries that use someObject.call for their (unrelated) protocols - as well as colliding with Function.prototype.call.)
What this is doing is taking the value of the express [CALL_API] and using it as the key, thus setting the key dynamically.
Example:
var x = "hello";
var y = {
[x]: "world"
};
console.log(y); // Object {hello: "world"}
After some testing, I recommend being very careful with this. The following is perfectly valid:
var x = {"will": "this work?"};
var y = {[x]: "let's see"};
console.log(y); // Object {[object Object]: "let's see"}
console.log(y['[object Object]']); // "let's see"