The argument of type <Interface> is not assignable to the parameter of type Record<string, string>

This error message indicates that you are trying to pass an argument of type Interface to a function or method that expects a value of type Record<string, string>. See how to fix this.

December 30, 2022 typescript

Problem

interface Person {
  name: string;
  email: string;
}


function logRecord(record: Record<string, string>): void {
  /* ... */
}


const me: Person = {
  name: "John",
  email: "john@doe.com",
};


logRecord(me); // error: "The argument of type 'Person' is not assignable to the parameter of type 'Record<string, string>'"
const dictionary: Record<string, string> = me; // error: "The argument of type 'Person' is not assignable to the parameter of type 'Record<string, string>'"

Solution #1: Use type instead of interface

type Person = {
  name: string;
  email: string;
};


function logRecord(record: Record<string, string>): void {
  /* ... */
}


const me: Person = {
  name: "John",
  email: "john@doe.com",
};


logRecord(me); // works
const dictionary: Record<string, string> = me; // works

Solution #2: Create a shadow copy with decomposition

interface Person {
  name: string;
  email: string;
}


function logRecord(record: Record<string, string>): void {
  /* ... */
}


const me: Person = {
  name: "John",
  email: "john@doe.com",
};


logRecord({ ...me }); // works
const dictionary: Record<string, string> = { ...me }; // works

Solution #3: Use satisfies to create variable

interface Person {
  name: string;
  email: string;
}


function logRecord(record: Record<string, string>): void {
  /* ... */
}


const me = {
  name: "John",
  email: "john@doe.com",
} satisfies Person;


logRecord(me); // works
const dictionary: Record<string, string> = me; // works

Solution #4: Use as keyword

interface Person {
  name: string;
  email: string;
}


function logRecord(record: Record<string, string>): void {
  /* ... */
}


const me: Person = {
  name: "John",
  email: "john@doe.com",
};


logRecord(me as unknown as Record<string, string>); // works
const dictionary: Record<string, string> = me as unknown as Record<string, string>; // works

What to choose?

If you can, try to change interface into type. It is the best solution at this moment. Resolving the problem with a shadow copy has an impact on runtime execution code so is not recommended (if you do not need to create a shadow copy because of JavaScript, do not do it).

Do you like the content?

Your support helps me continue my work. Please consider making a donation.

Buy Me A Coffee

Donations are accepted through PayPal or Stripe. You do not need a account to donate. All major credit cards are accepted.

Leave a comment