Mastering the art of crafting an Angular Domain Model accurately

Question

Mastering the art of crafting an Angular Domain Model accurately

When creating a domain model, is it best to define and set the properties inside the constructor for efficiency?

In my attempt below, I have defined the properties outside the constructor. Should I be setting them only inside the constructor to reduce the amount of code?

Here is what I believe to be the correct way:

export class TestModel1 {
  public currentPage: number = 0;
  public hasNext: boolean = false;
  public hasPrev: boolean = false;
  public pageSize: number = 0;
  public totalItems: number = 0;

  constructor(data: any) {
      this.currentPage = data.currentPage;
      this.hasNext = data.hasNext;
      this.hasPrev = data.hasPrev;
      this.pageSize = data.pageSize;
      this.totalItems = data.totalItems;
  }
}

Although functional, this implementation appears lengthy with a lot of lines of code.

Currently, I pass in a data object and then map the values. Is there a more efficient way to achieve this using the constructor function?

javascript angular typescript oop

Answer 1

Answer №1

When it comes to the model class, the declaration should follow a specific structure as shown below:

export class Account {
    constructor(
        public activated: boolean,
        public authorities: string[],
        public email: string,
        public firstName: string,
        public langKey: string,
        public lastName: string,
        public login: string,
        public imageUrl: string
    ) {}
}

It is recommended not to define values outside of the constructor. You can declare the model class members as demonstrated in your example, without assigning any values:

export class TestModel1 {
  public currentPage: number;
  public hasNext: boolean;
  public hasPrev: boolean;
  public pageSize: number;
  public totalItems: number;

  constructor(data: any = null) {
    if(data !== null) {
      this.currentPage = data.currentPage;
      this.hasNext = data.hasNext;
      this.hasPrev = data.hasPrev;
      this.pageSize = data.pageSize;
      this.totalItems = data.totalItems;
    }
  }
}

If you wish to set default values, it is advisable to do so within the constructor for better code organization.

Update:

export class TestModel1 {
  public currentPage: number;
  public hasNext: boolean;
  public hasPrev: boolean;
  public pageSize: number;
  public totalItems: number;

  constructor(data: any = null) {
    if(data !== null) {
      this.currentPage = data.currentPage;
      this.hasNext = data.hasNext;
      this.hasPrev = data.hasPrev;
      this.pageSize = data.pageSize;
      this.totalItems = data.totalItems;
    }
    else {
      this.currentPage = 0;
      this.hasNext = false;
      this.hasPrev = false;
      this.pageSize = 0;
      this.totalItems = 0;
    }
  }
}

Incorporating default values inside the constructor is the recommended approach if defaults are needed.

Answer 2

When it comes to the model class, the declaration should follow a specific structure as shown below:

export class Account {
    constructor(
        public activated: boolean,
        public authorities: string[],
        public email: string,
        public firstName: string,
        public langKey: string,
        public lastName: string,
        public login: string,
        public imageUrl: string
    ) {}
}

It is recommended not to define values outside of the constructor. You can declare the model class members as demonstrated in your example, without assigning any values:

export class TestModel1 {
  public currentPage: number;
  public hasNext: boolean;
  public hasPrev: boolean;
  public pageSize: number;
  public totalItems: number;

  constructor(data: any = null) {
    if(data !== null) {
      this.currentPage = data.currentPage;
      this.hasNext = data.hasNext;
      this.hasPrev = data.hasPrev;
      this.pageSize = data.pageSize;
      this.totalItems = data.totalItems;
    }
  }
}

If you wish to set default values, it is advisable to do so within the constructor for better code organization.

Update:

export class TestModel1 {
  public currentPage: number;
  public hasNext: boolean;
  public hasPrev: boolean;
  public pageSize: number;
  public totalItems: number;

  constructor(data: any = null) {
    if(data !== null) {
      this.currentPage = data.currentPage;
      this.hasNext = data.hasNext;
      this.hasPrev = data.hasPrev;
      this.pageSize = data.pageSize;
      this.totalItems = data.totalItems;
    }
    else {
      this.currentPage = 0;
      this.hasNext = false;
      this.hasPrev = false;
      this.pageSize = 0;
      this.totalItems = 0;
    }
  }
}

Incorporating default values inside the constructor is the recommended approach if defaults are needed.

Answer 3

Answer №2

One prominent concern highlighted in the query is that of repetition. The constructor contains duplicated properties, a practice that goes against the DRY principle essential for maintaining clean code.

To streamline the instantiation of a new instance of your domain object, consider implementing the following approach:

export class TestModel1 {
  public currentPage: number;
  public hasNext: boolean;
  public hasPrev: boolean;
  public pageSize: number;
  public totalItems: number;

  constructor(data: any) {
      Object.keys(data).forEach(key => {
         this[key] = data[key]
      });
  }
}

It's crucial to ensure that the input data object contains only the necessary properties, a task that can prove challenging depending on the data source.

Answer 4

One prominent concern highlighted in the query is that of repetition. The constructor contains duplicated properties, a practice that goes against the DRY principle essential for maintaining clean code.

To streamline the instantiation of a new instance of your domain object, consider implementing the following approach:

export class TestModel1 {
  public currentPage: number;
  public hasNext: boolean;
  public hasPrev: boolean;
  public pageSize: number;
  public totalItems: number;

  constructor(data: any) {
      Object.keys(data).forEach(key => {
         this[key] = data[key]
      });
  }
}

It's crucial to ensure that the input data object contains only the necessary properties, a task that can prove challenging depending on the data source.

Mastering the art of crafting an Angular Domain Model accurately

Answer №1

Answer №2

Similar questions

The argument being passed, which is of type 'unknown[]', cannot be assigned to a parameter of type 'SetStateAction<never[]>'

Guide to rounding values retrieved from JSON object using Math.round in Vue.js

A Typescript interface designed for a higher-order function that returns another function

The name "Identifier" has already been declared before

The Serverless Function appears to have encountered a critical error and has

Developing a TypeScript WebSocket client that operates seamlessly in both browser and Node.JS environments

Exploring Generics and Type Inference within TypeScript

TypeScript does not properly validate the types of defaultProps

difficulties with creating Objects

Is there a reason why this MD Bootstrap Snippet isn't functioning properly?

Unable to invoke JS function in Drupal 5 file

Initiate automatic video play delay on YouTube

Updating a Vue component following an axios POST request

How can I include the "Referer" header in Angular Universal HttpClient XHR requests?

What causes my browser fingerprint to consistently remain unchanged?

Utilizing Array in ReactJS with the Power of Hooks

Encountered a Milvus 2 Node.js SDK issue: "Error: TypeError: Class extends value undefined is not a constructor or null"

Removing HTML elements using JQuery

Exploring CSS animations by utilizing the transform and color properties

Challenges when upgrading from Ext JS 3 to Ext JS 4