JavaScript filter not working properly in my NUXT app

Question

I have an array of objects that is gotten from an API, and I would like to filter out one of them based on the _id field. the problem is instead of filtering out the one that has the same _id it filters out everything instead.

Below is my code -- I also console.log each step so we can see what is happenning

in my NUXTJS method

        removeSingleImage(imageObjId) {
            this.$axios.delete(`/photo/${imageObjId}`)
            .then(result => {
                const olduploaded = this.uploaded
                console.log(olduploaded);
                const newUploaded = olduploaded.filter((item) => {
                    console.log("item._id", item._id);
                    console.log("imageObjId", imageObjId);
                    item._id !== imageObjId
                })
                this.uploaded = newUploaded
                console.log(newUploaded);
            })
            .catch(e => {
                console.log(e);
            })
        }

when this code console.log(olduploaded); runs, in the console I get the expected array as shown below

[
                {
                    "_id":"60de4a29e2c2850015c4dd78",
                    "location":"https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSuIbd-D80_YPHKNJnLFuO2bHqk5NfNIna7ZQ&usqp=CAU",
                    "owner":"60dce43551e7df0015bd0b65",
                    "place":"60de48e3e2c2850015c4dd75",
                    "createdAt":"2021-07-01T23:05:13.264Z",
                    "updatedAt":"2021-07-01T23:05:13.264Z",
                    "__v":0},
                {
                    "_id":"60e3ad33804ed4001542ad7b",
                    "location":"https://images.unsplash.com/photo-1472224371017-08207f84aaae?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1050&q=80",
                    "owner":"60dce43551e7df0015bd0b65",
                    "place":"60de48e3e2c2850015c4dd75",
                    "createdAt":"2021-07-06T01:09:07.716Z",
                    "updatedAt":"2021-07-06T01:09:07.716Z",
                    "__v":0},
                {
                    "_id":"60faa55763da2f0015c19941","key":"photos/QtIQk0WanlWsaeB8w6agYSaHKnUuUb.webp",
                    "location":"https://lookaam.s3-eu-west-2.amazonaws.com/photos/QtIQk0WanlWsaeB8w6agYSaHKnUuUb.webp",
                    "owner":"60dce43551e7df0015bd0b65",
                    "place":"60de48e3e2c2850015c4dd75",
                    "createdAt":"2021-07-23T11:17:43.359Z",
                    "updatedAt":"2021-07-23T11:17:43.359Z",
                    "__v":0},
                {
                    "_id":"60faa55863da2f0015c19942","key":"photos/MnacW4UFUWa0kyVjOX5cPBZxYBGLCs.webp",
                    "location":"https://lookaam.s3-eu-west-2.amazonaws.com/photos/MnacW4UFUWa0kyVjOX5cPBZxYBGLCs.webp",
                    "owner":"60dce43551e7df0015bd0b65",
                    "place":"60de48e3e2c2850015c4dd75",
                    "createdAt":"2021-07-23T11:17:44.005Z",
                    "updatedAt":"2021-07-23T11:17:44.005Z",
                    "__v":0}
]

when i console.log("item._id", item._id); and console.log("imageObjId", imageObjId); for each item, i get

item._id 60de4a29e2c2850015c4dd78
imageObjId 60faa55863da2f0015c19942
item._id 60e3ad33804ed4001542ad7b
imageObjId 60faa55863da2f0015c19942
item._id 60faa55763da2f0015c19941
imageObjId 60faa55863da2f0015c19942
item._id 60faa55863da2f0015c19942
imageObjId 60faa55863da2f0015c19942

and as we can see the last item._id and imageObjId are the same and should be filtered out, but what I get instead when I filter them out and run console.log(newUploaded) is an empty array

[]

Answer 1

You're missing the return inside the filter callback :

            const newUploaded = olduploaded.filter((item) => {
                console.log("item._id", item._id);
                console.log("imageObjId", imageObjId);
                return item._id !== imageObjId
                //🔺
            })