JavaScript errorTypeError: “Cannot read properties of undefined (reading 'x')”

Why the value is missing, and the fix

1. 01

   The data has not loaded yet

   “You cannot invoke a method on an undefined or null variable.” MDN, TypeError: "x" is (not) "y"

   React, Vue and other UI code render once before a fetch finishes. If the initial state is undefined, the first render reads a property of nothing. Start with a value of the right shape, or render a loader until the data arrives.

   const [user, setUser] = useState(null);
   
   if (!user) return <Spinner />;
   return <h1>{user.name}</h1>;
   
   // or, for a single read
   <h1>{user?.name}</h1>

2. 02

   The API response has a different shape

   “To fix null pointer to undefined or null values, you can test if the value is undefined or null first.” MDN, TypeError: "x" is (not) "y"

   The code expects data.user.name, but the API sends data.name, wraps it in data.data, or leaves the field out for some records. Log the response once (console.log(JSON.stringify(data, null, 2))) and match the code to what actually arrives. Treat fields the API does not guarantee as optional.

   const city = order?.shipping?.address?.city ?? 'Unknown';

3. 03

   An empty lookup: find(), an index or a missing key

   array.find() returns undefined when nothing matches, items[0] is undefined on an empty array, and obj[key] is undefined for a key that is not there. Check the result before reading from it, especially for data that depends on the URL, a filter or user input.

   const product = products.find((p) => p.id === id);
   if (!product) return notFound();

4. 04

   A DOM element that is not there

   document.querySelector() returns null when the element does not exist yet or the selector is wrong, so reading .value or calling .addEventListener on it fails with “Cannot read properties of null (reading 'value')”. Run the code after the element exists (a script with defer, or inside a framework’s mount hook), and check the selector.

Checked against the vendor’s docs on November 7, 2026: MDN: TypeError: "x" is (not) "y" (Cannot read properties of undefined).

Rather hand it over?

Fixed scope, fixed price, paid upfront. The work happens in writing; no call needed.

• from $450App Fix TicketOne reproducible bug in an existing mobile or web app, diagnosed and fixed.See scope and start
• from $450AI-Built App RescueA Lovable, Bolt or Cursor app checked end to end in 3 days, then its worst problems fixed at a fixed price.No issues worth fixing, no charge. If the Launch Check finds nothing rated medium or higher, Simon refunds the full $450. You keep the report either way. This applies to the first 10 Launch Checks bought after October 30, 2026.See scope and start

Related: TypeError: “x is not a function” · “Unexpected token < in JSON” · Vercel environment variables undefined