Is it possible to dynamically assign class properties from an array in JavaScript/TypeScript?

Question

Is it possible to dynamically assign class properties from an array in JavaScript/TypeScript?

Greetings for the assistance in advance. Currently, I am working with TypeScript, but I believe any JS solution will suffice. I aim to create something akin to the following:

class ExcelData {
  'Id 1': items[0].id,
  'Quantity 1': items[0].quantity,
  'Id 2': items[1].id,
  'Quantity 2': items[1].quantity
  //...
  'Id 40': items[39].id,
  'Quantity 40': items[39].quantity,
}

I am endeavoring to utilize it with the 'xlsx' module to export project data into an Excel spreadsheet. The module mandates this be a class rather than multiple arrays. While I could manually input the data, with 7 properties per item, the code would become quite messy. Moreover, there may be a requirement to include additional items in the future. In Python, I could achieve a similar result as classes and dictionaries are distinct entities:

excel_data = {}
for i in range (40):
  excel_data['Id '+ str(i)] = items[i].id
  excel_data['Quantity '+ str(i)] = items[i].quantity

Is there a TypeScript alternative that can serve this purpose?

Many thanks!

javascript typescript xlsx

Answer 1

Answer №1

If you're in search of a solution related to index-signatures, consider using objects in JavaScript/Typescript similar to Python dictionaries rather than classes, especially for data storage.

To create and access your desired data store, follow this example:

interface ExcelData {
    [property: string]: string | number | undefined;
}

const data: ExcelData = {};

data.id1 = "123-420";
data.quantity1 = 69;

You may want to rethink having properties like "Quantity-*". A better structure that uses ids to manage quantities could be implemented like so:

interface ExcelData {
    [id: string]: number | undefined;
}

const data: ExcelData = {};

data.someId = 69;

Alternatively, if needed, you can achieve your goal using a class as shown below:

class MyClass {
    [property: string]: string | number | undefined;
}

const myInstance = new MyClass();

myInstance.id1 = "123-420";
myInstance.quantity1 = 69;

Answer 2

If you're in search of a solution related to index-signatures, consider using objects in JavaScript/Typescript similar to Python dictionaries rather than classes, especially for data storage.

To create and access your desired data store, follow this example:

interface ExcelData {
    [property: string]: string | number | undefined;
}

const data: ExcelData = {};

data.id1 = "123-420";
data.quantity1 = 69;

You may want to rethink having properties like "Quantity-*". A better structure that uses ids to manage quantities could be implemented like so:

interface ExcelData {
    [id: string]: number | undefined;
}

const data: ExcelData = {};

data.someId = 69;

Alternatively, if needed, you can achieve your goal using a class as shown below:

class MyClass {
    [property: string]: string | number | undefined;
}

const myInstance = new MyClass();

myInstance.id1 = "123-420";
myInstance.quantity1 = 69;

Is it possible to dynamically assign class properties from an array in JavaScript/TypeScript?

Answer №1

Similar questions

Ajax: client dilemma created by the interaction of two functions

Show the current temperature data retrieved from the weather API

Struggles with jquery and fixing images

Typescript: requirement appears to be unmet

Building Dynamic Forms with React.js and Bootstrap for Easy Input Field Management

What could be causing my ng-grid footer to refuse to align with the bottom border?

Arrays passed as query parameters to Next.js router.query may result in the value being

Utilizing jQuery to Toggle Visibility of Table Rows on Button Click

Struggling to grasp the concept of duplicating the Three.js Editor Import feature

What is the best way to eliminate all occurrences of a specific element within an array?

Create a fake version of ElementRef and simulate the getBoundingClientRect() function

Check to see if the property of the object does not exist within the array and update as

Retrieve the value of the second child element in a table cell when clicking on it with Javascript

Ways to conceal sidebar after user logs out and reveal sidebar upon user's successful login?

Storing data from a massive JSON array into a separate array using a specific condition in JavaScript

PyScript <script type="py-editor"> Issue: SharedArrayBuffer cannot be used in an insecure environment

How can progress bars be animated using CSS or JavaScript?

Tips for creating a dynamic curved SVG path

An error occurred when trying to pass JSON data to the view in the "orchard" framework: TypeError - e.slice is not a function

I am facing an issue with my React/Redux API where it is not logging out correctly and displaying [[