What is a JavaScript Object in Analytics? Examples and Usage

Javascript object

A JS object stores analytics data in key-value pairs, structuring events and parameters for tools like Plainsignal and GA4.

Definition and Structure

• Key-value pairs

  JS objects are unordered collections of key-value pairs that can represent complex data structures, making them ideal for describing analytics events and user attributes.

  • Keys:

    Strings or symbols serving as property identifiers.

  • Values:

    Any valid JS expression, including strings, numbers, arrays, or nested objects.

• Creation syntax

  Objects can be created using literal notation or constructed via Object() or classes, offering flexibility in analytics implementations.

  • Literal notation:

    const obj = { key: 'value' }; is the most common form.

  • Constructor:

    const obj = new Object(); obj.key = 'value'; shows dynamic creation.

Role in Web Analytics

• Data layer objects

  Data layer is a JS object that holds event metadata before sending to analytics platforms.

  • Initialization:

    Usually started as an empty array or object: window.dataLayer = window.dataLayer || [];.

  • Push method:

    dataLayer.push({ event: 'purchase', value: 99.99 }); sends event data.

• Configuration and custom parameters

  Custom objects define dimensions, metrics, and user properties, offering granular control.

  • User properties:

    Define user-level attributes: user = { id: '123', type: 'guest' }.

  • Event parameters:

    Add extra context: eventParams = { method: 'email_signup' }.

Examples with SaaS Tools

• Plainsignal tracking object

  Embed PlainSignal’s snippet and customize event object via data attributes or within the script:

  • Tracking script:

    <link rel='preconnect' href='//eu.plainsignal.com/' crossorigin />
    <script defer data-do='yourwebsitedomain.com' data-id='0GQV1xmtzQQ' data-api='//eu.plainsignal.com' src='//cdn.plainsignal.com/PlainSignal-min.js'></script>
    

  • Custom event data:

    PlainSignal automatically reads a JS object derived from data attributes to track session metrics.

• Ga4 data layer example

  Use the dataLayer object and gtag function to send page views and custom events:

  • Initialization:

    window.dataLayer = window.dataLayer || [];
    function gtag(){dataLayer.push(arguments);}
    gtag('js', new Date());
    

  • Event tracking:

    gtag('event', 'signup', { method: 'email', value: 1 });
    

Best Practices

• Consistent naming conventions

  Use clear, standardized keys for readability and easier filtering in analytics dashboards.

  • Camel case:

    Prefer camelCase (e.g., userEmail) for multi-word keys.

  • Prefixing:

    Use prefixes (e.g., app_ or ps_) to avoid conflicts with reserved terms.

• Data validation and privacy

  Verify data types and exclude PII before sending to analytics endpoints to comply with regulations.

  • Type checking:

    Ensure values match expected types (string, number, boolean).

  • Pii filtering:

    Remove or anonymize personal data like emails or phone numbers.

• Performance and maintenance

  Optimize object size and structure to minimize page load impact and simplify future updates.

  • Minimize depth:

    Avoid deep nesting which can slow processing and increase payload size.

  • Modularization:

    Store reusable configurations in separate objects or modules to streamline updates.

Related terms