Javascript Array Every Method

Sometimes with arrays, we want to test every element for a certain condition. While individual conditions can be tested easily with an if statement, it becomes a little trickier with multiple array elements. As such, Javascript provides a method on arr…


This content originally appeared on DEV Community 👩‍💻👨‍💻 and was authored by Johnny Simpson

Sometimes with arrays, we want to test every element for a certain condition. While individual conditions can be tested easily with an if statement, it becomes a little trickier with multiple array elements. As such, Javascript provides a method on arrays called every which will test every element for a specific test. If all pass the test, the overall every method will pass true. If one or more fail the test, then the overall every method will return false.

Checking every element of an array for a test

Suppose we have an array where we want to test if every number is above 15. This is a perfect place to use every. Let's take a look.

let arr = [ 25, 35, 45, 55, 65 ];
let check = arr.every((el, index, array) => {
    return el > 15
});

console.log(check); // true

every takes a function like in the form (el, index, array) => ....

  • el is the current element being iterated through by every.
  • index is the index of the current element being iterated through by the array.
  • array is the full array being iterated upon. Here it would be [ 25, 35, 45, 55, 65 ].

Since arrow functions will return true if on one line without a return statement, the above code can be simplified to this, too:


let arr = [ 25, 35, 45, 55, 65 ];
let check = arr.every((el, index, array) => el > 15);

console.log(check); // true

As well, the every method can take another form where it accepts a callback function's name, along with a custom value for this. That means you can create a function, and then prep its content based on a custom this within the function itself. For example, below I pass {value: 15} into this, allowing us to change this value should we want to for other times when we call every:

let callbackFn = function(el) {
    if(this.value !== undefined) {
        return el > this.value
    }
    return false;
}

let arr = [ 25, 35, 45, 55, 65 ];
let check = arr.every(callbackFn, { value: 15 }); // Returns true

Modifying an array with the every method

Much like other array methods, Javascript does allow modification of the array within a method called upon it. For example, we could modify each element of our array and then do a check upon it. Since every is essentially a type of loop, each element is looped over sequentially:

let arr = [ 25, 35, 45, 55, 65 ];
let check = arr.every((el, index, array) => {
    arr[index] -= 100;
    return el > 5
});

// This is true, since we subtracted 100 from each element before the check
console.log(check); // true

We can even delete elements from an array in the every loop:

let arr = [ 25, 35, 45, 55, 65 ];
let check = arr.every((el, index, array) => {
    arr.pop();
    return el > 15;
});

console.log(arr); // returns [ 25, 35 ]

Javascript even lets you add elements to an array in every. Since every fires only once for each element in an array, it cannot lead to an infinite loop by simply pushing elements to the original array:

let arr = [ 25, 35, 45, 55, 65 ];
let check = arr.every((el, index, array) => {
    arr.push(100);
    return el > 15;
});

// This is true, since we subtracted 100 from each element before the check
console.log(arr); // returns [25, 35, 45, 55, 65, 100, 100, 100, 100, 100]
console.log(check); // returns true

Conclusion

The every method is a built in way to do logical tests on entire arrays. You should be careful with this on large arrays as it may lead to performance problems. In most cases, though, it's a really useful tool to add to your array arsenal. There are many other use cases where every is very useful. For example, you can also use every for other use cases, like checking if an array is a subset of another array.


This content originally appeared on DEV Community 👩‍💻👨‍💻 and was authored by Johnny Simpson


Print Share Comment Cite Upload Translate Updates
APA

Johnny Simpson | Sciencx (2022-11-13T18:29:46+00:00) Javascript Array Every Method. Retrieved from https://www.scien.cx/2022/11/13/javascript-array-every-method/

MLA
" » Javascript Array Every Method." Johnny Simpson | Sciencx - Sunday November 13, 2022, https://www.scien.cx/2022/11/13/javascript-array-every-method/
HARVARD
Johnny Simpson | Sciencx Sunday November 13, 2022 » Javascript Array Every Method., viewed ,<https://www.scien.cx/2022/11/13/javascript-array-every-method/>
VANCOUVER
Johnny Simpson | Sciencx - » Javascript Array Every Method. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2022/11/13/javascript-array-every-method/
CHICAGO
" » Javascript Array Every Method." Johnny Simpson | Sciencx - Accessed . https://www.scien.cx/2022/11/13/javascript-array-every-method/
IEEE
" » Javascript Array Every Method." Johnny Simpson | Sciencx [Online]. Available: https://www.scien.cx/2022/11/13/javascript-array-every-method/. [Accessed: ]
rf:citation
» Javascript Array Every Method | Johnny Simpson | Sciencx | https://www.scien.cx/2022/11/13/javascript-array-every-method/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.