TypeError — Common Causes and Fixes

Also Known As

TL;DR

Explanation

TypeError occurs when an operation is performed on an incompatible type. The most common: accessing a property on undefined or null. This happens when API responses have unexpected shapes, optional chaining is missing, or async data has not loaded yet. Other common TypeErrors: calling something that is not a function, accessing .length on null, passing wrong argument types. TypeScript catches most TypeErrors at compile time. In PHP, similar errors manifest as 'Call to a member function on null'.

Common Misconception

Why It Matters

Common Mistakes

• Not using optional chaining for potentially-null API response properties
• Forgetting async data is not available synchronously
• Not checking Array.isArray() before calling array methods on unknown values

Code Examples

const user = null;
console.log(user.name); // TypeError: Cannot read properties of null

const num = 42;
num.toUpperCase(); // TypeError: num.toUpperCase is not a function

// Optional chaining:
console.log(user?.name); // undefined, no throw

// Type check before calling:
if (typeof value === 'string') {
    value.toUpperCase();
}

// TypeScript catches these at compile time

References

• ↗ https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Errors/Cant_read_property

Tags

Related Terms