How to check for empty string in JavaScript – A detailed guide

by

In this tutorial, let’s check for an empty string in JavaScript. We’ll be looking at multiple method, starting from the simplest one.

Simplest method: Use an If Else statement to return a true or false

The simplest way to check if a JavaScript string is empty is by using an If Else statement, and a condition check.

Let’s start by creating an empty string. Empty strings are basically strings with nothing between the quotes, hence empty .

let str = '';

Now, the condition can just be the string. If the string is empty, the condition would return a false; otherwise, it’ll return a true.

So, if it returns true, which means the string does contain something, print ‘Not an empty string’. Else, print ‘Empty string’.

if(str) {
    console.log('Not an empty string');
}
else {
    console.log('Empty string');
}

Let’s run the program, and we’ll get:

JavaScript check for empty string

It works correctly. Great!

Null and undefined

There’s a problem with this method though. This doesn’t work on null or undefined. We’ll get back ‘Empty string’ for ‘null’ and ‘undefined’ values as well, which is not what we want at all! We only want to find an empty string, that is, a string with nothing, not even a space, between the quotes.

Let me show you what I mean by changing the value of str to ‘null’. 

let str = null;

Now the output would say ‘Empty string’ again. You can check it out for yourself.

We’d get the same response for when the variable is assigned undefined. 

let str = undefined;

Why is that? Don’t null and undefined also denote the lack of values? Of course! In essence, that’s true, and the above solution is all you’ll need if that’s all you’re looking for.

But we’re looking for strings here, so the type of the variable should be a string, but null and undefined are not the same as an empty string. Undefined denotes that we haven’t assigned anything to the variable yet, but that doesn’t necessarily mean that it’s a string. We could later assign a number, an array or an object to a previously ‘undefined’ variable.

The same goes for null. Let’s check the type of an empty string vs a null or undefined value, like below:

console.log(typeof '');
console.log(typeof null);
console.log(typeof undefined);

When we run the above lines of code, and we’ll get:

As you can see from the above output, we only need the first type, since that’s the only string in the list. We have no guarantee that a ‘null’ or an ‘undefined’ value can ever become a string.

So, we must specifically look for an empty string.

But, as you can see, if we go through an ‘if else’ statement, we’ll get false as far as the value of a variable is ‘nothing’.

Check if the typeof the variable is a string

So, to make sure that you end up with only empty strings, and no false positives that come from null or undefined value assignments, we can go further in our condition to check if the type of the variable is a string as well. 

if(!str && typeof str == 'string') {
    console.log('Empty string');
}

Now, run the program again, while reassigning null and undefined values to your variable as well, and you’ll only get ‘Empty string’ for an actual empty string.

Use the === operator

One of the easiest ways to check if a string is an empty string, and only that (not null or undefined), is by using the === operator. This operator only returns true if both side of the equation are equal in value as well as type.

So, if we ask for str === “”, we’ll only get a true if str also contains an empty string, and only that. Null and undefined values (even a 0 or a false Boolean value) will return a false because they’re not of type string, and any other string value will return a false because that’s not an empty string. 

let string = "";

console.log(string === '');
console.log(string === false);
console.log(string === undefined);
console.log(string === null);
console.log(string === 0);

Run the above lines of code, and you’ll see:

As you can see, anything other than an empty string returns a false, which is exactly what we need.

Check the length of the string

Another great way to check whether the string is empty is by verifying whether the length of the string is 0, which means the string has no characters in it to lend it an actual length. But you can’t just stop there. You need to check the type of the string as well, since the length property works for arrays as well.

But the good news here is that the length property doesn’t work on numbers, null or undefined values, so you’ll get an error if you try to parse these values through your condition. 

let string = "";

if(string.length == 0 && typeof string == 'string') {
    console.log('Empty string');
} 
else {
    console.log('Not an empty string');
}

Now, if we try assigning a null or undefined value to the string and look at the output, it’ll still say ‘Not an empty string’, as we want. 

let string = undefined;

That’s it! These are the different ways to check for an empty string in JavaScript.

Leave a Comment