map — GTM Variable Template for Array

VARIABLES › ARRAY

map CORE Array

Direct (.tpl) Apply (.tpl) Add to GTM

Transforms each item in an array using a callback function or extracts a property from each object.

---

When to Use This

GA4 Ecommerce

Build and transform ecommerce data structures for GA4 event tracking.

Type Conversion

Safely convert between data types — strings, numbers, booleans, arrays, objects.

Extraction

Pull specific values, segments, or patterns from complex data structures.

---

Examples

Multiply each by 2▶ Try

INPUT

Array to Map: [1, 2, 3, 4, 5]
Callback or Property Name: function(x) { return x * 2; }

OUTPUT

[2, 4, 6, 8, 10]

Extract property from objects▶ Try

INPUT

Array to Map: [{name: 'John', age: 25}, {name: 'Jane', age: 30}, {name: 'Bob', age: 35}]
Callback or Property Name: function(obj) { return obj.name; }

OUTPUT

['John', 'Jane', 'Bob']

---

Live Sandbox

This is what you'll see when you open this variable in Google Tag Manager. Hover the icons for details.

map

Read-Only Try Live

Array to Map

💾 The array to transform or extract values from.

Supported formats:
  ✓ Array: [1, 2, 3]
  ✓ Array of objects: [{name: "John"}, {name: "Jane"}]

Callback or Property Name

💾 Function to transform each item, or property name to extract.

Supported formats:
  ✓ Function: x => x * 2
  ✓ Property name: "name", "id"

💡 Using a property name extracts that property from each object in the array.

Input Setup

Input Function (optional)

⚙️ Optional pre-processing function applied to the array before mapping (e.g., filter invalid items, sort array).

Result Handling

Output Function (optional)

⚙️ Optional function to apply to the result array before returning it (e.g., arr => arr.join(','), arr => arr.filter(x => x != null)). Useful for chaining transformations on the output.

Array to Map array

💡 Type any text to see the result update live

🎯 Using special value — click input to type instead

Test with:

Falsy undefined null "" empty 0 false NaN

Truthy true 42 "hello" {} empty [] empty {a:1} [1,2,3]

Callback or Property Name function

🔗 Result Handling — Chain Variables

Chain apply-mode variables to the output. Each variable receives the result of the previous one.

mapArray()

+ Chain another variable

---

Related Variables

Same category: Array

→ chunk → compact → dropItems → dropItemsRight → every → filterArray → find → findIndexByCallback → findIndexByRegex → flatten → head → includesAll → includesAny → includesNone → join → last → lastIndexOf → reduce → reduceRight → reverse → selectFromArray → some → sort → tail → takeItems → takeItemsRight → uniq → wrapInArray → ⚡ ARRAY › From Indexed Values → ⚡ ARRAY › From Values

---

Under the Hood

📜 View Implementation Code

/**
 * Applies a callback function or extracts a property from each item in the array and returns a new array of results.
 *
 * @param {Array} data.src - The array of values to transform.
 * @param {Function|string} data.cbk - A function that receives each item and returns a transformed value, or a property name to extract.
 * @param {Function|string} [data.out] - Optional output handler: function to transform result or string with format.
 *
 * Direct-mode specific parameters:
 * @param {Function} [data.pre] - Optional pre-processor function to transform src before mapping.
 *
 * @returns {Array} A new array containing the results of applying the callback or extracted property values.
 *
 * @framework ggLowCodeGTMKit
 */
const getType = require('getType');

const mapArray = function(arr, callbackOrProperty) {
   if (getType(arr) !== 'array') {
       return [];
   }

   if (typeof callbackOrProperty === 'string') {
       const prop = callbackOrProperty;
       return arr.map(function(item) {
           return item != null ? item[prop] : undefined;
       });
   }

   if (typeof callbackOrProperty === 'function') {
       return arr.map(callbackOrProperty);
   }

   return [];
};
const safeFunction = fn => typeof fn === 'function' ? fn : x => x;
const out = safeFunction(data.out);
// ===============================================================================
// map - Direct mode
// ===============================================================================
const applyCast = (castFn, value) => safeFunction(castFn)(value);
const processedArray = applyCast(data.pre, data.src);
return out(mapArray(processedArray, data.cbk));
// ===============================================================================
// map(...) – Apply Mode
// ===============================================================================
/*
return function(value, callback) {
   callback = data.rp1 ? callback : data.cbk;
   return out(mapArray(value, callback));
};
*/

🧪 View Test Scenarios (9 tests)

✅ '[example] Multiply each by 2'
✅ Array of strings - convert to uppercase
✅ '[example] Extract property from objects'
✅ Array with index parameter - create indexed strings
✅ Empty array - should return empty array
✅ Non-array input - should return empty array
✅ Map with unmatch property string - should maintain array alignment
✅ Array of mixed types - transform to string lengths
✅ Map with property string