Vue js not equal operator

Vue Js Check if value is not equal to another value in the array:The not equal operator in Vue.js is represented by the "!==" symbol. It's a comparison operator that compares two values or expressions and returns true if they are not equal. Otherwise, it returns false. This operator can be used to perform conditional logic, such as checking if two values are not equal before executing a certain block of code. It is important to note that the not equal operator does not perform type coercion, meaning that it compares values without converting their data types. Therefore, the values being compared must be of the same data type for the comparison to be accurate.

written

reviewed

updated

How can you check in Vue js whether a certain value is not equal to another value?

The Below code is filtering the items array based on the excludedCategory value. It is using the computed property to filter the items array and return a new array with the items that do not have the excluded category.

In this case, the filteredItems computed property is checking if the category of each item in the items array is not equal to the excludedCategory. If it is not equal, the item will be included in the new array returned by the filteredItems computed property.

Vue Js Check if value is not equal to another value in the array Example

<script type="module">
        const app = Vue.createApp({
            data() {
                return {
                    items: [
                        { id: 1, name: 'Apple', category: 'fruit' },
                        { id: 2, name: 'Banana', category: 'fruit' },
                        { id: 3, name: 'Carrot', category: 'vegetable' },
                        { id: 4, name: 'Doughnut', category: 'dessert' },
                        { id: 5, name: 'Egg', category: 'protein' }
                    ],
                    excludedCategory: 'fruit'
                }
            },
            computed: {
                filteredItems() {
                    return this.items.filter(item => item.category !== this.excludedCategory);
                }
            }
        })app.mount('#app')
    </script>

Run

Output of Vue Js Check if value is not equal to another value in the array

If you want to check if a value is not equal to any value in another array, you can use the `Array.includes()` method in the filter function.

The Array.includes() method can be used to check if a value is present in an array or not. In this case, it's being used with the negation operator (!) to check if an item's category is not present in the excludedCategories array.

The filter() method creates a new array with all elements that pass the test implemented by the provided function. In this case, the test is checking whether the category of each item is not included in the excludedCategories array. So, the resulting filteredItems array will only contain items whose categories are not in the excludedCategories array.

Overall, this code is a valid way to filter an array based on whether a value is not equal to any value in another array.