title: How to use Immutable JS with typed ES6 classes?
body: <p>Say I have classes <code>Task</code> and <code>TaskGroup</code></p>
  
  <pre><code>class Task{
       constructor(public text:string){}
  }
  
  class TaskGroup {
      constructor(public title:string = "new task group", public tasks:Task[] = []){}
  }
  </code></pre>
  
  <p>Then in my Angular 2 service I will create an Immutable List of TaskGroups</p>
  
  <pre><code>@Injectable()
  class TaskService {
      taskGroups:Immutable.List&lt;TaskGroup&gt;;
  
      constructor() {
         this.taskGroups = Immutable.List&lt;TaskGroup&gt;([new TaskGroup("Coding tasks")]);
      }
  }
  </code></pre>
  
  <p>This way only taskGroups List is immutable. Whatever is inside it isn't. Even if I do <code>Immutable.fromJS(...)</code> instead of <code>Immutable.List&lt;Board&gt;(...)</code> the nested objects are plain ol' Javascript objects.</p>
  
  <p>Immutable JS doesn't supposed class inheritance (<a href="https://github.com/facebook/immutable-js/issues/562">Inheriting from Immutable object with ES6 #562</a>)</p>
  
  <pre><code>//can't do this!
  class TaskGroup extends Immutable.Map&lt;string, any&gt;{
      constructor(public title:string = "new task group", public tasks:Task[]){}
  }
  //it complained about the class not having methods like set, delete etc
  </code></pre>
  
  <p>So how to create Immutable class objects?</p>