Creating an Object by TypeScript Interface: A Complete Guide with Examples

How to Create an Object Based on an Interface in TypeScript: A Complete Explanation with Code

Have you ever encountered a situation where TypeScript literally "yells" at you because you're trying to create an object that doesn't match the interface? Sound familiar? If you've been working with TypeScript for at least a week, you've probably seen this error:

Type '{}' is missing the following properties from type 'User': name, age

This is one of the most popular problems on Stack Overflow (tens of thousands of views), and today we'll solve it once and for all. In this article, you'll learn how to create an object based on an interface in TypeScript, what methods exist, and when to use which one.

Why is this topic so important?

TypeScript is a superset of JavaScript that adds static typing. TypeScript interfaces are a powerful tool for describing the structure of objects. But beginners often get confused: "I declared an interface, but how do I now create a real object?"

Without a proper understanding of this mechanism, you'll spend hours debugging or, worse, use any — which is a direct path to losing all the benefits of TypeScript.

Method 1: Direct Assignment (Simplest)

The most obvious way to create an object by TypeScript interface is to simply assign an object literal to a variable with the interface type:

interface User {  name: string;  age: number;  email?: string; // optional field}

// ✅ Correct: the object fully matches the interfaceconst user: User = {  name: "Anna",  age: 28,  email: "anna@example.com"};

// ✅ Also correct: the optional field can be omittedconst userMinimal: User = {  name: "Ivan",  age: 35};

This works, but there's a nuance: TypeScript will check that the object has ALL required fields. If you forget name or age, the compiler will throw an error.

❌ Typical Beginner Mistake

// ❌ Error! Missing required field 'age'const badUser: User = {  name: "Petr"};

Method 2: Using the as Operator (Type Assertion)

Sometimes you need to create an object gradually, for example, filling it from different sources. In such cases, you can use the as operator:

interface Config {  apiUrl: string;  timeout: number;  retries: number;}

// Create an empty object with type assertionconst config = {} as Config;

// Now you can add fields one by oneconfig.apiUrl = "https://api.example.com";config.timeout = 5000;config.retries = 3;

// ✅ Works, but BE CAREFUL!

⚠️ Warning: This method disables type checking at the object creation stage. You might accidentally miss a required field and only find out about it at runtime. Use as only when you're sure all fields will be filled.

Method 3: Factory Function (Recommended)

The best way to create an object based on an interface in TypeScript is to write a factory function. This provides 100% type safety and the ability to set default values:

interface Product {  id: number;  title: string;  price: number;  inStock: boolean;  description?: string;}

// Factory function with default parametersfunction createProduct(  id: number,  title: string,  price: number,  inStock: boolean = true,  description?: string): Product {  return {    id,    title,    price,    inStock,    ...(description && { description })  };}

// Usageconst laptop = createProduct(1, "Laptop", 999.99);const phone = createProduct(2, "Smartphone", 599.99, false, "Great phone");

console.log(laptop); // { id: 1, title: 'Laptop', price: 999.99, inStock: true }console.log(phone)