Deep concatenation of nested array object values using Lodash

Question

I have an array of objects, and each of those objects may contain children, which is another array of the same structure. I want to concatenate values of each object into a list of strings delimited with a character.

For example:

var array = [{
    "text": "one",
    "children": [
      {
        "text": "two",
        "children": [
          {
            "text": "foo"
          },
          {
            "text": "bar"
          },
          {
            "text": "baz"
          }
        ]
      },
      {
        "text": "three",
        "children": [
          {
            "text": "foo"
          },
          {
            "text": "bar"
          },
          {
            "text": "baz"
          }
        ]
      }
    ]
}, {
    "text": "two",
    "children": [
      {
        "text": "hello",
        "children": [
          {
            "text": "world"
          },
          {
            "text": "planet"
          }
        ]
      }
    ]
}];

Would result in:

[
    "one two foo",
    "one two bar",
    "one two baz",
    "one three foo",
    "one three bar",
    "one three baz",
    "two hello world",
    "two hello planet"
];

Is there any way this can be achieved using Lodash?

Mikhail Shabrikov · Accepted Answer · 2017-06-02 12:19:15Z

1

My solution:

function concatString(currentString, object) {
  let string = currentString;

  if (object.text) {
    string = string + ' ' + object.text;
  }

  if (object.children) {
    string = object.children.map(item => concatString(string, item));
  }

  return string;
}

const result = _.flattenDeep(array.map(arrayItem => concatString('', arrayItem)));

https://jsfiddle.net/tqcj18so/1/

edited Jun 2, 2017 at 12:19

answered Jun 2, 2017 at 12:07

Mikhail Shabrikov

8,5091 gold badge30 silver badges36 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

driima Over a year ago

I accepted this answer instead as it uses Lodash as requested.

Ori Drori · Accepted Answer · 2017-06-02 11:03:32Z

1

You can use Array#map recursively to collect the strings, and then flatten the results using Array#concat.

ES6:

const array = [{"text":"one","children":[{"text":"two","children":[{"text":"foo"},{"text":"bar"},{"text":"baz"}]},{"text":"three","children":[{"text":"foo"},{"text":"bar"},{"text":"baz"}]}]},{"text":"two","children":[{"text":"hello","children":[{"text":"world"},{"text":"planet"}]}]}];

const collect = (arr, pre = '') => {
  return [].concat([], ...arr.map((item) => {
    const label = `${pre} ${item.text}`.trim();
  
    return item.children ? collect(item.children, label) : label;
  }));
}

const result = collect(array);

console.log(result);

ES5:

var array = [{"text":"one","children":[{"text":"two","children":[{"text":"foo"},{"text":"bar"},{"text":"baz"}]},{"text":"three","children":[{"text":"foo"},{"text":"bar"},{"text":"baz"}]}]},{"text":"two","children":[{"text":"hello","children":[{"text":"world"},{"text":"planet"}]}]}];

function collect (arr, pre) {
  return [].concat.apply([], arr.map(function(item) {
    var label = (pre + ' ' + item.text).trim();
  
    return item.children ? collect(item.children, label) : label;
  }));
}

var result = collect(array, '');

console.log(result);

edited Jun 2, 2017 at 11:03

answered Jun 2, 2017 at 10:57

Ori Drori

196k32 gold badges243 silver badges233 bronze badges

2 Comments

driima Over a year ago

Ah, so there's no way to achieve this directly in Lodash? This works better than what I had already, and it's a lot smaller. Thanks!

Ori Drori Over a year ago

@BeautifulChaos - lodash doesn't contain any method to recursively combine properties as far as I know. Welcome :)

Collectives™ on Stack Overflow

Deep concatenation of nested array object values using Lodash

2 Answers 2

1 Comment

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related