title: Nested array filtering, is there a more elegant way?
body: <p>I'm trying to filter a nested structure, based on a search string. </p>
  
  <p>If the search string is matched in an item, then I want to keep that item in the structure, along with its parents. </p>
  
  <p>If the search string is not found, and the item has no children, it can be discounted.</p>
  
  <p>I've got some code working which uses a recursive array filter to check the children of each item:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>const data = {
    id: '0.1',
    children: [
      {
        children: [],
        id: '1.1'
      },
      {
        id: '1.2',
        children: [
          {
            children: [],
            id: '2.1'
          },
          {
            id: '2.2',
            children: [
              {
                id: '3.1',
                children: []
              },
              {
                id: '3.2',
                children: []
              },
              {
                id: '3.3',
                children: []
              }
            ]
          },
          {
            children: [],
            id: '2.3'
          }
        ]
      }
    ]
  };
  
  
  const searchString = '3.3';
  
  const filterChildren = (item) =&gt; {
    if (item.children.length) {
      item.children = item.children.filter(filterChildren);
      return item.children.length;
    }
    return item.id.includes(searchString);
  };
  
  
  data.children = data.children.filter(filterChildren);
  
  console.log(data);
  
  /*This outputs:
  {
    "id": "0.1",
    "children": [
      {
        "id": "1.2",
        "children": [
          {
            "id": "2.2",
            "children": [
              {
                "id": "3.3",
                "children": []
              }
            ]
          }
        ]
      }
    ]
  }*/</code></pre>
  </div>
  </div>
  </p>
  
  <p>I'm concerned that if my data structure becomes massive, this won't be very efficient. </p>
  
  <p>Can this be achieved in a 'nicer' way, that limits the amount of looping going on? I'm thinking probably using a reducer/transducer or something similarly exciting :) </p>