The data structure does not match the exact object type

Question

The data structure does not match the exact object type

Why isn't this code snippet functioning as expected? It seems that 'beta' has keys of type string and their values are compatible (id is a number type, and temp is also a number type). Additionally, the Record function should make the values of all keys any, which should be compatible with everything.

const alpha:  Record<string, any> = {
  id: 1,
  temp: 2
};

const beta : {
  id: number;
  temp: number
} = alpha;

So why does it produce this error message?

Type 'Record<string, any>' is missing the following properties from type '{ id: number; temp: number; }': id, temp

typescript

Answer 1

Answer №1

beta requires properties id and temp.

By specifying a type for alpha, TypeScript interprets it as Record<string, any> instead of {id: number; temp: number}.

This means that there is no assurance that Record<string, any> includes id and temp.

The explicit type declaration for alpha needs to be removed.

In situations like this, it's best to let TypeScript handle the types for you without being explicitly declared.

const alpha = {
  id: 1,
  temp: 2
};

const beta : {
  id: number;
  temp: number
} = alpha;

Here's how TypeScript deals with these variables:

declare let alpha: Record<string, any>;

declare let beta: { id: number; temp: number };

alpha = beta // ok

beta = alpha // error

Notice that beta can be assigned to alpha, so you can use the explicit type Record<string, any> for the alpha object.

However, the reverse is not true - alpha cannot be assigned to beta because beta is a subtype of alpha.

Consider alpha as a super type and beta as a subtype

Answer 2

beta requires properties id and temp.

By specifying a type for alpha, TypeScript interprets it as Record<string, any> instead of {id: number; temp: number}.

This means that there is no assurance that Record<string, any> includes id and temp.

The explicit type declaration for alpha needs to be removed.

In situations like this, it's best to let TypeScript handle the types for you without being explicitly declared.

const alpha = {
  id: 1,
  temp: 2
};

const beta : {
  id: number;
  temp: number
} = alpha;

Here's how TypeScript deals with these variables:

declare let alpha: Record<string, any>;

declare let beta: { id: number; temp: number };

alpha = beta // ok

beta = alpha // error

Notice that beta can be assigned to alpha, so you can use the explicit type Record<string, any> for the alpha object.

However, the reverse is not true - alpha cannot be assigned to beta because beta is a subtype of alpha.

Consider alpha as a super type and beta as a subtype

The data structure does not match the exact object type

Answer №1

Similar questions

Implementing Entity addition to a Data Source post initialization in TypeORM

Having trouble making API calls from the NextJS endpoint

Angular checkbox filtering for tables

I lost my hovering tooltip due to truncating the string, how can I bring it back in Angular?

When using this.$refs in Vue, be mindful that the object may be undefined

Typescript compiler not excluding the node_modules directory

Examining Resolver Functionality within NestJS

Create an array using modern ES6 imports syntax

The editor is locked and choices are displayed in a vertical orientation

Can you explain the concept of BuildOptions in Sequelize?

Having trouble with the lodash find function in my Angular application

Modifying the website favicon based on the URL address

Guide on positioning a span element to the left using the margin auto property in CSS for Angular 4

When running the test, a "is not defined" ReferenceError occurs in the declared namespace (.d.ts) in ts-jest

Want to enhance user experience? Simply click on the chart in MUI X charts BarChart to retrieve data effortlessly!

Issue with triggering blur event in Internet Explorer while using Angular 2+

Is it possible to verify if an object matches a type without explicitly setting it as that type?

What is the process for incorporating a custom type into Next.js's NextApiRequest object?

Guide on properly defining typed props in Next.js using TypeScript

Conceal components using routing in Angular2 release candidate 1