Converting a TypeScript nested dictionary into a list of strings

Question

Converting a TypeScript nested dictionary into a list of strings

I am currently working with a nested dictionary and my goal is to convert it into a list of strings. For example, the initial input looks like this:

var group = {
    '5': {
        '1': {
            '1': [1, 2, 3],
            '2': [1]
        },
        '2':{
            '1': [2, 4],
            '2': [1]
        }
    },
    '1': {
        '1':{
            '1':[1, 2, 5],
            '2':[1]
        },
        '2':{
            '1':[2, 3]
        }
    }
};

The desired output should be:

a = ["5.1.1.1", "5.1.1.2", "5.1.1.3"..... "1.2.1.3"]

To achieve this, I began by creating a recursive function:

function printValues(obj) {
    for (var key in obj) {
    console.log(key)
        if (typeof obj[key] === "object") {
            printValues(obj[key]);   
        } else {
            console.log(obj[key]);    
        }
    }
}

However, the function is not producing the expected result yet..

javascript angular typescript

Answer 1

Answer №1

To tackle this problem, one effective approach is to combine iterative and recursive methods to extract the most deeply nested items first and construct the desired strings.

What is the underlying process?

This method involves iterating through an object's key/value pairs and appending a spreaded array to the final result set.

The spreading array can either be

an array of values or

an array obtained by recursively calling the function with the object v as input

Both arrays are then mapped using the object's key k and an element from the associated array to generate the desired style n.m.

For instance, consider a sub-object { 1: [2, 4], 2: [1] } and retrieve an array of key/values.
[
    [1, [2, 4]],
    [2, [1]]
]
This represents the outcome after the initial stage of reduce. The sequence follows the logical flow starting from the innermost level:

Identify it as an array,

Fetch v with [2, 4],

Map this value along with k 1,

Obtain array of ['1.2', '1.4'],

Spread this array and

Append each element as parameter.

Proceed to the subsequent iteration and fetch ['1.2', '1.4', '2.1']. This output serves as the value extracted by getPathes and linked with the current key in front of each string.

The end result is achieved via a depth-first search to access the deepest internal array and prepend the key before each item.

function getPathes(object) {
    return Object.entries(object).reduce((r, [k, v]) => {
        r.push(...(Array.isArray(v) ? v : getPathes(v)).map(l => `${k}.${l}`));
        return r;
    }, []);
}

var group = { 5: { 1: { 1: [1, 2, 3], 2: [1] }, 2: { 1: [2, 4], 2: [1] } }, 1: { 1: { 1: [1, 2, 5], 2: [1] }, 2: { 1: [2, 3] } } },
    result = getPathes(group);

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 2

To tackle this problem, one effective approach is to combine iterative and recursive methods to extract the most deeply nested items first and construct the desired strings.

What is the underlying process?

This method involves iterating through an object's key/value pairs and appending a spreaded array to the final result set.

The spreading array can either be

an array of values or

an array obtained by recursively calling the function with the object v as input

Both arrays are then mapped using the object's key k and an element from the associated array to generate the desired style n.m.

For instance, consider a sub-object { 1: [2, 4], 2: [1] } and retrieve an array of key/values.
[
    [1, [2, 4]],
    [2, [1]]
]
This represents the outcome after the initial stage of reduce. The sequence follows the logical flow starting from the innermost level:

Identify it as an array,

Fetch v with [2, 4],

Map this value along with k 1,

Obtain array of ['1.2', '1.4'],

Spread this array and

Append each element as parameter.

Proceed to the subsequent iteration and fetch ['1.2', '1.4', '2.1']. This output serves as the value extracted by getPathes and linked with the current key in front of each string.

The end result is achieved via a depth-first search to access the deepest internal array and prepend the key before each item.

function getPathes(object) {
    return Object.entries(object).reduce((r, [k, v]) => {
        r.push(...(Array.isArray(v) ? v : getPathes(v)).map(l => `${k}.${l}`));
        return r;
    }, []);
}

var group = { 5: { 1: { 1: [1, 2, 3], 2: [1] }, 2: { 1: [2, 4], 2: [1] } }, 1: { 1: { 1: [1, 2, 5], 2: [1] }, 2: { 1: [2, 3] } } },
    result = getPathes(group);

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 3

Answer №2

If you need to traverse through nested objects and arrays, you can implement a recursive function using Object.entries:

var data = {
    '5': {
        '1': {
            '1': [1,2,3],
            '2': [1]
        },
        '2':{
            '1': [2,4],
            '2': [1]
        }
    },
    '1': {
        '1':{
            '1':[1,2,5],
            '2':[1]
        },
        '2':{
            '1':[2,3]
        }
    }
};

let result = []
const extractPaths = (path, value) => {
  if (Array.isArray(value)) {
    value.forEach(item => result.push([...path, item].join('.')))
  } else {
    Object.entries(value).forEach(([key, value]) => extractPaths([...path, key], value))
  }
}

extractPaths([], data)
console.log(result)

Answer 4

If you need to traverse through nested objects and arrays, you can implement a recursive function using Object.entries:

var data = {
    '5': {
        '1': {
            '1': [1,2,3],
            '2': [1]
        },
        '2':{
            '1': [2,4],
            '2': [1]
        }
    },
    '1': {
        '1':{
            '1':[1,2,5],
            '2':[1]
        },
        '2':{
            '1':[2,3]
        }
    }
};

let result = []
const extractPaths = (path, value) => {
  if (Array.isArray(value)) {
    value.forEach(item => result.push([...path, item].join('.')))
  } else {
    Object.entries(value).forEach(([key, value]) => extractPaths([...path, key], value))
  }
}

extractPaths([], data)
console.log(result)

Converting a TypeScript nested dictionary into a list of strings

Answer №1

Answer №2

Similar questions

How about adjusting this RPG Battle Sequence?

Attempting to single out various entities within a JSON array through the use of radio buttons

Dynamic value updates using jQuery input type formulas

What are the steps to set up mocha to automatically monitor source or project files?

``There appears to be an issue with the functionality of the jQuery

Server requests are being redirected to /index.html in order to load the React/Angular SPA

Duplicate user scrolling input within a specified div container

Angular: Unable to access values of non-existent data (reading '0')

Filtering strings with the same suffix

Exploring methods to successfully upload a blob to Firebase and modify it using cloud functions

Unexpected outcome when returning a map

Searching and Sorting through JSON Data in React Native

Updating the content within a div following the submission of a contact form 7

How can I design a Typescript interface that accommodates both strings and other data types?

How to Display Prices in Euros Currency with Angular Filter

What are the steps to resolve the UglifyJs error stating 'Unexpected token operator'?

Exploring the @HostBinding argument in Angular directives

Display four unique automobile insignias using Webcomponent/Stencil.js

The CORS policy has blocked access to XMLHttpRequest at 'https://saja.smjd.ir/api/Account/login' from the specified origin 'http://**'

Implement a feature to dynamically load data as the user scrolls up, similar to the