Where can we use this?You might find this useful when you want to execute a particular script if the array is empty - like enabling or disabling buttons based on if there is any input in the required field, etc.
However, if you are just looking for the code, you can quickly check out the section below.
Table of Contents
- Browser Support
- Other Related Concepts
Code ExplanationLet's breakdown this code step by step!
- First we check if a variable is an array using the Array.isArray() method.
- If the variable passed is an array then the condition !Array.isArray() will be False and so the variable will go to the else condition.
- If the variable passed is anything but an array such as, undefined or another variable type such as a string or object, the function will return False.
- Having confirmed that the variable is an array, now we can check the length of the array using the Array.length property.
- If the length of the object is 0, then the array is considered to be empty and the function will return TRUE.
- Else the array is not empty and the function will return False.
- We can see here that fruitArr is an array and hence passes into the second condition to check if the length of the array is empty.
- Since the array has 3 elements it is not empty and therefore the function returns False.
- In the second case, arrTwo, it is again an array and so passes into the second condition.
- Here, since the array is empty, the function returns True.
Why use the Array.isArray() method?The Array.isArray() method is a sure shot method to check if a variable is an array or not and it automatically eliminates the cases of null and undefined without writing an additional script to check for it.
The Array.isArray() method returns true for the following cases
Note: Array.prototype itself is an array so the function Array.isArray() returns TRUE.
The Array.isArray() returns False for the following cases
To illustrate this, consider for example:
Can we use instanceof instead of Array.isArray?While instanceof can be used for most cases in place Array.isArray , the Array.isArray is preferred over instanceof as it works through multiple contexts (such as frames or windows) correctly whereas instanceof does not.
Considering such cases, it is best to simply use Array.isArray, especially when creating a framework, library, or a plugin, where the environment in which it will be used is not known in advance.
Using the length propertyOnce we have made sure we are dealing only with an array, we can easily check if the array is empty or not using the length property. If the length of the array is 0, then the array is empty otherwise it is not empty.
One obvious question we might have is why not just use the length property at the beginning itself? Won't it make the code simpler?
True, but length property can return that the variable is empty even for non-array variables so we need to ensure that we are dealing with an array first before using the length property.
Browser SupportThe Array.isArray method has very good browser support as it is part of the ES5 specification. However, if the browsers you're targeting lack the support, you can use a polyfill for it which is given below.
The polyfill works well with browsers that are compatible with ES3 specifications and works across frames.