TypeScript ile bir geri aramadan bu anahtar kelime çalışmıyor

class Util
{
    callback(callme: () => void)
    {
        callme();
    }
} 


class Greeter {
    greeting: string;
    util: Util;
    Me : Greeter;
    constructor(message: string) {
        this.greeting = message;
        this.util = new Util();
    }
    greet() {
        return "Hello, " + this.greeting;
    }

    callMe()
    {
        this.util.callback(this.greet);         
    }
}

var greeter = new Greeter("world");

var button = document.createElement('button');
button.textContent = "Say Hello";
button.onclick = function() {
    alert(greeter.callMe());
}

document.body.appendChild(button);

this anahtar kelimesiyle ilgili sorunlar yaşıyorum, böyle kod yazdığımda sınıfı göstermiyor. Bu uygulamayı nasıl çalıştırabilirim? this, böyle bir geri aramada kullanıldığında window'u gösteriyor...

koda bağlantı

Cevap #1

Bunu değiştir

this.util.callback(this.greet.bind(this));

Sorun şu ki greet metodunuza bir referans geçirdiğinizde, JavaScript sadece bir fonksiyonun argüman olarak geçirildiğini görür. Fonksiyon çalıştırıldığında yeni bir bağlama ihtiyaç duyar ve o noktada "this"in temsil ettiği şeyi kullanır.

Bunu önlemek için, fonksiyonunuzu kendi bağlamına bağlayabilir ve çalıştırıldığında yeni bir bağlam atanmasını önleyebilirsiniz. Bunu yapmak için bind kullanırsınız. İlk argümanı, fonksiyon çalıştırıldığında kullanılacak bağlam nesnesini tanımlamanıza olanak tanır.

Bu kısmen şu anlama gelir:

var self = this;
this.utils.callback(function(){
   self.greet();
});

Bu, TypeScript kapanışı kullanarak yorumlarda aldığınız cevapla eşdeğerdir

() => this.greet();