title: typescript: 'new' call to function
body: <p>Recently I thought of converting a side project of mine into Typescript. But I have trouble with calling functions using new.</p>
  <p>I am trying to call a function imported from another file like this:</p>
  <pre class="lang-js prettyprint-override"><code>// Function in 'file.js'
  function Foo() {
    this.x = 1;
    this.y = 2;
  }
  Foo.prototype.set = function() {
     return this.x + this.y;
  };
  export { Foo };
  </code></pre>
  <pre class="lang-js prettyprint-override"><code>// Function in another file calling Foo
  import { Foo } from './file';
  function getSum() {
    let foo = new Foo(); // I got the below error here!!!
    foo.set();
  }
  </code></pre>
  <p>When I try to type this, I get this error: <code>'new' expression, whose target lacks a construct signature, implicitly has an 'any' type.</code>.</p>
  <hr />
  <p>Looking at the <a href="https://www.typescriptlang.org/docs/handbook/2/functions.html#function-type-expressions" rel="nofollow noreferrer">typescript documentation</a>, I understand the call signature should be written as follows:</p>
  <pre class="lang-js prettyprint-override"><code>type SomeConstructor = {
    new (s: string): SomeObject;
  };
  function fn(ctor: SomeConstructor) {
    return new ctor(&quot;hello&quot;);
  }
  </code></pre>
  <hr />
  <p>But I don't know how to apply the above type to my 'Foo' function.
  I tried to apply the construct signature to the function but couldn't place it right.</p>
  <pre class="lang-js prettyprint-override"><code>// Function in 'file.js' --&gt; renamed to 'file.tsx'
  type FooType = {
    x: number,
    y: number,
  };
  
  type FooConstructor = {
    new (): FooType
  };
  
  function Foo(this: FooType) { // How do I add FooConstructor to this?
    this.x = 1;
    this.y = 2;
  }
  Foo.prototype.set = function(): number {
     return this.x + this.y;
  };
  </code></pre>
  <p>I couldn't apply it while exporting / importing or during function call either. All of the below throw errors.</p>
  <pre><code>export { Foo: FooConstructor };
  import { Foo: FooConstructor } from './file';
  let foo = new Foo() as FooConstructor;
  </code></pre>
  <p>So should I have to change the Foo function into a class, is that the only possible way to type it?! I see many blogs showing how to type a class. But even with that approach, I got an error saying, <code>Type 'FooType' is not assignable to type 'FooConstructor'</code>.</p>
  <p>And I am lost here. Any help is appreciated!</p>
  <hr />
  <p>EDIT: My File.ts looks like this now:</p>
  <p>I add the declaration in the File.ts file, like this:</p>
  <pre class="lang-js prettyprint-override"><code>type FooType = {
    x: number,
    y: number,
  };
  
  declare class Foo {
    constructor();
    x: number;
    y: number;
    setHeader(): number;
  }
  
  function Foo(this: FooType) {
    this.x = 1;
    this.y = 2;
  }
  Foo.prototype.set = function(): number {
     return this.x + this.y;
  };
  
  export { Foo };
  ```
  </code></pre>