What is the best way to access all the attributes (excluding methods) of an object in a class instance?

Question

What is the best way to access all the attributes (excluding methods) of an object in a class instance?

My goal is to generate a new object type that inherits all the properties from an existing class instance. In other words, I am looking for a way to transform a class instance into a plain object.

For example, consider the following scenario:

class Foobar {
    foo: number = 0;

    bar(): void {} 
}

type ClassProperties<C extends new(...args: readonly unknown[]) => unknown> =
    C extends new(...args: readonly unknown[]) => infer R 
        ? { [K in keyof R]: R[K] } 
        : never
;

const foobar = new Foobar();
const data: ClassProperties<typeof Foobar> = { ...foobar };

However, when I try to implement this, TypeScript throws an error saying

Property 'bar' is missing in type '{ foo: number; }' but required in type '{ foo: number; bar: () => void; }'

.

I find this issue puzzling since it appears to be a straightforward task. Is there a reliable solution to this problem?

Any insights would be highly appreciated.

typescript

Answer 1

Answer №1

To achieve the desired result, you must iterate over each property individually and apply different conditions to each one. However, the current mapped type you are using treats all properties identically:

{ [K in keyof R]: R[K] }

A more effective approach is to utilize key renaming within a mapped type to conditionally map function properties to never, effectively removing them from the resulting type:

type Newable = { new(...args: readonly unknown[]): unknown }
type AnyFn = (...args: unknown[]) => unknown

type ClassProperties<C extends Newable> = {
    [
        K in keyof InstanceType<C>
            as InstanceType<C>[K] extends AnyFn
                ? never
                : K
    ]: InstanceType<C>[K]
}

In this updated version, I have defined separate types for Newable and AnyFn for clarity. Additionally, I replaced your use of infer with TypeScript's built-in InstanceType.

The mapped type now iterates over each key of the class instances. Using as, it applies a conditional check to each property name. If the property is a function, it is mapped to never; otherwise, the key remains unchanged.

The value of each mapped property remains the same as it was on the instance, ensuring the value type is preserved.

This approach accurately produces the expected outcome:

class Foobar {
    foo: number = 0;
    bar(): void {} 
}

type Test = ClassProperties<typeof Foobar>
// { foo: number }

const foobar = new Foobar();
const data: ClassProperties<typeof Foobar> = { ...foobar }; // works correctly

See playground

Alternatively, you can simplify the process by directly passing in the instance type to your type definition:

type ClassProperties<C> = {
    [K in keyof C as C[K] extends AnyFn ? never : K]: C[K]
}

class Foobar {
    foo: number = 0;
    bar(): number {return 123} 
}

type Test = ClassProperties<Foobar>
// { foo: number }

const foobar = new Foobar();
const data: ClassProperties<Foobar> = { ...foobar }; // works fine

See playground

Answer 2

To achieve the desired result, you must iterate over each property individually and apply different conditions to each one. However, the current mapped type you are using treats all properties identically:

{ [K in keyof R]: R[K] }

A more effective approach is to utilize key renaming within a mapped type to conditionally map function properties to never, effectively removing them from the resulting type:

type Newable = { new(...args: readonly unknown[]): unknown }
type AnyFn = (...args: unknown[]) => unknown

type ClassProperties<C extends Newable> = {
    [
        K in keyof InstanceType<C>
            as InstanceType<C>[K] extends AnyFn
                ? never
                : K
    ]: InstanceType<C>[K]
}

In this updated version, I have defined separate types for Newable and AnyFn for clarity. Additionally, I replaced your use of infer with TypeScript's built-in InstanceType.

The mapped type now iterates over each key of the class instances. Using as, it applies a conditional check to each property name. If the property is a function, it is mapped to never; otherwise, the key remains unchanged.

The value of each mapped property remains the same as it was on the instance, ensuring the value type is preserved.

This approach accurately produces the expected outcome:

class Foobar {
    foo: number = 0;
    bar(): void {} 
}

type Test = ClassProperties<typeof Foobar>
// { foo: number }

const foobar = new Foobar();
const data: ClassProperties<typeof Foobar> = { ...foobar }; // works correctly

See playground

Alternatively, you can simplify the process by directly passing in the instance type to your type definition:

type ClassProperties<C> = {
    [K in keyof C as C[K] extends AnyFn ? never : K]: C[K]
}

class Foobar {
    foo: number = 0;
    bar(): number {return 123} 
}

type Test = ClassProperties<Foobar>
// { foo: number }

const foobar = new Foobar();
const data: ClassProperties<Foobar> = { ...foobar }; // works fine

See playground

Answer 3

Answer №2

Looking to enhance the previous type mentioned in Alex Wayne's response by utilizing the global type Function. This choice is preferred as it seamlessly integrates with class methods and offers a more concise solution:

type ClassProperties<C> = {
    [K in keyof C as C[K] extends Function ? never : K]: C[K]
}

Answer 4

Looking to enhance the previous type mentioned in Alex Wayne's response by utilizing the global type Function. This choice is preferred as it seamlessly integrates with class methods and offers a more concise solution:

type ClassProperties<C> = {
    [K in keyof C as C[K] extends Function ? never : K]: C[K]
}

What is the best way to access all the attributes (excluding methods) of an object in a class instance?

Answer №1

Answer №2

Similar questions

Retrieve the service variable in the routing file

Exploiting the Power of useRef with TypeScript in Functional Components of React

Adding dynamic row values to a bootstrap table in angular 4 - what's the best approach?

What is the reason for encountering the error message "Property 'floatThead' does not exist on type 'JQuery<any>' when trying to use floatThead in Angular/TypeScript?

typescript: exploring the world of functions, overloads, and generics

Achieve the capability to upload multiple files in Next.js using the upload.io integration feature

Issue encountered while setting up controls and AbstractControls in form development

Typescript is throwing an error with code TS2571, indicating that the object is of type 'unknown'

"Attempting to verify a JSON Web Token using a promise that returns an object not compatible with the specified

The specified type 'MutableRefObject<HTMLInputElement | undefined>' cannot be assigned to type 'LegacyRef<HTMLInputElement> | undefined'

Experiencing CORS problem in Ionic 3 when accessing API on device

Tips for managing server data and dynamically binding values in Ionic 3

Error in Mongoose Schema Configuration Detected in NestJS App

Injecting singletons in a circular manner with Inversify

Using Typescript to combine strings with the newline character

Angular project hosting causing malfunctions in route parameters

Excessive repetition in the style of writing for a function

When trying to reference a vanilla JavaScript file in TypeScript, encountering the issue of the file not being recognized

Utilize API within an array to enable Ionic to display a PDF in a document viewer

An issue arises in Typescript when attempting to pass an extra prop through the server action function in the useForm