How to fix Argument of type 'null' is not assignable to parameter of type 'string' in TypeScript

TypeScriptBEGINNERMEDIUMUpdated Dec 8, 2025ยท 206 views

This TypeScript error occurs when you try to pass a null value to a function that expects a string parameter. Caused by strictNullChecks in TypeScript, this error prevents potential runtime errors by catching type mismatches at compile time. The fix involves either explicitly allowing null in the function signature, using null checks before passing arguments, or providing default values.

Quick fix

Fixes Argument of type 'null' is not assignable to parameter of type 'string'

// WRONG - function cannot handle null
function greetUser(name: string): void {
  console.log(`Hello, ${name}`);
}

const userName = getUserName(); // might be null
greetUser(userName); // TS2345 error

// CORRECT - function accepts string or null
function greetUser(name: string | null): void {
  if (name === null) {
    console.log("Hello, anonymous user");
  } else {
    console.log(`Hello, ${name}`);
  }
}

const userName = getUserName(); // might be null
greetUser(userName); // OK
  1. Identify where the null value comes from
  2. Update the function signature to accept null
  3. Use a null check before calling the function
  4. Use the nullish coalescing operator (??)
typescript โ€” error
// WRONG - function cannot handle null
function greetUser(name: string): void {
console.log(`Hello, ${name}`);
}
const userName = getUserName(); // might be null
greetUser(userName); // TS2345 error
// CORRECT - function accepts string or null
function greetUser(name: string | null): void {
if (name === null) {
console.log("Hello, anonymous user");
} else {
console.log(`Hello, ${name}`);
}
}
const userName = getUserName(); // might be null
greetUser(userName); // OK
Argument of type 'null' is not assignable to parameter of type 'string'

What this error means

TypeScript's strictNullChecks feature treats null and undefined as distinct types that must be explicitly handled. When a function parameter is typed as string, TypeScript only allows actual string values to be passed. If your variable might be null, passing it directly to such a function violates TypeScript's type contract. This error is intentional: it forces you to think about what happens when null is encountered, preventing potential runtime errors where code assumes it has a string but actually receives null.

Typical symptoms

  • Compiler error with code TS2345 or TS2322 when building your TypeScript project
  • Error appears on the line where you call a function with a possibly-null argument
  • The error message shows the parameter type expected (e.g., string) but the argument is null
  • IDE shows red underline on the function call with the same error message
  • Code compiles and runs fine if strictNullChecks is disabled in tsconfig.json, but the underlying null-handling issue remains

Common causes

  1. Passing a variable of type string | null to a function that only accepts string
  2. Getting a value from DOM APIs (like querySelector, getAttribute) that return null if not found, then passing it directly to a function expecting string
  3. Function parameter is typed as string but callers may pass null values
  4. Using optional properties or optional chaining results in null, then passing to a non-nullable parameter
  5. Destructuring or API response parsing returns values that might be null, then passing them without checking

How to fix "Argument of type 'null' is not assignable to parameter of type 'string'"

1Identify where the null value comes from

Read the error message carefully to find which argument and which line is causing the issue. Trace back to where the value originates. Common sources include:

- DOM API calls: document.getElementById(), querySelector() return null if not found
- API responses: JSON data with optional fields
- Object properties: values that might be undefined or null
- Function returns: functions that can return null

Add a console.log or use your debugger to confirm the variable is indeed null.

2Update the function signature to accept null

If the function should logically handle null values, update its parameter type to accept null using a union type:

typescript
// WRONG - function cannot handle null
function greetUser(name: string): void {
  console.log(`Hello, ${name}`);
}

const userName = getUserName(); // might be null
greetUser(userName); // TS2345 error

// CORRECT - function accepts string or null
function greetUser(name: string | null): void {
  if (name === null) {
    console.log("Hello, anonymous user");
  } else {
    console.log(`Hello, ${name}`);
  }
}

const userName = getUserName(); // might be null
greetUser(userName); // OK
3Use a null check before calling the function

If the function should only receive string values, add a type guard before passing the argument:

typescript
function greetUser(name: string): void {
  console.log(`Hello, ${name}`);
}

const userName = getUserName(); // might be null

