CODEWITHSUNDEEP
javascriptarrays
Alex
Alex

Reputation: 79

Return new array with specific values using map()

Please help me with a solution to extract in a new array only the specific object that has the paramenter checked: true. See the example below:

    {nodeName: 'node1', nodeId: 1, checked: false },
    {nodeName: 'node2', nodeId: 2, checked: true },
    {nodeName: 'node3', nodeId: 3, checked: false },
    {nodeName: 'node4', nodeId: 4, checked: true },
    {nodeName: 'node5', nodeId: 5, checked: false },
    {nodeName: 'node6', nodeId: 6, checked: true },
]

let checkedNodes = nodes.map(node => {
    let options = {
        "name": node.nodeName,
        "id": node.nodeId,
        "checked": node.checked
    }
    
    return options;
})

This will return all the nodes :(
How can I make the verification, in order to return the array like this?

[
    {
        "name": "node2",
        "id": 2,
        "checked": true
    },
    {
        "name": "node4",
        "id": 4,
        "checked": true
    },
    {
        "name": "node6",
        "id": 6,
        "checked": true
    }
]

Upvotes: 1

Views: 55

Answers (5)

Nexo
Nexo

Reputation: 2331

  • You can use filter() method of array.
  • below we are iterating though the array and returning node object whenever node.checked is true.

let data = [{
    nodeName: 'node1',
    nodeId: 1,
    checked: false
  },
  {
    nodeName: 'node2',
    nodeId: 2,
    checked: true
  },
  {
    nodeName: 'node3',
    nodeId: 3,
    checked: false
  },
  {
    nodeName: 'node4',
    nodeId: 4,
    checked: true
  },
  {
    nodeName: 'node5',
    nodeId: 5,
    checked: false
  },
  {
    nodeName: 'node6',
    nodeId: 6,
    checked: true
  },
]
// we are using filter method of array and just returning node.checked is true.
let result = data.filter(node => {
  if (node.checked) {
    return node;
  }
});
console.log(result);

Upvotes: 0

ilkerkaran
ilkerkaran

Reputation: 4354

You should use filter and map to get the desired array;

nodes.filter(n => n.checked)
  .map(n => ({id: n.nodeId,
    name: n.nodeName,
    checked})

Upvotes: 0

samanime
samanime

Reputation: 26617

You can't do this with just .map(). .map() will always return an array the same exact size of the input array.

You can either .filter() the array then .map(), or use .reduce().

In this case, .filter() is going to be the easiest, both to read and write. Just include it before the .map() call:

const nodes = [
  {nodeName: 'node1', nodeId: 1, checked: false },
  {nodeName: 'node2', nodeId: 2, checked: true },
  {nodeName: 'node3', nodeId: 3, checked: false },
  {nodeName: 'node4', nodeId: 4, checked: true },
  {nodeName: 'node5', nodeId: 5, checked: false },
  {nodeName: 'node6', nodeId: 6, checked: true },
]

const checkedNodes = nodes
  .filter(node => node.checked)
  .map(node => ({
    name: node.nodeName,
    id: node.nodeId,
    checked: node.checked
  }));
  
console.log(checkedNodes);

The only downside to this approach is it'll iterate over your list possibly twice, which is fine for small sets like this. If it was a large set of nodes, you'd want to consider using .reduce(), which could do it in one loop (at the cost of readability).

const nodes = [
  {nodeName: 'node1', nodeId: 1, checked: false },
  {nodeName: 'node2', nodeId: 2, checked: true },
  {nodeName: 'node3', nodeId: 3, checked: false },
  {nodeName: 'node4', nodeId: 4, checked: true },
  {nodeName: 'node5', nodeId: 5, checked: false },
  {nodeName: 'node6', nodeId: 6, checked: true },
]

const checkedNodes = nodes
  .reduce((acc, node) => {
    if (node.checked) {
      acc.push({
        name: node.nodeName,
        id: node.nodeId,
        checked: node.checked
      })
    }

    return acc;
  }, []);

console.log(checkedNodes);

Upvotes: 0

Majed Badawi
Majed Badawi

Reputation: 28424

const nodes = [ {nodeName: 'node1', nodeId: 1, checked: false }, {nodeName: 'node2', nodeId: 2, checked: true }, {nodeName: 'node3', nodeId: 3, checked: false }, {nodeName: 'node4', nodeId: 4, checked: true }, {nodeName: 'node5', nodeId: 5, checked: false }, {nodeName: 'node6', nodeId: 6, checked: true } ];

const chekedNodes = nodes
  .filter(node => node.checked === true)
  .map(node => ({ name: node.nodeName, id: node.nodeId, checked: node.checked }));

console.log(chekedNodes);

const nodes = [ {nodeName: 'node1', nodeId: 1, checked: false }, {nodeName: 'node2', nodeId: 2, checked: true }, {nodeName: 'node3', nodeId: 3, checked: false }, {nodeName: 'node4', nodeId: 4, checked: true }, {nodeName: 'node5', nodeId: 5, checked: false }, {nodeName: 'node6', nodeId: 6, checked: true } ];

const chekedNodes = nodes.reduce((list, node) => {
  if(node.checked === true) {
    list.push({ name: node.nodeName, id: node.nodeId, checked: node.checked });
  }
  return list;
}, []);

console.log(chekedNodes);

Upvotes: 0

Chris Heald
Chris Heald

Reputation: 62668

Map is inappropriate for this task - it is used to take a list of inputs and to produce an output for each input (see documentation).

You want to use find (for one result or undefined) or filter (for an array of 0 or or more matching objects).

// Find the first checked node, or undefined if none are checked
const checkedNodes = nodes.find(node => node.checked);

// Find all checked nodes
const checkedNodes = nodes.filter(node => node.checked);

Upvotes: 1

Related Questions