強制打字稿將方法放在實例上而不是原型

Question

是否可以強制打字稿將方法放在實例上而不是原型上。我問這個問題是因爲我經常遇到有關原型方法會導致問題的「範圍」問題。

編輯

---

例如從它似乎不一致的TS輸出，我保持FooAlert在FooViewModel功能，但在原型

方法openFooAlertDialogueAdd的js

var FooViewModel = (function() { 
    function FooViewModel (json) { 
     this.Foolert = ko.observable(); 

    } 
    FooViewModel.prototype.openFooAlertDialogueAdd = function() { 
     this.FooAlert = something; 
    }; 

Ts

class FooViewModel{ 
    FooAlert = KnockoutObservableAny 

     constructor(){ 
     this.FooAlert = ko.observable(); 
     } 
    openFooAlertDialogueAdd() { 
     this.FooAlert = something; 
    }; 

} 

Answer 1

原型上的方法是在每個實例上可用的方法。

class Example { 
    constructor(private someProperty: string) { 

    } 

    method() { 
     return this.someProperty; 
    } 
} 

var exampleA = new Example('A'); 
var exampleB = new Example('B'); 
var exampleC = new Example('C'); 

console.log(exampleA.method()); // A 
console.log(exampleB.method()); // B 
console.log(exampleC.method()); // C 

每個實例將有someProperty和method()複製到它的原型。您可以檢查此使用：

alert(exampleC.hasOwnProperty('someProperty') ? 'Yes' : 'No'); 

只有當實例沒有自己的財產了JavaScript都會走上去，任何依賴關係鏈中找到一個類上漲依賴鏈的屬性。

如果您提供的代碼在this範圍內遇到問題，我相信我們可以幫助您解決問題。

Answer 2

如果你有範圍問題我爲你感到不好兒子，我有99個問題，但這不是一個！

Steve的答案顯示了定義類方法的正確方法，這些方法將在每個實例上公開。但是，如果遇到範圍問題，這可能是由於您從另一個上下文中調用這些方法。例如，如果您使用Knockout並將這些方法中的一種綁定到click綁定，則Knockout將覆蓋當前綁定範圍的範圍，而不是您已定義該方法的範圍。

有兩種選擇可以防止這種範圍的丟失。

首先，您可以在構造函數中定義您的方法，以在實例上而不是在原型上顯示它們。

像：

class Greeter { 
    greet:() => string; 
    greeting: string; 

    constructor(message: string) { 
     this.greeting = message; 
     this.greet =() => { 
      return "Hello, " + this.greeting; 
     } 
    } 

其次，你可以使用=>語法範圍類的方法。

例子：

class Greeter { 
    greeting: string; 
    constructor() { 
     this.greeting: "Blabla"; 
    } 
    greet=() => { 
     alert(this.greeting); 
    } 
} 

Answer 3

看起來這是一個打字稿/淘汰賽的問題，因爲在@Anzeo他的回答，以及你的編輯指出。我已經解決了這個問題，把我的方法聲明放在構造函數中，但也使用了Knockout's Computed Observable documentation的「管理」這個''部分中指出的約定var self = this;。你TS碼看起來是這樣的：

class FooViewModel{ 
    FooAlert: KnockoutObservableAny; 
    openFooAlertDialogueAdd:() => void; 

    constructor(){ 
     var self = this; 
     self.FooAlert = ko.observable(); 
     self.openFooAlertDialogueAdd = function(){ 
      self.FooAlert('whatever your FooAlert observable takes'); 
     }; 
    } 
} 

不管會發生什麼範圍變更，圍繞self JavaScript的關閉使您不必擔心this變化。這應該可以解決你的問題。