ES6 Classes that depend on each other in static variables

Question

I have two classes that I want to define relationships for. I am trying to use static variables to achieve this however the references to the classes are not defined.

import BaseQuery from "../../src/BaseQuery";
import Checklist from "./Checklist";

export default class Task extends BaseQuery {
  static belongsTo = [Checklist];
}

---

import BaseQuery from "../../src/BaseQuery";
import Task from "./Task";

export default class Checklist extends BaseQuery {
  static hasMany = [Task];
}

In the Task class, checklist is undefined and in the Checklist class Task is defined but not as I would expect it. Is there anyway to get this to work?

Answer 1

You just experienced circular dependency. Task needs Checklist and Checklist needs Task; the interpretor cannot deal with that.

One of the soluce would be to use the get operator, which will delay the resolution of Checklist and Task classes and fix the circular dependency issue.

Checklist and Task gotta be resolved by the interpretor when calling belongsTo/hasMany.

---

Working example :

class Task {
  static get belongsTo() {
    return [Checklist];
  }

  static get name() {
    return 'Task-class';
  }
}

class Checklist {
  static get hasMany() {
    return [Task];
  }

  static get name() {
    return 'Checklist-task';
  }
}

console.log(Checklist.hasMany.map(x => x.name));

console.log(Task.belongsTo.map(x => x.name));