// Check before calling
if (userName !== null) {
  greetUser(userName); // OK - TypeScript knows it's a string here
}

// Alternative: use a ternary operator
greetUser(userName ?? "Guest"); // OK - ?? provides a default if null
4Use the nullish coalescing operator (??)

Provide a default fallback value when the variable is null. The nullish coalescing operator (??) returns the right-hand value only if the left side is null or undefined:

typescript
function greetUser(name: string): void {
  console.log(`Hello, ${name}`);
}

const userName = getUserName(); // might be null

// Use ?? to provide a default value
greetUser(userName ?? "Guest"); // OK - always passes a string

// This is safer than || because it only replaces null/undefined, not falsy values
const accountName = ""; // empty string
console.log(accountName || "Default"); // outputs "Default" (treats empty string as falsy)
console.log(accountName ?? "Default"); // outputs "" (empty string is not null)
5Use optional chaining with type narrowing

When accessing nested properties that might be null, use optional chaining (?.) combined with nullish coalescing:

typescript
interface User {
  profile?: { name: string };
}

function displayName(name: string): void {
  console.log(name);
}

const user: User | null = getUser(); // might be null

// WRONG - multiple errors
displayName(user.profile.name);

// CORRECT - safely extract with fallback
const name = user?.profile?.name ?? "Anonymous";
displayName(name); // OK
6Use the non-null assertion operator (!) sparingly

If you are absolutely certain a variable is not null (for example, after checking it), use the non-null assertion operator (!) to tell TypeScript to treat it as non-null. Use this sparingly and only when you have confirmed the value cannot be null:

typescript
function greetUser(name: string): void {
  console.log(`Hello, ${name}`);
}

const userName = getUserName(); // might be null

if (userName !== null) {
  // After this check, TypeScript narrows the type automatically
  greetUser(userName); // OK - no assertion needed
}

// OR with assertion (less safe, only if you are certain):
const userNameNotNull = userName!; // ! tells TypeScript: trust me, this is not null
greetUser(userNameNotNull); // OK
7Verify strictNullChecks is enabled in tsconfig.json

This error only occurs when strict null checking is enabled. While disabling it would silence the error, it's not recommended because it removes type safety. Instead, embrace the null-safety checks:

json
{
  "compilerOptions": {
    "strict": true,
    "strictNullChecks": true
  }
}

Instead of disabling strictNullChecks, properly handle null values in your code using the techniques above. This leads to more reliable applications.

Advanced notes

The strict: true option in TypeScript enables strictNullChecks along with several other strict type-checking flags. Null and undefined are intentionally kept as separate types in strict mode to catch potential runtime errors early. When working with DOM APIs, always remember that many return null (getElementById, querySelector, getAttribute). In modern TypeScript, the nullish coalescing operator (??) is preferred over the logical OR operator (||) because || treats all falsy values (0, "", false, NaN) as needing replacement, while ?? only replaces null and undefined. This distinction is crucial: an empty string "" is a valid value and should not be replaced by a default. For complex type scenarios, consider using type guards or type predicates to narrow types safely across conditionals.

Frequently asked questions

What does "Argument of type 'null' is not assignable to parameter of type 'string" mean?
TypeScript's strictNullChecks feature treats null and undefined as distinct types that must be explicitly handled. When a function parameter is typed as string, TypeScript only allows actual string values to be passed. If your variable might be null, passing it directly to such a function violates TypeScript's type contract.
How do I fix "Argument of type 'null' is not assignable to parameter of type 'string"?
This TypeScript error occurs when you try to pass a null value to a function that expects a string parameter. Caused by strictNullChecks in TypeScript, this error prevents potential runtime errors by catching type mismatches at compile time. The fix involves either explicitly allowing null in the function signature, using null checks before passing arguments, or providing default values.
What causes "Argument of type 'null' is not assignable to parameter of type 'string"?
Passing a variable of type string | null to a function that only accepts string Getting a value from DOM APIs (like querySelector, getAttribute) that return null if not found, then passing it directly to a function expecting string Function parameter is typed as string but callers may pass null values
Is the "Argument of type 'null' is not assignable to parameter of type 'string" error serious?
It is a medium-severity error โ€” more of a blocker than a risk. The steps above resolve it.

Official resources & further reading