Table of Contents
Javascript arrays are one of the interesting data structures we get to work with, I like JS arrays mostly because they allow multiple types of elements to be grouped together, this brings its own issues too. Nevertheless, JS arrays are almost part of our everyday job and there are some things that we do more often than other things, I tried to list out few items that I needed to do more when working with arrays in this post.
How to check if a given variable is an Array?
In Javascript, all arrays are objects with some extra methods added to the object prototype, so when you try to use the type of on an array it’ll return “Object”. You can use the length property but there is a better way to check if the given variable is an array or not.
const names = ["Agira", "Technolgoies"]; console.log(Array.isArray(names)); // true const age = 7; console.log(Array.isArray(age)); // false
How to delete elements from an Array?
When we want to delete an element from an array there are multiple techniques such as using the delete operator with the index of the array or filtering the array and creating a new array omitting the thing we want to delete. But my favorite is the splice method, it is far easier than the other two and works in most situations really well.
const str = ['Agira', 'Technologies', 'Chennai', 'COVID-19']; str.splice(3, 1); console.log(str); // Output: > Array ["Agira", "Technologies", "Chennai"]
How to Remove duplicates from an Array?
Removing duplicates from an array is something that we often want to do. But this is where things get little interesting in terms of performance, there are a lot of methods to do that, I’ll list a few of my favorites here.
Using Array.filter and indexOf
const str = new Array(5).fill('a');
const unique = str.filter((item, pos) => {
return str.indexOf(item) === pos;
});
console.log(unique);
// Output: > Array ["a"]
Using Set() and spread syntax
const str = new Array(5).fill('a');
// the above will create an array with 5 ‘a’ s
const unique = [...new Set(str)];
console.log(unique);
Output: > Array ["a"]
Both methods will produce the same result but this is not the best way to do it in terms of performance, there are times when you want to squeeze every bit of performance and at that time you should try to use a better version. But I prefer the readability of the above two for any normal use cases.
How to Empty an array?
Emptying an array is not something you would do every day but there are some use cases when you want to clean the slate after you’ve made something. Like many other things in programming, there are a lot of ways to do this but I prefer this simple one-liner over the other methods.
const str = new Array(5).fill('a');
str.length = 0;
console.log(str);
// Output: > Array []
The length property in an array is both read and write so the above code is valid even in strict mode.
ALSO READ: How To Build A Dating App Like Tinder
How to merge two arrays into one?
Merging arrays in Javascript is super easy, by using the concat method we can just do it like this.
const str = new Array(3).fill('a');
const str1 = new Array(3).fill('b');
const merged = str.concat(str1);
console.log(merged);
// Output: > Array ["a", "a", "a", "b", "b", "b"]
The hard part is to merge the array without the duplicates, for that we can use the same technique we used for the deduplication of arrays.
const str = new Array(3).fill('a');
const str1 = new Array(3).fill('b');
const unique = [...new Set(str), ...new Set(str1)];
console.log(unique);
// Output: > Array ["a", "b"]
How to Remove falsy values from an Array?
Sometimes our arrays will have some falsy values such as null, undefined or just false in them and it will be a headache to check for the truthiness of each element before actually trying to use that element in our code. So we might want to remove the elements which are falsy in nature and this is how it should be done.
const str = ['a', null, false, 'b', undefined]; const str1 = str.filter(Boolean) console.log(str1); // Output: > Array ["a", "b"]
How to reverse an Array?
Reversing an array in JS is really simple with the standard array method. Like below
const str = ['a', 'b', 'c', 'd', 'e']; console.log(str.reverse()); // Output: > Array ["e", "d", "c", "b", "a"]
But there was an interview question to me that asked to reverse the array without using the reverse() method. Here is how we can do it,
const str = ['a', 'b', 'c', 'd', 'e'];
const str1 = [];
for (let i = str.length - 1; i >= 0; i--) {
str1.push(str[i]);
}
console.log(str1);
// Output: > Array ["e", "d", "c", "b", "a"]
How to check if all elements in an array pass a condition?
Trick 8 and 9 are required more often than we can imagine. When we are working with an array of objects and need to check if all the objects have some common key or not can be done very easily with this method.
const num = [2,4,5]; const isOdd = num.every(item => item % 2 === 0); console.log(isOdd);
The predicate function we use here is the key, we can check for any condition within the predicate and the every() will be truthy if all the items in an array passed the test.
ALSO READ: How To Develop A Healthcare Mobile Application For Hospitals
How to check if at least one element in an array pass a condition?
This is as same as every() but one difference is that this will return true even if at least one value in the array passed the predicate.
const age = [12,14,11,10,21]; const isThereAnAdult = age.some(item => item > 18); console.log(isThereAnAdult);
These are all the array tricks I found useful in day to day development. If you have a trick or have a question about Javascript or about arrays, feel free to drop a comment.
Do you find it interesting? you might also like these articles. Top 10 Best Tech Companies For Employees To Work In The USA In 2020 and Top 10 IT Staffing and Recruiting Agencies in the USA.
If you have a business idea in your mind and in search of a reliable web development company, you are in the right place. Hire the best Javascript developers in the industry from Agira technologies.
