BalaKrishnan웃
BalaKrishnan웃

Reputation: 4557

How to create a function in class that is not going to the prototyped function in TypeScript?

When i create a function inside the class, TS compiler makes that function as prototyped function for example.

class MyClass {
    getExample()
    {

    }
}

the resultant is

var MyClass = (function() {
    function MyClass() {}
    MyClass.prototype.getExample = function() {};
    return MyClass;
})();​

but what i need is

function MyClass() {

    this.getExample = function() {

    }
}​

is it possible to get a function like this ?

Upvotes: 2

Views: 179

Answers (4)

Karthi Keyan
Karthi Keyan

Reputation: 4393

Take a look at this JQFAQ.com link, here is the answer for your question 'How to create a function in class that is not going to the prototyped function in TypeScript?', and there are more FAQs available.

Upvotes: 3

Fenton
Fenton

Reputation: 250982

You can do it like this:

class MyClass {
    static getSomething() {

    }
}

The static keyword means it is not a prototype method and you won't need to call it on an instance - just call it with:

MyClass.getSomething();

Of course, this may not be what you want - but you'll need to share why you need it to make that clearer.

Upvotes: 0

John Papa
John Papa

Reputation: 22318

Methods you add to the constructor in TypeScript will be added as instance methods.

Methods you add outside the constructor and within the class will be added to the prototype of the object. This is the preferred way if you are "newing" up several instances of the class as it saves on memory. But when you do this you need to make sure you have access that you need to instances memebrs and the proper "this", which you can do by setting them in advance.

I recommend considering prototypes first, then falling back to instance if you truly need them for methods. If its a singleton object, then it really doesn't matter.

However ... when you create classes in TypeScript the concept of private and public does not translate to the emitted JavaScript. So keep this in mind as you are exposing every instance member in JavaScript. I prefer to use a pattern like the Module Pattern in JavaScript, which hides internal variables/methods and exposes only what I want to be accessible. You can get this with TypeScript by creating a function that returns the accessible members of an object (no classes). Just thought I'd mention the alternative.

Upvotes: 1

Elias Van Ootegem
Elias Van Ootegem

Reputation: 76405

I had a look at TypeScript (like the online playground... prefer writing my own JS, though :P)
As far as I can tell, what you want to do can be done quite easily, I've tried a few things myself and this worked like a charm for me:

class Greeter {
    greeting: string;
    closureMethod;
    constructor (message: string) {
        this.greeting = message;
        var that = this;
        var closureMethod = function()
        {
            console.log(that.greeting);
        };
        this.closureMethod = closureMethod;
    }
    greet() {
        return "Hello, " + this.greeting;
    }
}   
var greeter = new Greeter("world");
var another = new Greeter('Foobar');
var button = document.createElement('button');
button.innerText = "Say Hello";
button.onclick = function()
{
    greeter.closureMethod();
    another.closureMethod();
}
document.body.appendChild(button)

Which worked, but even shorter (and this works, too)

class Greeter {
    greeting: string;
    closureMethod;//define property here, no type
    constructor (message: string) {
        this.greeting = message;
        var that = this;
        this.closureMethod = function()
        {
            console.log(that.greeting);
        };
    }
    greet() {
        return "Hello, " + this.greeting;
    }
}   

Both produce the same result: a constructor that defines a method over and over, for each new instance (which, honestly, is not a great idea).
As you can see, it accesses the instance using that, rather than this, which is the only upside of creating the same method over and over... as long as you have a good reason to do so. But I'm not going off in a rant on this.
The code above works, it generates a constructor function like the one you wanted.

Upvotes: 2

Related Questions