Welcome to the first edition of a weekly showcase of some of the most useful features in JSON Hero. Be sure to checkout our Introduction to JSON Hero first to find out what it's all about.
Stop me if this sounds familiar: you are working with JSON data and your code throws a TypeError
or maybe you thought the field you are accessing only contains strings but one random instance has a number or array of strings.
Tracking down these types of issues in JSON can be cumbersome. It doesn't help that this is the type of error message you are presented with:
TypeError: Cannot read properties of null (reading 'toUpperCase')
Related Values to the rescue
JSON Hero makes finding these edge cases really easy using a feature called Related Values, which displays a grouped list of all other values at the selected path:
You can also expand each related value and navigate to it's path:
Related Values really shines when you are looking for undefined
or null
values at a specific path:
As you can see above there are 6 records that don't include the Designer
array (and 14 that do). This works for null
values as well:
It also gives you the ability to quick preview many different values efficiently:
Objects in arrays in objects in arrays
Related Values comprehensively traverses your JSON to find all possible related values for the currently selected path. For example, let's say you have the following JSON data:
[
{
"records": [
{
"images": [
{ "url": "https://i.imgur.com/HJRk15p.jpeg" },
{ "url": "https://i.imgur.com/SXVRTOW.jpeg" }
]
}
]
},
{
"records": [
{
"images": [
{ "url": "https://i.imgur.com/ABSS8nn.jpeg" },
{ "url": "https://i.imgur.com/sNVVC5i.jpeg" },
{ "url": "https://i.imgur.com/Gu9v4OW.jpeg" }
]
},
{
"images": [
{ "url": "https://i.imgur.com/U7zFOe9.jpeg" }
]
}
]
}
]
You can test this out on JSON Hero here
When you select $.0.records.0.images.0.url
you will see all 6 other Related Values because we basically "wildcard" the array parts (i.e. $.*.records.*.images.*.url
).:
If you liked this feature please give us a ⭐️ on GitHub, or let us know what you think by reaching us on Twitter or Discord.