Home > OS >  Filter array of objects gives back a TypeError but not in the console
Filter array of objects gives back a TypeError but not in the console

Time:07-01

I'm seeing a very weird behavior. Assuming I have this array:

const testObj = {
    requestId: '11429#1846b3',
    result: [
        {
            id: 244147,
            primaryAttributeValue:
                'WBN2022-06-21',
            attributes: [
                {
                    name: 'Client IP Address',
                    value: '190.0.247.226',
                },
                {
                    name: 'Query Parameters',
                    value: '',
                },
                {
                    name: 'Referrer URL',
                    value: 'https://engage-sj.marketo.com/',
                },
                {
                    name: 'Search Engine',
                    value: 'Facebook',
                },
                {
                    name: 'User Agent',
                    value: 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/102.0.0.0 Safari/537.36',
                },
                {
                    name: 'Webpage URL',
                    value: '/WBN2022-06-2120MinuteSpotlightTaxesandIULInnovation_LP-Register.html',
                },
            ],
        },
        {
            id: 287285084,
            primaryAttributeValue:
                'OP-Subscription-Center_LP-Preferred-Subscription',
            attributes: [
                {
                    name: 'Client IP Address',
                    value: '190.0.247.226',
                },
                {
                    name: 'Query Parameters',
                    value: 'mkt_unsubscribe=1&mkt_tok=NjQ1LUhOVi01ODYAAAGFBlSC_41r5x-DLcGyIW5yZY41L__lGkySacq8SLo9g1M4C9FLhg9xmhdM3ym47_9uXb1UlLqsEaT_gf37t7tlc6J_bFcYXZPK7vQYBaUg3tujAqeCIMo',
                },
                {
                    name: 'Referrer URL',
                    value: 'https://em.xxx.net/',
                },
                {
                    name: 'Search Engine',
                    value: 'Facebook',
                },
                {
                    name: 'User Agent',
                    value: 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/102.0.0.0 Safari/537.36',
                },
                {
                    name: 'Webpage URL',
                    value: '/OP-Subscription-Center_LP-Preferred-Subscription.html',
                },
                {
                    name: 'Campaign',
                    value: 'Program-1660-exploration-campaign',
                },
            ],
        },
        {
            id: 287285096,
            marketoGUID: '287285096',
            primaryAttributeValue:
                'OP-Subscription-Center_LP-Preferred-Subscription',
            attributes: [
                {
                    name: 'Client IP Address',
                    value: '190.0.247.226',
                },
                {
                    name: 'Query Parameters',
                    value: 'mkt_unsubscribe=1&mkt_tok=NjQ1LUhOVi01ODYAAAGFBlSC_0UgUEvYSwArmRkrlgFMrfuVXoEM0nMxc71YNTJLZCy22mGsYng-aB9oskEevXbCyUPuGjxE7WtBK5RdEqZFKTq3VBuSH0S3zsUB1lFqeGub_fM',
                },
                {
                    name: 'Referrer URL',
                    value: 'https://em.xxx.net/',
                },
                {
                    name: 'Search Engine',
                    value: 'Facebook',
                },
                {
                    name: 'User Agent',
                    value: 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/102.0.0.0 Safari/537.36',
                },
                {
                    name: 'Webpage URL',
                    value: '/OP-Subscription-Center_LP-Preferred-Subscription.html',
                },
                {
                    name: 'Campaign',
                    value: 'Program-1660-exploration-campaign',
                },
            ],
        }
]

I would like to filter by attribute number 5 (Webpage URL), this means attributes[5]. I do the following:

testObj.result.filter((elem) => {
            console.log('ELEM', elem.attributes[5].value)
            return (
                elem.attributes[5].value ===
                '/OP-Subscription-Center_LP-Preferred-Subscription.html'
            )
        })

When I console.log('ELEM', elem.attributes[5].value) I get the value in the console. But I get an error:

Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'value')

What is going on here? When I add the value prop to the attributes it complains about a type error??? It looks like a dumb question but I've been trying to solve it for some time now. Thanks in advance!

CodePudding user response:

Try to add a validation before accessing value attribute.

testObj.result.filter((elem) => {
            if(elem.attributes[5] === undefined) {
                console.log('ELEM', 'undefined')
                return false
            }
            console.log('ELEM', elem.attributes[5].value)
            return (
                elem.attributes[5].value ===
                '/OP-Subscription-Center_LP-Preferred-Subscription.html'
            )
        })
  • Related