Skip to main content

How to Resolve "TypeError: Cannot set properties of undefined" Error in JavaScript

The TypeError: Cannot set properties of undefined (setting '...') is a very common error in JavaScript. It occurs when you try to assign a value to a property of a variable that holds the value undefined. This is a clear signal that you are trying to add a property to something that doesn't exist.

This guide will explain the fundamental reason this error happens and walk you through the most common scenarios—especially when working with objects and function arguments—and how to write "defensive" code to prevent it.

The Core Problem: You Can't Add Properties to undefined​

In JavaScript, only objects (including arrays) can have properties. The undefined value is a primitive type that represents the absence of a value. Think of it as a void. You cannot store anything in a void.

The error "Cannot set properties of undefined" is the JavaScript engine telling you, "You asked me to set a property (like .name or [0]) on a variable, but that variable is currently undefined, so there is no object to add the property to."

Example of problem:

let myObject; // This variable is currently `undefined`

// PROBLEM: We are trying to add the 'name' property to `undefined`.
myObject.name = 'Alice';

Error Output:

Uncaught TypeError: Cannot set properties of undefined (setting 'name')

Cause 1 (Most Common): Setting a Property on an Uninitialized Variable​

This is the most direct cause of the error. You have declared a variable but have not yet assigned an object or array to it.

Example of problem:

let user; // `user` is undefined

// This line will throw the error.
user.name = 'Alice';

Solution: you must initialize the variable with an object ({}) or an array ([]) before you can set properties on it.

// Correct: Initialize `user` as an empty object first.
let user = {};

// Now you can safely set properties.
user.name = 'Alice';

console.log(user);

Output:

{name: 'Alice'}

Alternatively, you can provide a fallback value if the variable might be undefined:

let userData; // from an external source, might be undefined

// Use the nullish coalescing operator (??) to provide a default.
const safeUser = userData ?? {};
safeUser.name = 'Alice';

Cause 2: Forgetting to Pass a Function Argument​

This error frequently occurs when a function expects an object as an argument, but you call the function without providing one. Inside the function, that parameter will be undefined.

Example of problem:

function configure(options) {
  // `options` will be `undefined` if the function is called with no arguments.
  options.theme = 'dark'; // This line will throw the error.
}

// PROBLEM: No argument is passed, so `options` is `undefined`.
configure();

Solution: the best and most modern way to solve this is to provide a default parameter in the function signature.

// Correct: Set a default value for the `options` parameter.
function configure(options = {}) {
  options.theme = 'dark';
  console.log(options.theme);
}

// This call is now safe. `options` will default to an empty object.
configure();

Output:

dark

Cause 3: Setting a Nested Property on a Missing Sub-Object​

The error also happens when you try to set a deeply nested property, but one of the intermediate objects in the chain doesn't exist.

Example of problem:

const user = {
  name: 'Alice'
  // There is no `preferences` property here.
};

// Problem: `user.preferences` is `undefined`.
// You cannot set the `theme` property on `undefined`.
user.preferences.theme = 'dark';

Solution: you must ensure each object in the chain is created before you try to set a property on it.

const user = {
  name: 'Alice'
};

// Correct: Check if the sub-object exists, and if not, create it.
if (!user.preferences) {
  user.preferences = {};
}

user.preferences.theme = 'dark';

console.log(user);

Output:

{ name: 'Alice', preferences: { theme: 'dark' } }

Conclusion​

The TypeError: Cannot set properties of undefined is always a sign that you are trying to modify a variable that has not been properly initialized as an object or array.

To solve it, follow this checklist:

  1. Check your variable initializations: Ensure any variable you intend to use as an object is initialized (e.g., let myObj = {};) before you set properties on it.
  2. Use default parameters in functions: If a function expects an object argument, provide a default value (e.g., function myFunc(options = {})).
  3. Check for nested objects: When setting a nested property like a.b.c, make sure that a and a.b are already objects before you try to set c.

By writing defensive code that initializes objects before using them, you can prevent this common error and make your applications more robust.

Table of Contents