Introduction

There is no single "empty string" check in JavaScript, because "", null, and undefined are different values. The right test depends on whether you want a quick falsy check, a strict string-only check, or a whitespace-aware check.

The Quick Falsy Check

If your variable should either be a non-empty string or "missing", the shortest test is:

if (!str) {
  // str is "", null, undefined, 0, false, or NaN
}

This is concise, but it is broad. It treats several non-string falsy values as empty too.

That means it is safe only when you already know str is either:

• a string
• 'null'
• 'undefined'

If 0 or false can appear, !str may be too aggressive.

Strict Check for Empty, null, or undefined

If you want to check only those three cases, be explicit:

if (str === "" || str === null || str === undefined) {
  // exactly empty string, null, or undefined
}

This avoids accidentally treating 0 or false as empty.

You can wrap that in a helper:

function isNullishOrEmptyString(value) {
  return value === "" || value === null || value === undefined;
}

Check for Whitespace-Only Strings

Sometimes " " should count as empty too. In that case, trim first:

1function isBlank(value) {
2  return value == null || (typeof value === "string" && value.trim() === "");
3}
4
5console.log(isBlank(undefined)); // true
6console.log(isBlank(null));      // true
7console.log(isBlank(""));        // true
8console.log(isBlank("   "));     // true
9console.log(isBlank("hello"));   // false

The value == null check is a deliberate shorthand that matches both null and undefined only.

Why typeof Matters

Calling .trim() on a non-string throws an error:

const value = 42;
value.trim(); // TypeError

That is why a safe helper usually guards with typeof value === "string" before trimming.

Different Use Cases Need Different Helpers

Here are three practical utilities:

1function isMissing(value) {
2  return value == null;
3}
4
5function isEmptyString(value) {
6  return value === "";
7}
8
9function isBlankString(value) {
10  return typeof value === "string" && value.trim() === "";
11}

And a combined version:

function isNullishOrBlank(value) {
  return value == null || (typeof value === "string" && value.trim() === "");
}

Choosing the right one makes your intent obvious to the next reader.

Use in Form Validation

This pattern is common in forms:

1function validateName(name) {
2  if (name == null || (typeof name === "string" && name.trim() === "")) {
3    return "Name is required";
4  }
5  return null;
6}

That accepts real text while rejecting missing and whitespace-only input.

Avoid Overusing Loose Equality

You may see this:

if (str == "") {
  // ...
}

That is usually less clear than a deliberate helper or explicit comparison. Loose equality can coerce values in surprising ways, so use it only when you actually want that behavior. The common exception is value == null, which is often intentionally used to mean "null or undefined".

Common Pitfalls

The biggest mistake is using !str when the variable might contain non-string falsy values such as 0 or false. That can turn a general falsy check into a buggy empty-string check.

Another issue is calling .trim() without verifying the type first. If the variable is not a string, the code throws rather than returning a clean boolean result.

Finally, be explicit about whether whitespace-only strings should count as empty. Different applications make different choices, and bugs often come from silently assuming the wrong rule.

Summary

• Use !str only when broad falsy behavior is acceptable.
• Use strict equality when you mean exactly "", null, or undefined.
• Use .trim() only when you want whitespace-only strings to count as empty.
• Guard trim() with a type check so non-string values do not throw.
• Write a small helper with a clear name so the intended rule is obvious.