TypeScript: How to create Objects out of an Interface

Interfaces in TypeScript provide a way to define the shape of an object. They allow you to specify the required and optional properties of an object, as well as their types. In this blog post, we will explore how to create an object based on an interface using TypeScript.

Let's start with an example interface called Member.

interface Member {
  fullName: string
  subscriptionID: number
}

This interface defines a Member object with two properties: fullName which is a required string and subscriptionID which is an optional number.

1. Create Objects from the Member Interface

To create an object based on this interface, we can simply declare a variable with the type of Member and assign values to its properties.

const member: Member = {
  fullName: 'John Smith',
  subscriptionID: 12345,
}

In the example above, we declare a variable member with the type of Member and assign values to its properties fullName and subscriptionID. Since subscriptionID is an optional property, we can omit it when creating the object.

const member2: Member = {
  fullName: 'Jane Doe',
}

In the example above, we declare another variable member2 with the type of Member and only assign a value to its required property fullName. Since subscriptionID is an optional property, we can omit it.

Using Interfaces as Function parameter

Interfaces in TypeScript can also be used to define functions. Let's explore how we can use the Member interface to define a function.

We can define a function that: accepts: a parameter of type Member and returns: a string that includes the member's fullname and subscriptionID (if provided).

const getMemberDetails = (member: Member): string => {
  let details = `Name: ${member.fullName}`
  if (member.subscriptionID) {
    details += `, Subscription ID: ${member.subscriptionID}`
  }
  return details
}

In the example above, we define a function called getMemberDetails() that takes in a parameter of type Member and returns a string that includes the member's full name and subscription ID (if provided).

We can now call the getMemberDetails() function and pass in a Member object as an argument.

const member: Member = {
  fullName: 'John Smith',
  subscriptionID: 12345,
}

console.log(getMemberDetails(member)) // Returns: "Name: John Doe, Subscription ID: 12345"

In the example above, we create a Member object called member with a fullName property of "John Smith" and a subscriptionID property of 12345. We then call the getMemberDetails() function and pass in the member object as an argument. The function returns a string with the member's details, which we log to the console.

2. Create Objects Using Type assertion

We can leverage the Type Assertion to provide a default object out of an interface. The getMemberInstance() method will return an object of this type.

interface Member {
  fullName: string
  subscriptionID?: number
}

const getMemberInstance = (): Member => {
  const member = {} as Member
  member.fullName = ''
  member.subscriptionID = 0
  return member
}

console.log(getMemberInstance()) // Returns {fullName: "", subscriptionID: 0}

3. Create Objects Using Partial<Type>

With Partial we can construct a Member type with all properties of Type set to optional. And can represent all subsets of a given type. So using the method getMemberInstanceFrom() we can have a new object based on the partial input and a default member values as a fallback for any attributes missed.

interface Member {
  fullName: string
  subscriptionID?: number
}

const getMemberInstanceFrom = (partialMember: Partial<Member>): Member => {
  const defaultMember = {} as Member
  defaultMember.fullName = 'Anonymous'
  defaultMember.subscriptionID = 0
  return { ...defaultMember, ...partialMember }
}

console.log(getMemberInstanceFrom({ fullName: 'Mike Smith' })) // Returns {fullName: "Mike Smith", subscriptionID: 0}

Interfaces in TypeScript offer a mechanism to specify the structure of an object or function. By using interfaces, you can achieve better code maintainability and readability. especially when dealing with complex objects or function parameters.