Creating objects based on interfaces in TypeScript is a common practice. This process involves defining

Question

Creating objects based on interfaces in TypeScript is a common practice. This process involves defining

Within my TypeScript code, I have the following interface:

export interface Defined {
   4475355962119: number[];
   4475355962674: number[];
}

I am trying to create objects based on this interface Defined:

let defined = new Defined();
defined['4475355962119'] = [1];
defined['4475355962674'] = [2];

However, I am facing issues with this approach!

Perhaps I should define the interface like this:

 export interface Defined {
      array(number): number[];
}

In addition, I have a JSON object that I need to use to create JavaScript objects:

  "parameters": {
    "defined": {
      4475355962119: [
      9547,
      9871
      ],
      4475355962674: [
      9829
      ]
    }
  }

javascript typescript typescript2.0

Answer 1

Answer №1

Let's kick things off with a valid JSON string:

const info = `{
    "details": {
    "confirmed": {
      "123456789": [9876,5432],
      "987654321": [2345]
    }
  }
}`;

Structure

To represent this as an interface, the idea is to maintain all the keys and assign their respective types to values, like so:

interface InfoData {
    details: {
        confirmed: {
            [key: number]: number[];
        }
    }
}

We can then parse the data into that defined type:

const outcome = <InfoData>JSON.parse(info);

And access only the "confirmed" portion:

const booked = outcome.details.confirmed;

Detailed Example

Here is a detailed example:

const info = `{
    "details": {
    "confirmed": {
      "123456789": [9876,5432],
      "987654321": [2345]
    }
  }
}`;

interface InfoData {
    details: {
        confirmed: {
            [key: number]: number[];
        }
    }
}

const result = <InfoData>JSON.parse(info);

alert(result.details.confirmed['987654321'][0]); // 2345

Generating Data

If you are not deserializing the data, you have the option to create it manually. The type declaration will guide you in constructing a correct object.

const sample: InfoData = {
    details: {
        confirmed: {
            '987654321': [0, 1, 3]
        }
    }
};

sample.details.confirmed['987654321'][2] = 4;

Answer 2

Let's kick things off with a valid JSON string:

const info = `{
    "details": {
    "confirmed": {
      "123456789": [9876,5432],
      "987654321": [2345]
    }
  }
}`;

Structure

To represent this as an interface, the idea is to maintain all the keys and assign their respective types to values, like so:

interface InfoData {
    details: {
        confirmed: {
            [key: number]: number[];
        }
    }
}

We can then parse the data into that defined type:

const outcome = <InfoData>JSON.parse(info);

And access only the "confirmed" portion:

const booked = outcome.details.confirmed;

Detailed Example

Here is a detailed example:

const info = `{
    "details": {
    "confirmed": {
      "123456789": [9876,5432],
      "987654321": [2345]
    }
  }
}`;

interface InfoData {
    details: {
        confirmed: {
            [key: number]: number[];
        }
    }
}

const result = <InfoData>JSON.parse(info);

alert(result.details.confirmed['987654321'][0]); // 2345

Generating Data

If you are not deserializing the data, you have the option to create it manually. The type declaration will guide you in constructing a correct object.

const sample: InfoData = {
    details: {
        confirmed: {
            '987654321': [0, 1, 3]
        }
    }
};

sample.details.confirmed['987654321'][2] = 4;

Answer 3

Answer №2

Check out this code snippet example:

export interface Defined {
   4475355962119: number[];
   4475355962674: number[];
}

let defined = {} as Defined;
defined['4475355962119'] = [1];
defined['4475355962674'] = [2];

Answer 4

Check out this code snippet example:

export interface Defined {
   4475355962119: number[];
   4475355962674: number[];
}

let defined = {} as Defined;
defined['4475355962119'] = [1];
defined['4475355962674'] = [2];

Answer 5

Answer №3

If you want to create a simple object, you can do so with an object literal:

let myObject = {
    123456789 : [1],
    987654321 : [2]
};

Answer 6

If you want to create a simple object, you can do so with an object literal:

let myObject = {
    123456789 : [1],
    987654321 : [2]
};

Creating objects based on interfaces in TypeScript is a common practice. This process involves defining

Answer №1

Structure

Detailed Example

Generating Data

Answer №2

Answer №3

Similar questions

Generate a complete screenshot of a website using Chrome 59 through code

Challenges with Hangman in JavaScript

Redirecting the socket.io client to the Heroku service

The Jquery .change() function refreshes the results just once

React and Redux Toolkit collaborated to create a seamless shared state management system,

Vue 3 has a known issue where scoped styles do not get applied correctly within the content of a <slot> element

What is preventing me from being able to access a property within my function?

Utilizing only select functions from lodash can be more beneficial than installing the entire library, as it reduces the amount of unnecessary dependencies

Uploading Files with Typescript Promises

What is the solution to preventing Angular 1.3 ngMessages from affecting the size of my form?

Is there a way to trigger a custom event from a Web Component and then intercept it within a React Functional Component for further processing?

Learn how to hide a bar after clicking the "I agree" button with the help of Bootstrap

The image displayed by the @vercel/og API route is not appearing correctly

Encountering the error message "Received interpolation ({{}}) when an expression was expected" is a common issue when trying to interpolate tag attribute values within an ngFor loop

JQuery / Javascript - Mouse Position Erroneously Detected

"Tips for retrieving properties from a JSON object that has been converted to a string

Modifying attributes of an object within a document using Mongoose

Angular version 7.2.1 encounters an ES6 class ReferenceError when attempting to access 'X' before it has been initialized

Encountering the React.Children.only error while trying to use the <Link> component in Next.js

When text is wrapped within the <li> tag