My state object is:

[
    {
        traveller1_dob: '',
        traveller1_firstName:'',
        traveller1_isPreviousTraveller: false,
        traveller1_surname:'',
        traveller1_title: ''
    },
    {
        traveller2_dob: '',
        traveller2_firstName:'',
        traveller2_isPreviousTraveller: false,
        traveller2_surname:'',
        traveller2_title: ''
    }

]

and my payload is:

{key: "traveller1_firstName", value: "ABC", index: 0}

• key is the property of the object that needs to be updated
• value: is the value we want to update
• index: is the index of the traveller in state array

At the moment this is the way I updated:

let obj = state[payload.index];
obj[payload.key] = payload.value;

return _.unionBy(state, [obj], payload.key);

I am aware its not the best way.

Output should be:

[
    {
        traveller1_dob: '',
        traveller1_firstName:'ABC',
        traveller1_isPreviousTraveller: false,
        traveller1_surname:'',
        traveller1_title: ''
    },
    {
        traveller2_dob: '',
        traveller2_firstName:'',
        traveller2_isPreviousTraveller: false,
        traveller2_surname:'',
        traveller2_title: ''
    }

]

Ideally I want to get rid of index if it's possible.How would you do this?

My state object is:

[
    {
        traveller1_dob: '',
        traveller1_firstName:'',
        traveller1_isPreviousTraveller: false,
        traveller1_surname:'',
        traveller1_title: ''
    },
    {
        traveller2_dob: '',
        traveller2_firstName:'',
        traveller2_isPreviousTraveller: false,
        traveller2_surname:'',
        traveller2_title: ''
    }

]

and my payload is:

{key: "traveller1_firstName", value: "ABC", index: 0}

• key is the property of the object that needs to be updated
• value: is the value we want to update
• index: is the index of the traveller in state array

At the moment this is the way I updated:

let obj = state[payload.index];
obj[payload.key] = payload.value;

return _.unionBy(state, [obj], payload.key);

I am aware its not the best way.

Output should be:

[
    {
        traveller1_dob: '',
        traveller1_firstName:'ABC',
        traveller1_isPreviousTraveller: false,
        traveller1_surname:'',
        traveller1_title: ''
    },
    {
        traveller2_dob: '',
        traveller2_firstName:'',
        traveller2_isPreviousTraveller: false,
        traveller2_surname:'',
        traveller2_title: ''
    }

]

Ideally I want to get rid of index if it's possible.How would you do this?

• javascript
• lodash

• I guess a simple operation like this would do data[payload.index][payload.key] = payload.value; not much different from what you did earlier but it is better since it is able to do it in one step. – user93 Commented Sep 28, 2017 at 2:27
• but if you want to do it point free form without variables you could libraries like ramdajs instead of lodash to do so like this jsfiddle/cdxaefvg – user93 Commented Sep 28, 2017 at 2:32
• If you notice I manipulated the state obj directly as well. which i not a good idea – Negin Basiri Commented Sep 28, 2017 at 2:32
• jsfiddle/cdxaefvg – user93 Commented Sep 28, 2017 at 2:34
• 2 What's the point of an array of objects when the individual objects have uniquely numbered property names? Wouldn't it make more sense for both objects to have the same (un-numbered) properties, and then reference traveler 1 or 2 by its array index? – nnnnnn Commented Sep 28, 2017 at 2:53

1 Answer 1

You're right, you can get rid of the index, and just map over your state and check hasOwnProperty on each stateItem and pare them to the payload.key. The snippet below should solve your problem:

let state = [{
        traveller1_dob: '',
        traveller1_firstName: '',
        traveller1_isPreviousTraveller: false,
        traveller1_surname: '',
        traveller1_title: ''
    }, {
        traveller2_dob: '',
        traveller2_firstName: '',
        traveller2_isPreviousTraveller: false,
        traveller2_surname: '',
        traveller2_title: ''
    }

];


function updateState(payload) {

    const updatedState = _.map(state, stateItem => {
        if (stateItem.hasOwnProperty(payload.key)) {
            stateItem[payload.key] = payload.value;
        }
        return stateItem;
    });

    console.log(updatedState);
    return updatedState;
}

const samplePayload = {
    key: "traveller1_firstName",
    value: "ABC",
    index: 0
};

updateState(samplePayload);

<script src="https://cdnjs.cloudflare./ajax/libs/lodash.js/4.17.4/lodash.js"></script>