JavaScript return other object if array string matches object property value

PriyankaMistry
April 3, 2023
252 views
2 votes
3 Answers

I’ve an simple array of string ids and object and on initial load I’m mapping this Ids with this object and making checked property to true

const Ids = ['743156', '743157']

[
    {
        "id": "743156",
        "role": "Authorized Redistributor (AR)",
        "checked": true,
        "checkBoxPatched": true
    },
    {
        "id": "743157",
        "role": "System Of Record (SOR)",
        "checked": true,
        "checkBoxPatched": true
    },
    {
        "id": "743158",
        "role": "Authorized Redistributor (AR)",
        "checked": false,
        "checkBoxPatched": true
    },
    {
        "id": "743159",
        "role": "System Of Record (SOR)",
        "checked": false,
        "checkBoxPatched": true
    },
    {
        "id": "743976",
        "role": "Authorized Redistributor (AR)",
        "checked": false,
        "checkBoxPatched": true
    },
]

Now, user has the option to update by checking checkboxes making checked as true, which might make others Ids checked property to true. How can I get the object whose checked property is true BUT it shouldn’t be initial two objects with checked as true.
So For eg I uncheck checkbox with ID 743156 and check 743158 I should get below two objects and if the user hasn’t checked any NEW checkbox it should return me with empty object {} and not initial checked checkboxes with ids 743156 & 743157 with checked true

 {
        "id": "743157",
        "role": "System Of Record (SOR)",
        "checked": true,
        "checkBoxPatched": true
    },
    {
        "id": "743158",
        "role": "Authorized Redistributor (AR)",
        "checked": true,
        "checkBoxPatched": true
    }

Answers

you can simply use filter() method in JS

const arrObj = [
    {
        "id": "743156",
        "role": "Authorized Redistributor (AR)",
        "checked": true,
        "checkBoxPatched": true
    },
    {
        "id": "743157",
        "role": "System Of Record (SOR)",
        "checked": true,
        "checkBoxPatched": true
    },
    {
        "id": "743158",
        "role": "Authorized Redistributor (AR)",
        "checked": false,
        "checkBoxPatched": true
    },
    {
        "id": "743159",
        "role": "System Of Record (SOR)",
        "checked": false,
        "checkBoxPatched": true
    },
    {
        "id": "743976",
        "role": "Authorized Redistributor (AR)",
        "checked": false,
        "checkBoxPatched": true
    },
]

const filterdData = arrObj.filter((_obj)=> _obj.checked === true);

console.log(filterdData)

Array.prototype.filter()

To omit the first two objects having ids of ids array respectively and get the checked values,

const data = [
    {
        "id": "743156",
        "role": "Authorized Redistributor (AR)",
        "checked": true,
        "checkBoxPatched": true
    },
    {
        "id": "743157",
        "role": "System Of Record (SOR)",
        "checked": true,
        "checkBoxPatched": true
    },
    {
        "id": "743158",
        "role": "Authorized Redistributor (AR)",
        "checked": false,
        "checkBoxPatched": true
    },
    {
        "id": "743159",
        "role": "System Of Record (SOR)",
        "checked": false,
        "checkBoxPatched": true
    },
    {
        "id": "743976",
        "role": "Authorized Redistributor (AR)",
        "checked": false,
        "checkBoxPatched": true
    }
];

const ids = ["743156", "743157"];
const checkedArr = [];
data.map((d) => {
    if (!ids.includes(d.id) && d.checked === true) {
        checkedArr.push(d);
    }
})

console.log(checkedArr);

Here the same_ids_lists function is used to check whether there have been any changes in which items are checked. It may not be necessary to sort and copy the list arrays if they would always be in the same order.

const ids = ['743156', '743157'];
const data = [
    {
        "id": "743156",
        "role": "Authorized Redistributor (AR)",
        "checked": true,
        "checkBoxPatched": true
    },
    {
        "id": "743157",
        "role": "System Of Record (SOR)",
        "checked": true,
        "checkBoxPatched": true
    },
    {
        "id": "743158",
        "role": "Authorized Redistributor (AR)",
        "checked": false,
        "checkBoxPatched": true
    },
    {
        "id": "743159",
        "role": "System Of Record (SOR)",
        "checked": false,
        "checkBoxPatched": true
    },
    {
        "id": "743976",
        "role": "Authorized Redistributor (AR)",
        "checked": false,
        "checkBoxPatched": true
    },
];

const same_ids_lists = (list_1, list_2) =>
  [...list_1].sort().join('-') === [...list_2].sort().join('-');

const get_new_checked_if_changed = (data, last_ids) => {
  const checked = data.filter( (item) => item.checked );
  
  const is_unchanged = same_ids_lists(
    checked.map( (item) => item.id ),
    last_ids
  );
  
  return is_unchanged ? false : checked;
};

console.log('When unchanged: ', get_new_checked_if_changed(data, ids));

data[0].checked = false;
data[2].checked = true;

console.log('When changed: ', get_new_checked_if_changed(data, ids));

Edit: changed get_new_checked_if_changed to return false on unchanged, otherwise unchanged and no checked items would be indistinguishable.

Please signup or login to give your own answer.

Click here to cancel reply.