How to make object type from another object type keys in TypeScript?
Tags: typescript
Published: 2022-02-06 00:00:00

---
  title: How to make object type from another object type keys in TypeScript?
  published: true
  tags: TypeScript
  date: Sun Feb 06 2022 05:30:00 GMT+0530 (India Standard Time)
  canonical_url: https://melvingeorge.me/blog/make-object-type-from-another-object-type-keys-typescript
  cover_image: https://melvingeorge.me/_next/static/images/main-46a4f33396683241ce6abfba0225783b.jpg
  ---
  [Originally posted here!](https://melvingeorge.me/blog/make-object-type-from-another-object-type-keys-typescript)
  
To make an object type from another object type keys, you can the `in` operator in combination with the `keyof` operator inside an [`Index Signature syntax`](https://melvingeorge.me/blog/type-to-use-for-objects-when-properties-are-not-known-ahead-typescript) in TypeScript.

### TL;DR

```ts
// a simple type
type Person = {
  name: string;
  age: number;
  isAdmin: boolean;
};

// make another object type from
// the `Person` type key's using the
// `in` and the `keyof` operator
// inside the `Index Signature` syntax
type AllPropertyStringPerson = {
  [Value in keyof Person]: string;
};

/*
The `AllPropertyStringPerson` type content looks like this,

{
  name: string;
  age: string;
  isAdmin: string;
}

*/
```

For example, let's say we have a type called `Person` with some properties like `name`, `age`, and `isAdmin` having types of `string`, `number`, and boolean respectively like this,

```ts
// a simple type
type Person = {
  name: string;
  age: number;
  isAdmin: boolean;
};
```

Now we aim to make another object type using the `Person` type's keys but with a different type for each key in the new type say `string`.

To do that we can use the `in` operator followed by the `keyof` operator inside the [Index Signature syntax](https://melvingeorge.me/blog/type-to-use-for-objects-when-properties-are-not-known-ahead-typescript) like this,

```ts
// a simple type
type Person = {
  name: string;
  age: number;
  isAdmin: boolean;
};

// make another object type from
// the `Person` type key's using the
// `in` and the `keyof` operator
// inside the `Index Signature` syntax
type AllPropertyStringPerson = {
  [Value in keyof Person]: string;
};
```

As you can see from the above code a lot is going on. These are the explanations for the above code:

- We have used the `in` operator because we have to iterate through every property in the `Person` type
- and also while looping we need to get only the key's name and for that, we have used the `keyof` operator followed by the type we need to get the key name from in our case it is the `Person` type.
- The key name value will then be stored inside the `Value` placeholder name we have given inside the `Index Signature syntax`.
- and finally, we have given the type of `string` for every property in the new type `AllPropertyStringPerson`.

Now if you hover over the `AllPropertyStringPerson` (if you are using VScode or TypeScript enabled editor), you can see that all the keys from the `Person` object are reflected in the `AllPropertyStringPerson` type and all the properties are having the type of string.

It will look like this,

```ts
// a simple type
type Person = {
  name: string;
  age: number;
  isAdmin: boolean;
};

// make another object type from
// the `Person` type key's using the
// `in` and the `keyof` operator
// inside the `Index Signature` syntax
type AllPropertyStringPerson = {
  [Value in keyof Person]: string;
};

/*
The `AllPropertyStringPerson` type content looks like this,

{
  name: string;
  age: string;
  isAdmin: string;
}

*/
```

We have successfully made an object type from another object type keys in TypeScript. Yay 🥳!

See the above code live in [codesandbox](https://codesandbox.io/s/make-object-type-from-another-object-type-key-typescript-rclgtv?file=/src/index.ts).

That's all 😃!

### Feel free to share if you found this useful 😃.

---