Update multiple product values with one dataLayer.push-CodePudding

Say I have the following dataLayer:

{
  ecommerce: {
    currencyCode: "USD",
    purchase: {
      actionField: {
        id: "1a6d5021",
        affiliation: "Online Store",
        revenue: 40,
        tax: 0,
        shipping: "",
        coupon: ""
      },
      products: [
        {
          name: "Product 1",
          id: "123",
          price: 40,
          category: null,
          quantity: 1,
          coupon: "disc10",
          type: "Service A"
        },
        {
          name: "Product 4",
          id: "456",
          price: 40,
          category: null,
          quantity: 1,
          coupon: "disc10",
          type: "Service B"
        }
      ]
    }
  }
}

So in the product array, category always has value null. How can I push the same value as type respectively for each product, whilst leaving everything else in the dataLayer untouched?

Ultimately the final result that I am trying to achieve would be like this:

{
  ecommerce: {
    currencyCode: "USD",
    purchase: {
      actionField: {
        id: "1a6d5021",
        affiliation: "Online Store",
        revenue: 40,
        tax: 0,
        shipping: "",
        coupon: ""
      },
      products: [
        {
          name: "Product 1",
          id: "123",
          price: 40,
          category: "Service A",
          quantity: 1,
          coupon: "disc10",
          type: "Service A"
        },
        {
          name: "Product 4",
          id: "456",
          price: 40,
          category: "Service B",
          quantity: 1,
          coupon: "disc10",
          type: "Service B"
        }
      ]
    }
  }
}

It be easy with a single product, but I quite can't find how to do it when multiple products.

Thanks in advance for your help.

CodePudding user response：

There are two options.

Push the whole ecommerce object again, with all fields set now. It results in a bit of a mess in DL and certain timing issues one has to keep in mind when implementing tracking.
Remove/delay the first ecommerce push till you have all info and only push the ecommerce object once.

In most cases, 2 is the best option. 1 can be justified when the event relying on the ecommerce object has to fire before categories become available to the front-end.

CodePudding user response：

Try

function createCategoryFn(category) {
  
  return (properties) => {
    return {
     name: "",
     id: "",
     price: 0,
     category: category,
     quantity: 1,
     coupon: "",
     type: category,
     ...properties
    };
  };      
}

const createSportsProduct = createCategoryFn('Sports');

const tennisProduct = createSportsProduct({ name: 'tennis racket', id: 1, price: 100 });
const basketballProduct = createSportsProduct({ name: 'basketball', id: 2, price: 100 });

console.log(tennisProduct);
console.log(basketballProduct)