Javascript Question posted in
A very good W3school tutorial can be found here.

cannot access own properties in javascript constructor

I have a base class and another that extends it, how can I access fields in the constructor?

class BaseModel {
    constructor() {
        console.log('no fields :(')
        console.log(this.fields)
        this.fields.map((field) => {
            field.label = field.label || field.name;
        })
    }
}

class UserModel extends BaseModel {
    fields = [
        { name: 'id' },
        { name: 'name' },
        { name: 'email' },
    ];
    constructor(name, email) {
        super();
        this.name = name;
        this.email = email;
    }
}

const user = new UserModel('bob', '[email protected]');
console.log(user);

I went about 2 pages deep and didn’t find a satisfactory answer of how to set this up. The best I found was to set a timeout in the constructor which seemed wrong.

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    I messed with this for a bit longer and came up with a pretty reasonable solution. Feels like the least best of a bunch of not so great options.

    If you just rename the constructor on BaseModel to init(), then call super().init() in the child class it works fine, same w/ models 2-deep, could use more testing but seems like a decent solve for now.

    class BaseModel {
    init() {
        console.log('fields!')
        console.log(this.fields)
        this.fields.map((field) => {
            field.label = field.label || field.name;
        })
    }
}

class UserModel extends BaseModel {
    fields = [
        { name: 'id' },
        { name: 'name' },
        { name: 'email' },
    ];
    constructor(name, email) {
        super().init();
        this.name = name;
        this.email = email;
    }
    getName() {
        return this.name;
    }
}

class ModeratorModel extends UserModel {
    fields = [
        { name: 'id' },
        { name: 'name' },
        { name: 'email' },
        { name: 'permissions' },
    ];
    constructor(name, email, permissions) {
        super().init();
        this.name = name;
        this.email = email;
        this.permissions = permissions;
    }
    getPermissions() {
        return this.permissions;
    }
}

const user = new UserModel('bob', '[email protected]');
console.log(user);

const moderator = new ModeratorModel('jim', '[email protected]', 'all');
console.log(moderator);
console.log(moderator.getPermissions());

  2. 0

    If you want to access fields in the parent constructor sync you should pass the fields to it:

    class BaseModel {
    constructor(fields) {
        this.fields = fields;
        console.log(this.fields)
        this.fields.map((field) => {
            field.label = field.label || field.name;
        })
    }
}

class UserModel extends BaseModel { 
    constructor(name, email) {
        super([
            { name: 'id' },
            { name: 'name' },
            { name: 'email' },
        ]);
        this.name = name;
        this.email = email;
    }
}

const user = new UserModel('bob', '[email protected]');
console.log(user);
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search