How to Fix "Cannot Read Property of Undefined" in JavaScript

By David Kim Jul 11, 2026 7 min read Programming

The "Cannot read property of undefined" error is one of the most common JavaScript runtime errors. It occurs when you try to access a property on undefined.

What Causes This Error?

This error happens when an object is undefined but you try to access its properties. Example: const user = undefined; console.log(user.name); // TypeError: Cannot read properties of undefined. Common scenarios: API responses missing expected fields, null values from database queries, missing props in React/Vue components, or asynchronous data not yet loaded.

Using Optional Chaining (?.)

Optional chaining stops evaluation if the value is null or undefined. Instead of user.address.street, use user?.address?.street. If user is undefined, the expression returns undefined instead of throwing. This works for property access, method calls (obj?.method()), and dynamic access (arr?.[index]).

Using Nullish Coalescing (??)

The nullish coalescing operator provides default values for null/undefined. Example: const name = user?.name ?? 'Guest'. This returns 'Guest' if user or user.name is null/undefined. Unlike ||, it does not treat 0, '', or false as missing values.

Defensive Coding Practices

Validate API responses before access: if (response?.data?.users). Use default parameters: function greet(name = 'Guest'). Initialize state variables with sensible defaults. Use try/catch around JSON.parse(). Use TypeScript for compile-time null checking.

Debugging Tips

The error message includes the stack trace. Open browser DevTools and set breakpoints near the failing line. Use console.log to inspect variables before the error. Use the Sources tab to step through code. Check network responses to verify API data structure.