Accessing this inside super() method - javascript

Question

The code is as follows

class ComposerForm extends BaseForm {
  constructor(formsObject, options) {
    super({
      ...options,
      setup: {},
    });
    this.formsObject = { ...formsObject };
  }
  ..
}

Now i have a new form

class PreferencesForm extends ComposerForm {
  constructor(company, options = {}) {
    super(
      {
        upids: new UpidsForm(company).initialize(),
        featureSettings: new FeatureSettingsForm(company)
      },
      options
    );
  }
}

When initialising the FeatureSettingsForm, i need to pass the Preference form along with the company object

Something like

  {
    featureSettings: new FeatureSettingsForm(company, {prefForm: this})
  },

so that i can access the preference form inside featureSettings form.

But this cannot be done since this cannot be accessed inside the super method.

Any idea on how to achieve this?

Can you show us the code where you tried that and it didn't work? It's true you can't use `this` before you call `super` (so you can't use it in the arguments you pass `super`, since that's "before"), but it would be useful to see the actual failing code in order to help. — T.J. Crowder, Aug 09 '21 at 08:26
Can we please see the `BaseForm` implementation, especially how it handles/processes `options`. And does `FeatureSettingsForm` also `extend BaseForm`? Depending on this information a solution might be even easier than expected. — Peter Seliger, Aug 09 '21 at 09:20
It is merely a sophisticated guess. But from looking into the available code, how the passed arguments get handled, mainly by destructuring (assignments) , how about then writing within the super call something like ... `{ featureSettings: new FeatureSettingsForm(company, {prefForm: null}) }` ... and after the super call, still within the constructor function, something like that ... `this.prefForm = this` ... or anything similar which does target the most probably public availabe `prefForm` property. — Peter Seliger, Aug 09 '21 at 10:39
The scenario is same as mentioned by tj crowder. I have modified the form accordingly so that i don't have to pass this inside FeatureSettingsForm — prajeesh, Aug 11 '21 at 05:09

score 0 · Answer 1 · answered Aug 09 '21 at 08:30

If I understand you right,

You need to pass a FeatureSettingsForm instance in the object you're passing to super (ComposerForm) in the PreferencesForm constructor, and
You need this in order to create the FeatureSettingsForm instance

So you have a circular situation there, to do X you need Y but to do Y you need X.

If that summary is correct, you'll have to¹ change the ComposerForm constructor so that it allows calling it without the FeatureSettingsForm instance, and add a way to provide the FeatureSettingsForm instance later, (by assigning to a property or calling a method) once the constructor has finished, so you can access this.

¹ "...you'll have to..." Okay, technically there's a way around it where you could get this before calling the ComposerForm constructor, by falling back to ES5-level ways of creating "classes" rather than using class syntax. But it general, it's not best practice (FeatureSettingsForm may expect the instance to be fully ready) and there are downsides to have semi-initialized instances (that's why class syntax disallows this), so if you can do the refactoring above instead, that would be better. (If you want to do the ES5 thing anyway, my answer here shows an example of class compared to the near-equivalent ES5 syntax.)

Accessing this inside super() method - javascript

1 Answers1