ES6 deep nested object destructuring - javascript

I have an object called this.props which contains
{
actions: Object,
dirty: false,
form: "Statement",
autofill: function(),
**statement: Object**
}
statement contains
{
firstName: "John"
lastName: "Peter"
isConfirmed: true
}
I would like to extract statement object and the isConfirmed property in the same line using es6 destructuring
I've tried
const { statement: isConfirmed, isAdmin } = this.props
which I get an error when I do let a = isConfirmed, b = statement

I would like to extract statement object and the isConfirmed property in the same line
const { statement: { isConfirmed }, statement } = this.props;
That way you get both isConfirmed and the whole statement object.
References:
https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment#Nested_object_and_array_destructuring

Related

How to group by using reduce in Javascript [duplicate]

I have an object called this.props which contains
{
actions: Object,
dirty: false,
form: "Statement",
autofill: function(),
**statement: Object**
}
statement contains
{
firstName: "John"
lastName: "Peter"
isConfirmed: true
}
I would like to extract statement object and the isConfirmed property in the same line using es6 destructuring
I've tried
const { statement: isConfirmed, isAdmin } = this.props
which I get an error when I do let a = isConfirmed, b = statement
I would like to extract statement object and the isConfirmed property in the same line
const { statement: { isConfirmed }, statement } = this.props;
That way you get both isConfirmed and the whole statement object.
References:
https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment#Nested_object_and_array_destructuring

Key exist in object in object

I need to check key exist in object of object. I have array of object and in every object i have one other object. I need to check the key is existing in object of object
var myarr = [{
hello: "world",
payload: {
kekek: 'sdfsdfsdf',
baby: 'sdfsdfsdfds'
}
},
{
hello: "world",
payload: {
qwe: 'sdfsdfsdf',
baby: 'sdfsdfsdfds'
}
}, {
hello: "world",
payload: {
qwe: 'sdfsdfsdf',
baby: 'sdfsdfsdfds'
}
},
{
hello: "world",
payload: {
asdf: 'sdfsdfsdf',
baby: 'sdfsdfsdfds'
}
}
]
let pp = myarr.payload.hasOwnProperty('eekey')
console.log(pp).
I need to check kekek in payload.
If I understood correctly, you want to check if every of object of your array contains a specific key in payload property. If so, you can use in operator to check if a property is present in a object. You can improve this snippet by checking if value is defined.
let key = 'kekek';
const everyObjectHasKey = myarr.every(item => item.payload && key in item.payload);
console.log(everyObjectHasKey);
In this link https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/every , you can see more about every method for arrays

Javascript objects: How do I make the value of a key be another key (not the key's value)?

Is there a way to programmatically set the value of a key to another key? e.g.
export function getObjectForMapStateToProps(state, reducer) {
let stateObject = {};
for (let key in state[reducer]) {
if (state[reducer].hasOwnProperty(key)) {
stateObject[key] = state[reducer][key];
}
}
return stateObject;
}
The goal is for this to return an object where each key, value pair is like so:
namespace: state.city.namespace
What I am actually getting is the VALUE of the state.city.namespace key:
namespace: 'DIskieisSi98s8sjw'.
Thanks in advance for your help!
EDIT -- ADDING ADDITIONAL CONTEXT
#mem035 I probably should have added this context. I am trying create a function that will enable me to stop having to type out the mapStateToProps for Redux. For the above example, here is the map:
const mapStateToProps = state => {
console.log(getObjectForMapStateToProps(state, 'city'));
return {
namespace: state.city.namespace,
componentId: state.city.componentId,
items: state.city.items,
defaultValue: state.city.defaultValue,
selectItem: state.city.selectItem,
allowAdd: state.city.allowAdd,
validationRegEx: state.city.validationRegEx,
regExDescription: state.city.regExDescription,
hasForeignKey: state.city.hasForeignKey,
foreignKeyModel: state.city.foreignKeyModel,
foreignKeyValue: state.city.foreignKeyValue,
errorMessages: state.city.errorMessages,
isError: state.city.isError,
isLoading: state.city.isLoading,
apiRoute: state.city.apiRoute
};
};
When the value becomes a string none of the properties are mapping/working.
Just stringify your result instead of again accessing the object.
Instead of:
stateObject[key] = state[reducer][key];
Use:
stateObject[key] = `state.${reducer}.${key}`;

deep change state with variable index

I'm trying to follow the instructions found in Cleaner/shorter way to update nested state in Redux? [the accepted answer]
The thing is in my particular case, i have a layer that really depends on which model the user has selected up to that point. My structure:
Now in my reducer, i've tried (just want to change the favorite leaf to true):
let newStateForFavorites = {...state, models: {
...state.models,
62416: {
...state.models.62416,
details: {
...state.models.62416.details,
favorited: true
}
}
}};
Javascript complains. If i try to extract it to a var:
const currentModelToFav = action.payload.model_id;
let newStateForFavorites = {...state, models: {
...state.models,
currentModelToFav: {
...state.models.currentModelToFav,
details: {
...state.models.currentModelToFav.details,
favorited: true
}
}
}};
Javascript does not associate the const. And it errors out -currentModelToFav is undefined-
Ideas of what i'm doing wrong? Thanks!
If you want to use a variable as a property name you'll have to use these constructs:
{[variableName] : value}
and
{propertyName : variable[variableName]}
So, your object literal will become:
const currentModelToFav = action.payload.model_id;
let newStateForFavorites = {...state, models: {
...state.models,
[currentModelToFav]: {
...state.models[currentModelToFav],
details: {
...state.models[currentModelToFav].details,
favorited: true
}
}
}};
You need to use bracket notation to pull an object key using a variable:
const currentModelToFav = action.payload.model_id;
let newStateForFavorites = {
...state,
models: {
...state.models,
[currentModelToFav]: {
...state.models[currentModelToFav],
details: {
...state.models[currentModelToFav].details,
favorited: true
}
}
}
};

ES6 destructuring two objects with same property name

i have two javascript object with the next syntax:
let section = { name: "foo", tables: [] }
let field = { name: "bar", properties: {} }
and a function who expect those objects, but in the function i only use the name of each object, so i wanted to know if i can destructuring the two objects in the function's declaration like:
function something( {name}, {name} ) {
//code
}
the first should be section.name and the second should be field.name.
Is there a way two do a destructuring in this scenario? or should i spect only the names in the function?
Which is better?
Thank you.
Yup, it looks like you can label/reassign the parameters: {before<colon>after}
var section = { name: 'foo', tables: [] };
var field = { name: "bar", properties: {} };
function something({ name: sectionName }, { name: fieldName }) {
console.log(sectionName, fieldName);
}
something(section, field);

Categories