Published on

Every Programmer Should Be Aware of These 10 JavaScript Hacks

featured Image

JavaScript is a tremendously powerful language, yet it may be difficult to understand its behaviour. Today, I'll show you some tricks for making your JavaScript code more efficient. It will also assist you in writing clean code and reducing programming time.

1. Use array to resize or empty an array.length

When we wish to enlarge an array, we just overwrite the length of the array:

let array = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j'];

console.log(array.length); // returns the length as 10

array.length = 4;

console.log(array.length); // returns the length as 4
console.log(array); // returns ['a', 'b', 'c', 'd']

2. Flatten the multidimensional array

The spread operator can be used to flatten a multidimensional array.

var entries = [1, [2, 5], [6, 7], 9];
var flat_entries = [].concat(...entries); 
// [1, 2, 5, 6, 7, 9]

3. Obtaining the array's last item

Another clever trick is to use a negative number as the parameter to extract the final entry from the array.

var array = [1, 2, 3, 4, 5, 6]; 
console.log(array.slice(-1)); // [6] 
console.log(array.slice(-2)); // [5,6] 
console.log(array.slice(-3)); // [4,5,6]

4. Swap two variables without swapping the third.

Using the third variable, we can simply swap two variables. Using an extra variable, however, necessitates the use of more memory. We may also optimise memory with simply two variables.

let x = 1;
let y = 2;
[x, y] = [y, x]; // x = 2, y = 1

5. Memory-optimized merging of two arrays

If we need to combine two arrays, we may use the array.concat() function to accomplish it quickly.

var array1 = [1, 2, 3]; 
var array2 = [4, 5, 6]; 
console.log(array1.concat(array2)); // [1,2,3,4,5,6]; 

For tiny arrays, this is the best option. However, if we need to combine big arrays, this method is ineffective. Why is this the case? The reason for this is that when using the array.concat() method on huge arrays, the resultant merged array will require a lot of memory.

In this case, the array.push.apply(array1, array2) function may be used to merge the second array into the first, eliminating the need for additional memory. We can cut down on memory use this way.

var array1 = [1, 2, 3]; 
var array2 = [4, 5, 6]; 
console.log(array1.push.apply(array1, array2)); // [1,2,3,4,5,6];

6. Use splice instead of delete.

This might be the most efficient way to optimise JavaScript code. It also improves the speed of your code. What's the harm in using delete? Because it just deletes the object property without reindexing or updating the array's length, it leaves undefined values. In essence, it takes a significant amount of time to complete.

Splicing instead of deleting is a smart practise since it eliminates null/undefined space from your code.

Array = ["a", "b", "c", "d"] 
Array.splice(0, 2) ["a", "b"]

Result: myArray ["c", "d"]

7. Instead of if/else, we should use a switch...case.

The switch...case is consistently underappreciated. Although switch...case and if/else accomplish almost identical tasks, the switch...case statement executes quicker than the if/else statement! What is the reason behind this? In the if/else statement, you must compare on average to reach the proper clause; however, the switch statement is essentially a lookup table with known alternatives.

8. As soon as feasible, break the loop.

Look for situations when completing every iteration in a loop isn't essential. For example, if we are looking for a specific value and discover it, we will not need to repeat the process. As a result, we need use a break statement to end the loop's execution:

9. Minimize the risk of memory leaks

In JavaScript, memory management is crucial. If you don't manage memory effectively, memory leaks will occur, causing your software to crash. A memory leak can occur for a variety of reasons. Some of the reasons include: unintentionally utilising global variables, forgetting about timers or callbacks, unneeded caching, and so on.

10. Recognize the Big O notation

This is a really important but underappreciated issue. If you grasp the Big O notation, you'll be able to see why some of your functions run quicker and others take up less memory. So, before getting into frameworks and other sophisticated topics, master this essential concept. Thank you for taking the time to read this. If you found this helpful, please give it a clap. Don't forget to contribute your JavaScript knowledge in the comments section.