CODEWITHSUNDEEP
arraystypescript
javierojeda
javierojeda

Reputation: 308

Typescript array asignment error

I have this class:

user.ts

const ADMIN = 1;
const AGENT = 2;
const ADJUSTER = 3;
const MANAGER = 4;
const MOTORCYCLIST = 5;

export class User {
  id: number;
  name: string;
  email: string;
  phone: string;
  status: string;
  role: number;

  isAdmin(): boolean {
    return this.role === ADMIN;
  }

  isAgent(): boolean {
    return this.role === AGENT;
  }

  isAdjuster(): boolean {
    return this.role === ADJUSTER;
  }

  isManager(): boolean {
    return this.role === MANAGER;
  }

  isMotorcyclist(): boolean {
    return this.role === MOTORCYCLIST;
  }
}

For testing reasons I'm using a mock users array (for brevity I will show an array of just 5 users, but in my code I have more than 1000):

mock-users.ts

import { User } from '../models/user';

export const USERS: User[] = [{"id":301,"name":"Shirlee Zboncak","email":"[email protected]","phone":"044 93 1342 0977","status":"inactive","role":3},{"id":302,"name":"Erich Auer","email":"[email protected]","phone":"044 87 8444 6879","status":"inactive","role":2},{"id":303,"name":"Jerrold McDermott","email":"[email protected]","phone":"044 64 7490 1751","status":"inactive","role":3},{"id":304,"name":"Yael Hilpert","email":"[email protected]","phone":"044 16 9190 7970","status":"inactive","role":4},{"id":305,"name":"Pat Hodkiewicz","email":"[email protected]","phone":"044 12 0242 7692","status":"inactive","role":3}]

The problem is that that code fails with this message in console

And in my editor it shows this another message: 

Missing property 'isAdmin' on type '{ "id": number; "name": string; "email": string; "phone": string; "status": string; "role": numbe...'.

How can I make my User class to not try to assign the methods. I only want to assign those id, name, email, phone, status and role properties. I have tried to use a constructor but the error is the same.

Upvotes: 2

Views: 74

Answers (2)

Tsvetan Ganev
Tsvetan Ganev

Reputation: 8856

You said that you have tried using a constructor, but maybe you didn't do it right as well.

Here is one way to solve your problem. First an interface is created to unify the user data needed to construct a User object.

export interface UserData {
  id: number;
  name: string;
  email: string;
  phone: string;
  status: string;
  role: number;
}

Then in the User class definition a field of type UserData is declared where the user data will be kept.

export class User {
  data: UserData;

  constructor(userData: UserData) {
    this.data = userData;
  }

  isAdmin(): boolean {
    return this.data.role === ADMIN;
  }

  // + all other method declarations
}

If you don't want to store your user data into a field of type UserData, you can just use the interface in the constructor, like this:

export class User {
  id: number;
  name: string;
  email: string;
  phone: string;
  status: string;
  role: number;

  constructor(userData: UserData) {
    this.id = userData.id;
    this.name = userData.name;
    // etc.
  }

  isAdmin(): boolean {
    return this.role === ADMIN;
  }
}

Then you can instantiate objects from the User class by using the new keyword and the constructor, which takes an UserData object as a parameter.

export const USERS: User[] = [
  new User({
    id: 301,
    name: "Shirlee Zboncak",
    email: "[email protected]",
    phone: "044 93 1342 0977",
    status: "inactive",
    role: 3
  })
];

Now you can create User objects without specifying the method definitions.

Upvotes: 2

user1641172
user1641172

Reputation:

You could add a constructor to the class and just map the array:

constructor(id,name,email,phone,status,role) {
    this.id = id;
    //...etc
}

then 

export const USERS: User[] = [{...array values}].map(u=>new User(...u))

Upvotes: 0

Related Questions