Property has no initializer in TypeScript: how to fix in 5 minutes

Online Python Trainer for Beginners

Learn Python easily without overwhelming theory. Solve practical tasks with automatic checking, get hints in Russian, and write code directly in your browser — no installation required.

Start Course

Introduction: why is TypeScript complaining about your properties?

\n\n

You're writing code in TypeScript, everything is going great... And then — bam! A red squiggly line under a class property, and the compiler gives you the chilling phrase: Property '...' has no initializer and is not definitely assigned in the constructor. Sound familiar? If you've ever worked with Angular, React, or just TypeScript classes — you probably have.

\n\n

This error is one of the most popular on Stack Overflow (thousands of views, dozens of answers). But the good news: it's not scary. The bad news: if you don't figure it out, you can cause runtime bugs. In this article, we'll break down why this TypeScript error occurs, how to fix it, and when each solution is appropriate.

\n\n

What does the error "Property has no initializer" mean?

\n\n

Let's translate from compiler-speak to human. TypeScript is telling you: "Hey, you declared a property in the class, but didn't give it an initial value and didn't assign it in the constructor. I'm not sure there will be anything meaningful there when you access this property".

\n\n

Enable strict: true in your tsconfig.json — and you automatically activate the strictPropertyInitialization flag. This is what's responsible for this check. The code looks something like this:

\n\n
class User {\n  name: string; // ❌ Error!\n  age: number;  // ❌ Error!\n}
\n\n

TypeScript rightly notes: name and age could end up being undefined if you forget to initialize them. And their types are strict string and number, without undefined. So there's your conflict.

\n\n

Method #1: Initialization directly in the declaration

\n\n

The simplest and safest way is to give the property a value right away. This is especially convenient for fields with default values.

\n\n
class User {\n  name: string = 'Guest';\n  age: number = 0;\n  createdAt: Date = new Date();\n}
\n\n

When to use: when the field has a reasonable default value. For example, a counter, a flag, a creation date. This is a TypeScript best practice — you explicitly specify the initial state.

\n\n

Method #2: Initialization in the constructor

\n\n

A classic approach. If the value should come from outside — assign it in the constructor. TypeScript approves.

\n\n
class User {\n  name: string;\n  age: number;\n\n  constructor(name: string, age: number) {\n    this.name = name;\n    this.age = age;\n  }\n}
\n\n

Important: the compiler will check that you have assigned a value to all properties. If you forget one — you'll get the error again.

\n\n
class User {\n  name: string;\n  age: number;\n\n  constructor(name: string) {\n    this.name = name;\n    // age is not assigned — error!\n  }\n}
\n\n

This is done on purpose: TypeScript protects you from accidental undefined. You either initialize all fields, or explicitly allow them to be undefined.

\n\n

Method #3: Definite assignment operator (!)

\n\n

Sometimes you know for sure that a property will be initialized later, but not in the constructor. For example, through dependency injection in Angular or by calling an asynchronous method. In that case, use the definite assignment assertion — an exclamation mark after the property name.

\n\n
class UserService {\n  user!: User; // OK, I promise it will be set\n\n  constructor() {\n    this.initUser();\n  }\n\n  initUser() {\n    this.user = new User('Alice', 30);\n  }\n}
\n\n

Caution: this is a powerful but dangerous tool. You're telling TypeScript: "Don't check, I know what I'm doing". If you forget to initialize the property — you'll get undefined at runtime. Use it only when you are 100% sure.

\n\n

Method #4: Make the property optional (?)

\n\n

If

Blogs

Book Recommendations