How to Fix the Undefined Error When Retrieving Values from a Multidimensional Array in GTM

Описание: Discover the solution to the `undefined` error in Google Tag Manager when trying to access values from a multidimensional array.
---
This video is based on the question https://stackoverflow.com/q/68298163/ asked by the user 'aadm' ( https://stackoverflow.com/u/16401743/ ) and on the answer https://stackoverflow.com/a/68300563/ provided by the user 'Artem Korneev' ( https://stackoverflow.com/u/5697369/ ) at 'Stack Overflow' website. Thanks to these great users and Stackexchange community for their contributions.

Visit these links for original content and any more details, such as alternate solutions, latest updates/developments on topic, comments, revision history etc. For example, the original title of the Question was: GTM doesn't return the value from array

Also, Content (except music) licensed under CC BY-SA https://meta.stackexchange.com/help/l...
The original Question post is licensed under the 'CC BY-SA 4.0' ( https://creativecommons.org/licenses/... ) license, and the original Answer post is licensed under the 'CC BY-SA 4.0' ( https://creativecommons.org/licenses/... ) license.

If anything seems off to you, please feel free to write me at vlogize [AT] gmail [DOT] com.
---
Solving the GTM Undefined Error for Array Values

When working with Google Tag Manager (GTM), many users encounter issues when trying to retrieve values from arrays, particularly multidimensional ones. A common scenario involves needing to extract specific data based on a key, such as the price of an item based on its title. This guide will guide you through identifying and solving a common problem: why your code might be returning undefined instead of the desired value.

The Problem: Returning Undefined

In the example presented, a user was attempting to create a custom JavaScript variable in GTM that would retrieve the finalPrice of an item in an array of products whose title was "Orange". Here’s the original code that was provided:

[[See Video to Reveal this Text or Code Snippet]]

Despite the logical structure, this code returned undefined instead of the expected finalPrice of 10 for the product "Orange".

The Solution: Adding Return Statement

The issue with the original code lies in how the function inside items.find() is defined. The function does not have an explicit return statement, causing the condition to evaluate without providing a proper response. To fix this, you need to ensure that the correct value is returned from the function. Here’s the corrected code:

[[See Video to Reveal this Text or Code Snippet]]

Breakdown of the Corrected Code

Using the find Method: The .find() method searches through the array and returns the first element that matches the condition specified in the provided function.

Adding the return Keyword: By adding return before the condition inside the function, you ensure that the function correctly returns whether the title matches "Orange".

Accessing the finalPrice: Once the matching item is found, you can then access its finalPrice property and return that value.

Conclusion

By including a return statement in the anonymous function used with .find(), you resolve the issue of returning undefined. This small but significant change allows GTM to properly evaluate the condition and successfully retrieve the finalPrice you’re seeking.

Final Thoughts

When working with JavaScript, especially in environments like GTM, always remember to check for missing return statements in your functions. These minor oversights can lead to frustrating errors and debugging sessions. If you're ever in doubt, take a moment to review your logic and ensure that all necessary values are being returned correctly. Happy coding!