21 JavaScript Tips and Tricks for JavaScript Developers

If you are doing lot of JavaScript programming, you might find below list of code snippets very useful. Keep it handy (bookmark it) and save it for future reference.

Here are 20 very useful JavaScript tips and tricks for you.

Disclaimer: Not all these snippet are written by me. Some of them are collected from other sources on Internet.

1. Converting JavaScript Array to CSV

First one goes like this. You have a javascript array of strings (or numbers) and you want to convert it to comma separated values (csv). We’ll below is the code snippet:
Reference: Array to CSV in JavaScript

The join() method will convert the array into a pipe separated string.

2. Convert CSV to Array in JavaScript

Now what if you want to convert a comma seprated string into a JavaScript array? We’ll there is a method for that too. You can use split() method to split a string using any token (for instance comma) and create an array.

3. Remove Array element by Index

You have an array. You want to remove a perticular element from array based on its index. We’ll you can do so using splice() method. This method can add as well as removes element from an array. We will stick to its removal usage.
Reference: Remove element by array index

5. Calling JavaScript function from String

Sometime you want to call a Javascript method at runtime whos name you know. Let say there is a method “foo()” which you want to call at runtime. Below is a small JS snippet that helps you calling a method just by its name.

var strFun = "someFunction"; //Name of the function to be called
var strParam = "this is the parameter"; //Parameters to be passed in function
//Create the function
var fn = window[strFun];
//Call the function
fn(strParam);

6. Generate Random number from 1 to N

Below little snippet helps you in generating random number between 1 to N. Might come handy for your next JS game.

7. Capture browser close button event or exiting the page in JavaScript

This is a common use case. You want to capture the browsers close event so that you can alert user if there is any unsaved data on webpage that should be saved. Below javascript snippet will help you in that.

8. Warn user if Back is pressed

This is same as above. Difference is instead of capturing close event here we capture back button event. So that we know if user is moving awaw from this webpage.
Reference: Capture Browser Back Button

9. Check if Form is Dirty

A common usecase. You need to check if user changed anything in an HTML form. Below function formIsDirty returns a boolean value true or false depending on weather user modified something within the form.

10. Disable Back button using JavaScript

This one is tricky. You want to disable the browsers back button (Dont ask me why!!). Below code snippet will let you do this. The only catch here is that you need to put this code in page where you dont want user to come back. See below reference for more details.
Reference: Disable Browsers Back Button

11. Deleting Multiple Values From Listbox in JavaScript

You have a SELECT box. User can select multiple OPTIONS from this SELECT box and remove them. Below Javascript function selectBoxRemove let you do this. Just pass ID of SELECT object you want to remove OPTIONS in.

12. Listbox Select All/Deselect All using JavaScript

You can use below JS snippet to select/deselect all the OPTIONS from a SELECT box. Just pass the ID of select box you want to perform this operation on and also a boolean value isSelect specifying what operation you want to perform.
Reference: Select All/None using Javascript

13. Listbox Move selected items Up / Down

This one is useful if you are playing a lot with multi options select box in your application. This function let you move select OPTIONS in a SELECT box to UP or DOWN. See below reference for more details.
Reference: Move Up/Down Selected Items in a Listbox

8 Comments

While a “comma-separated” output indeed means the values are output separated by commas it is not a sufficient definition. You must properly handle quoting if the values being output contain (or could possibly contain) a comma as part of their value and for quoted field embedded quotes have to be properly escaped as well.

Using the “pipe” symbol doesn’t cause this need to be ignored but rather significantly reduces the likelihood that you can get away being lazy – since seldom does output contain ” | “.