typescript - instantiate an object using values stored in an array

Question

typescript - instantiate an object using values stored in an array

Assume we have a model defined as follows.

export interface Basicdata {
    materialnumber: number;
    type: string;
    materialclass: string;
}

We also have an array containing values that correspond directly to the Basicdata model in order, like this:

["10003084", "S", "CLIP"]

I am exploring ways to create an object using these array values. One approach is to initialize an empty object and populate it with the array values.

const singleRow = rows[0];

const newBD: Basicdata = {
 materialnumber: 0,
 type: '',
 materialclass: '',  
}


newBD.materialnumber = singleRow[0];
newBD.type = singleRow[1];
newBD.materialclass = singleRow[2];

However, I believe there must be a more elegant solution to accomplish this. I have tried to use map and reduce but haven't found a suitable method yet.

Any suggestions would be appreciated.

javascript typescript

Answer 1

Answer №1

Implementing a class is suggested by others to utilize the spread operator efficiently (alternatively, you could create a function that returns an object adhering to the Basicdata interface)

class Basicdata {
  materialnumber: number;
  type: string;
  materialclass: string;

  constructor(materialnumber: string | number, type: string, materialclass: string, ...rest: any) {
    this.materialnumber = typeof materialnumber === "number" ? materialnumber : parseInt(materialnumber);
    this.type = type;
    this.materialclass = materialclass;
  }
}

const rows: [string, string, string][] = [
  ["10003084", "S", "CLIP"],
  ["4324324", "B", "FOUR"],
  ["4444432", "C", "CORN"],
];

const singleRow = rows[0];

const newBD = new Basicdata(...singleRow) ;

Playground link

Answer 2

Implementing a class is suggested by others to utilize the spread operator efficiently (alternatively, you could create a function that returns an object adhering to the Basicdata interface)

class Basicdata {
  materialnumber: number;
  type: string;
  materialclass: string;

  constructor(materialnumber: string | number, type: string, materialclass: string, ...rest: any) {
    this.materialnumber = typeof materialnumber === "number" ? materialnumber : parseInt(materialnumber);
    this.type = type;
    this.materialclass = materialclass;
  }
}

const rows: [string, string, string][] = [
  ["10003084", "S", "CLIP"],
  ["4324324", "B", "FOUR"],
  ["4444432", "C", "CORN"],
];

const singleRow = rows[0];

const newBD = new Basicdata(...singleRow) ;

Playground link

Answer 3

Answer №2

An issue with the method presented here is its reliance on the consistent order of object properties. Is this in line with what you are seeking?

const rowValues = [1, "2", "3"];

const newObj: NewObject = {
    number: 0,
    type: "",
    category: "",
};

Object.keys(newObj).map((key, index) => {
    newObj[key] = rowValues[index]
});

If this does not meet your requirements, you may consider creating a class as suggested by others or utilize a helper function like below to assist with your specific scenario.

const createProperties = (values) => {
    const updatedObj = {
        number: values[0],
        type: values[1],
        category: values[2],
    };

    return updatedObj
};

createProperties(rowValues)

Answer 4

An issue with the method presented here is its reliance on the consistent order of object properties. Is this in line with what you are seeking?

const rowValues = [1, "2", "3"];

const newObj: NewObject = {
    number: 0,
    type: "",
    category: "",
};

Object.keys(newObj).map((key, index) => {
    newObj[key] = rowValues[index]
});

If this does not meet your requirements, you may consider creating a class as suggested by others or utilize a helper function like below to assist with your specific scenario.

const createProperties = (values) => {
    const updatedObj = {
        number: values[0],
        type: values[1],
        category: values[2],
    };

    return updatedObj
};

createProperties(rowValues)

typescript - instantiate an object using values stored in an array

Answer №1

Answer №2

Similar questions

Attempting to retrieve data from cloud Firestore utilizing keyvalue in Angular

Troubleshooting: Issues with locating CSS and JS files (404 error) while utilizing URL parameters within Django platform

Having trouble sending posts to an API route with Angular's HTTP module

There is an issue showing up in the console: $(…).datepicker is not defined as a function

Bootstrap relies on jQuery for its JavaScript functionality, so jQuery must be loaded before using Bootstrap's JavaScript

Run ajax function prior to changing location; status now marked as canceled

Setting the default typing language in Protractor: A step-by-step guide

What steps should I follow to include a message in the custom form validation rule in my React application?

Enhance your coding experience with Firebase Autocomplete on VScode

Stop jQuery function from activating twice during scrolling

Retrieve the 90 days leading up to the current date using JavaScript

The issue with Jquery .post function not functioning properly within a popup div

Determine if the browser displays <select multiple> as a modal dialog

Tips for verifying the rendered view post data retrieval from an API in Vue JS

Creating a dynamic anchor scrolling effect within a dropdown select menu

Error: Cannot access the length property of an undefined value in the JEST test

What sets apart the utilization of add versus finalize in rxjs?

How can I encode and decode a base64 string using AngularJS1 and TypeScript?

Send data from an AJAX request to a Laravel controller

The absence of a defined window - react-draft-wysiwyg integration with Next.js (SSR) is causing issues