Starting a map in typescript

Question

Starting a map in typescript

When attempting to initialize the following Map in typescript, I noticed that it appears empty when printed out.

let map: Map<string, object> = new Map<string, object> ([
    [
        "api/service/method",
        {
            uriPath: {}
        }
    ],
    [
        "\"type\": \"html\"",
        {
            body: {}
        }
    ]
]);

console.log(JSON.stringify(map));
// Output shows {}
// However, the initialized values are not displayed

javascript typescript

Answer 1

Answer №1

The initialization is correct, but when printed, not all values are displayed as in an array. However, by accessing the keys, you can verify their existence:

let map = new Map([
    [
        "api/service/method",
        {
            uriPath: {}
        }
    ],
    [
        "\"type\": \"html\"",
        {
            body: {}
        }
    ]
]);

console.log(map);
console.log(map.get('api/service/method'));
console.log(map.get('"type": "html"'));

For more information on displaying a JavaScript ES6 map object in the console, you can refer to this link.

As suggested there, you could also spread the map and print it out:

let map = new Map([
    [
        "api/service/method",
        {
            uriPath: {}
        }
    ],
    [
        "\"type\": \"html\"",
        {
            body: {}
        }
    ]
]);

console.log([...map]);

Answer 2

The initialization is correct, but when printed, not all values are displayed as in an array. However, by accessing the keys, you can verify their existence:

let map = new Map([
    [
        "api/service/method",
        {
            uriPath: {}
        }
    ],
    [
        "\"type\": \"html\"",
        {
            body: {}
        }
    ]
]);

console.log(map);
console.log(map.get('api/service/method'));
console.log(map.get('"type": "html"'));

For more information on displaying a JavaScript ES6 map object in the console, you can refer to this link.

As suggested there, you could also spread the map and print it out:

let map = new Map([
    [
        "api/service/method",
        {
            uriPath: {}
        }
    ],
    [
        "\"type\": \"html\"",
        {
            body: {}
        }
    ]
]);

console.log([...map]);

Answer 3

Answer №2

One reason for this behavior is that the JSON.stringify function is unable to stringify a Map, causing it to instead stringify the underlying object and resulting in an empty output.

To address this issue, consider using

console.log(JSON.stringify([...a.entries()]));

as an alternative solution.

Answer 4

One reason for this behavior is that the JSON.stringify function is unable to stringify a Map, causing it to instead stringify the underlying object and resulting in an empty output.

To address this issue, consider using

console.log(JSON.stringify([...a.entries()]));

as an alternative solution.

Answer 5

Answer №3

When you try to stringify an object, its properties are typically included in the stringification process. However, a Map does not store its data as traditional properties, which can lead to unexpected results if you attempt to stringify it directly.

To properly stringify a Map, consider converting it to an array first:

console.log(JSON.stringify([...map]));

Answer 6

When you try to stringify an object, its properties are typically included in the stringification process. However, a Map does not store its data as traditional properties, which can lead to unexpected results if you attempt to stringify it directly.

To properly stringify a Map, consider converting it to an array first:

console.log(JSON.stringify([...map]));

Starting a map in typescript

Answer №1

Answer №2

Answer №3

Similar questions

Quiz application features various button states for optimal user interaction

Ways to exclusively trigger the onclick function of the primary button when dealing with nested buttons in React.js

Encountering an issue with sending a direct message on Twitter through OAuth

Discover the method for populating Select2 dropdown with AJAX-loaded results

Tips for effectively eliminating errors in a redux store

Alter the Vue view using an object instead of the url router

What steps do I need to follow to develop a checkbox component that mirrors the value of a TextField?

What are alternative ways to add an HTML snippet to an existing file without relying on jQuery?

Creating a Node.js API using express and mysql to retrieve various data including record count, page number, and implementing pagination functionality

What could be the reason for reverse geocoding failure following the marker's movement when autocomplete event is triggered in Google Maps?

sw-precache-webpack-plugin for webpack's default service worker template

Encountering issues with executing Node.js MySQL query on the second attempt

Troubleshooting: Unable to load template file content in AngularJS ng-view

The classification of a dictionary and a list in Typescript

Issue with Custom Tooltip in Mootools 1.2 - Images displaying prematurely before hover action

Inquirer doesn't waste time lingering for user input following a prompt

Locate the Next Element Based on its Tag Name

Increase the jQuery level and utilize the .find() method

Error: You're attempting to read content that has already been accessed

JavaScript Regular Expression for separating a collection of email addresses into individual parts