Currently, I am facing a scenario where the object I'm analyzing is quite messy...
Essentially, within this object... my goal is to locate the pageviews node, but only if it has an array of data...
Here's an example of the data:
data = [
{
event: "click",
dimension: 123,
cart: {
pageviews:[]
}
},
{
event: "scroll",
dimension: 456,
cart: {
pageviews:[]
}
},
{
event: "onload",
dimension: 789,
},
{
event: "click",
dimension: 'xyz',
cart: {
pageviews:[
{data: 1},
{data: 2},
{data: 3},
]
}
}
];
There are three instances of "pageviews" within the object.
In the code snippet below, I aim to hide a specific DOM element if pageviews includes data in an array.
Despite my efforts, the DOM element does not hide, leading me to question its efficiency.
What is the most effective approach to accessing "pageviews" or executing a command only if the object contains pageviews with data?
let searchURL = new URLSearchParams(location.search);
if (searchURL.has("a" && "b" && "c"))
// Iterate through data obj to locate the desired object
for (let index = 0; index < data.length; index++) {
const dataNode = data[index];
// Verify if the looped node contains "cart"
if (dataNode.hasOwnProperty("cart")) {
// Confirm presence of "pageview" node
if (dataNode.cart.hasOwnProperty("pageview")) {
let resultsResponse = dataNode.cart.pageview;
if (resultsResponse.length >= 1) {
// HIDE DOM ELEMENT IF CONDITION IS MET
const bigBlockContainer = document.querySelector('.big-container');
bigBlockContainer.remove();
}
}
}
}
}