Call Method from Constructor: Error: Uncaught TypeError: undefined is not a function

14,961

Solution 1

Here's how to call a method from the constructor:

class Thing {
    constructor(name: string) {
        this.greet(name);
    }

    greet(whatToGreet: string) {
        console.log('Hello, ' + whatToGreet + '!')
    }
}

var x = new Thing('world'); // Prints "Hello, world!"

Solution 2

The following is what I was looking for.

Solution Source:
How can I preserve lexical scope in TypeScript with a callback function

How to preserve Lexical Scope of this. in Typescript:

if the following declaration for methods isn't working:

export class myClass
{
    constructor()
    {
        var myString:string = this.myMethod(true);
    }
    
    public myMethod(useBigString:boolean) : string
    {
        if(useBigString)
        {
            return "bigString";
        }
        return "smlStr";
    }
}

which produces a method in javascript like the following:

myClass.prototype.myMethod = function (useBigString) {



Instead, Try declaring your methods this way:

export class myClass
{
    constructor()
    {
        var initString:string = this.myMethod(true);
    }
    
    public myMethod = (useBigString:boolean) : string => {
        if(useBigString)
        {
            return "bigString";
        }
        return "smlStr";
    }
}

which declares the method in javascript from within the constructor:

this.myMethod = function(useBigString) {



A drawback is that Method Syntax highlighting will not recognize this sort of definition, but it definitely Compiles and Works! This situation doesn't apply for Class Variables like it does for Class Methods.

Share:
14,961
Jono Tho'ra
Author by

Jono Tho'ra

Interactive Mobile and Web Developer

Updated on July 24, 2022

Comments

  • Jono Tho'ra
    Jono Tho'ra almost 2 years

    Task: I need to build a class in Typescript that calls some of it's own methods in it's own Constructor.

    Problem: The Actual Code that the following Sample Code represents will Compile Successfully, but upon testing in the Javascript Console, it does not.

    Sample:

    export class volumeEQ
    {
        constructor(ctx:any) 
        {
            this.ctx = ctx;         // Audio context saved into member variable of class
            this.setupAudioNodes(); // Sets up nodes made out of audio
        }
    
        setupAudioNodes()
        {
            this.sourceNode.connect(this.ctx.destination); // Connect to destination
        }
    }
    

    Technical: The Typescript Compiler does not have a problem with this.setupAudioNodes() but once called as Javascript within the Browser's Javascript Console I receive an error Uncaught TypeError: undefined is not a function. Effectively, this is an issue with Javascript's this. syntax and how it's easy to get confused with it. But because I'm developing in Typescript, I want a more Typescript style solution.

    Question: How can I call a Class's Methods from it's Constructor in Typescript?

  • Jono Tho'ra
    Jono Tho'ra almost 10 years
    This answer makes sense.
  • Ryan Cavanaugh
    Ryan Cavanaugh almost 10 years
    Why not include a sample that actually reproduces the problem?
  • Jono Tho'ra
    Jono Tho'ra almost 10 years
    not sure how... I haven't gotten this far before in practicing Typescript. For context: I'm making tools and UI systems using cocos2d-JS. I'm programming with Sublime Text 3 and the Better Typescript package installed, also got the tsc build commands working too. I initially installed tsc using node.js. My classes are being called from an entry point constructor called by the cocos2d engine. I'm running this in Chrome Canary, because I'm practicing using the new webkitAudioContext(). The problem persists in regular Chrome as well.
  • pawciobiel
    pawciobiel over 8 years
    You may know this by now, but you won't be able to override/overload your "myMethod".
  • julio
    julio about 8 years
    What you do is like creating a static method