concatenateValues — GTM Variable Template for String

VARIABLES › STRING

concatenateValues CORE String

Direct (.tpl) Apply (.tpl)

Concatenates multiple values or arrays into a single array.

---

When to Use This

Type Conversion

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

---

Examples

Concatenate with separator▶ Try

INPUT

Values to Concatenate: [{val: 'apple'}, {val: 'banana'}, {val: 'orange'}]
Separator (use {{space}} for space, blank for no separator): ,

OUTPUT

apple,banana,orange

Mixed types concatenation▶ Try

INPUT

Values to Concatenate: [{val: 1}, {val: 2.5}, {val: 'three'}, {val: true}, {val: 0}]
Separator (use {{space}} for space, blank for no separator): |

OUTPUT

1|2.5|three|true|0

---

GTM Configuration

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

concatenateValues

Read-Only Try Live

Values to Concatenate

💾 List of values to concatenate. Each row represents one value.

Supported formats:
  ✓ String
  ✓ Number
  ✓ Boolean
  ✓ Variable reference

*** Concatenate with separator***

*** Mixed types concatenation***

⊖

Add Row

Separator (use {{space}} for space, blank for no separator)

💾 The separator string to place between concatenated values.

Special encoding: Use {{space}} to represent a space character (spaces are trimmed in GTM fields).

Supported formats:
  ✓ String (use {{space}} for space)
  ✓ Empty string (no separator)

Input Setup

Input Function (optional)

⚙️ Optional pre-processing function applied to the extracted values array before concatenation (e.g., filter empty values, transform array). Note: Values are extracted from the table's val property before this function is applied.

Result Handling

Output Function (optional)

⚙️ Optional function to apply to the concatenated result before returning it (e.g., str => str.toUpperCase(), str => str.trim()). Useful for chaining transformations on the output.

Values to Concatenate list

✕

✕

✕

+ Add Row

Separator (use {{space}} for space, blank for no separator) string

🔗 Result Handling — Chain Variables

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

concatenateValues()

+ Chain another variable

---

Related Variables

Same category: String

→ assignParamsToString → charAt → countWordsInString → endsWith → extract → extractFirstSegment → extractNumber → fromBase64 → indexOf → left → matchAll → matchRegex → omitParamsFromString → padEnd → padStart → pickParamsFromString → replaceAll → replaceAllWithRegex → replaceFirst → right → safeSplit → sanitizeTextAndRemoveHtml → sanitizeTextLite → search → slice → split → startsWith → test → toBase64 → toCamelCase → toJsonString → toKebabCase → toLocaleLowerCase → toLocaleUpperCase → toLowerCase → toNumber → toSnakeCase → toStartCase → toString → toStringRepresentation → toUpperCase → toUpperFirst → trim → trimEnd → trimStart → truncate

---

Under the Hood

📜 View Implementation Code

/**
 * Concatenates the values in an array, with an optional separator.
 * 
 * @param {Array} data.src - An array of objects (Direct mode) or values (Apply mode) to concatenate.
 * @param {string} data.sep - The separator string to use (use {{space}} for spaces).
 * @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 processing.
 * 
 * @returns {string} The concatenated string of values, separated by the provided separator.
 *
 * @framework ggLowCodeGTMKit
 */
const toString = (value) => (value == null ? '' : value.toString());

const concatenateValues = function(valueArray, separator) {
    const values = valueArray || [];
    return values.map(val => toString(val)).join(separator);
};
const safeFunction = fn => typeof fn === 'function' ? fn : x => x;
const out = safeFunction(data.out);
// ===============================================================================
// concatenateValues - Direct mode
// ===============================================================================
const extractItemValues = (items) => items.map(item => item ? item.val : null);
const applyCast = (castFn, value) => safeFunction(castFn)(value);
const extractedValues = extractItemValues(data.src);
const value = applyCast(data.pre, extractedValues);
return out(concatenateValues(value, data.sep));
// ===============================================================================
// concatenateValues(...) – Apply Mode
// ===============================================================================
/*
return function(value, separator) {
   return out(concatenateValues(value, data.sep));
};
*/

🧪 View Test Scenarios (5 tests)

✅ '[example] Concatenate with separator'
✅ Test concatenation with space separator
✅ Test with empty array
✅ Test with null and undefined values in array
✅ '[example] Mixed types concatenation'