typescript handler where this [] = value

下面的打字稿函數在我打算使用的類中，而[col] =的賦值是我想進一步理解的，這是否意味着我可以訪問col父類還是另一種將它返回給調用者的方法？typescript handler where this [] = value

export class DemoResponsiveRows implements OnDestroy { 
private _activeMQC : MediaChange; 
private _watcher : Subscription; 

firstCol = "row"; 
firstColXs = 'column'; 
firstColMd = 'column'; 
firstColLg = 'invalid'; 
firstColGtLg = "column"; 

secondCol = "column"; 

isVisible = true; 

constructor(@Inject(MatchMediaObservable) private _media$) { 
this._watcher = this._media$ 
    .subscribe((e:MediaChange) => { 
     this._activeMQC = e; 
    }); 
} 

ngOnDestroy() { 
this._watcher.unsubscribe(); 
} 

toggleLayoutFor(col) { 
switch(col) { 
    case 1: 

    col = `firstCol${this._activeMQC ? this._activeMQC.suffix : ""}`; 
    this[col] = (this[col] === "column") ? "row" : "column"; 
    break; 

    case 2: 
    col = "secondCol"; 
    this[col] = (this[col] == "row") ? "column" : "row"; 
    break; 
}}}

來源

2016-12-28 gmaon

改完成，我試圖瞭解 – gmaon

由於更新問題類的例子，我們現在可以看到'_activeMQC'將會是未定義的或將具有「Xs」，「Md」，「Lg」或「GtLg」的屬性。由於後綴值可以在運行時動態更改，因此您要求的代碼在運行時計算「col」的值爲「firstCol」，「firstColXs」，「firstColMd」，「firstColLg」或「firstColGtLg」。然後，如果它是「行」，則將該變量的值切換到「列」，反之亦然。在「firstColLg」的情況下，其值是原始的「無效」，它會將其設置爲「列」。 – GPicazo

該代碼非常混亂，所以我不會試圖解釋代碼爲什麼寫的原因，只是它在做什麼。另外，我想指出打字稿與爲什麼用這種形式編寫代碼很少或根本沒有關係 - 最好的情況是打字稿可能播放的唯一角色是提供正在使用的類構造，如果代碼不是ES6，我懷疑它是使用反模板文字。

也就是說，該方法採用參數col，但提供的值完全被忽略，因爲第一條語句會用字符串值覆蓋該值。該課程有一個名爲_activeMQC的屬性，該屬性可能或可能不會被分配;如果被賦值，它應該是一個名爲suffix屬性的對象，我可以假設它可能被賦予或不被賦值。因此，第一個發言後，col的值是：

「firstCol」，如果_activeMQC屬性未定義或者是falsy值。
「firstColundefined」，如果_activeMQC屬性具有值，但是不具有限定suffix屬性
「firstCol <後綴>」的對象，如果_activeMQC屬性分配並具有suffix屬性具有值<後綴>。

第二條語句將在該類上找到一個名稱對應於col的值的屬性，並將其值設置爲「row」或「column」。如果屬性的值既不是「行」也不是「列」，它會將其設置爲「列」，否則它將在這些值之間切換。

最後一條語句break;完全沒有必要。

== UPDATE ==

此更新是響應於它是否正確在JavaScript中使用點標記（this.col）或括號符號（this["col"]）的問題。

我不認爲這兩種方式都比Javascript更正確。但是，更常見的方法是在可能的情況下使用點符號this.col。

使用括號表示法this[col]的一個常見原因是，如果屬性名稱包含空格或特殊字符。例如，如果某個屬性被稱爲「屬性」，則不能使用點符號，但可以使用括號表示法this["the property"]。

使用方括號表示法的另一個常見原因，如您在提供的示例中所述，是您需要確定要在運行時訪問的屬性。例如，假設我們有N個屬性prop1，prop2，...，propN，並且我們要分配值1,2 ... N。我們能做到這一點，如下所示：

for (var i = 1; i <= N; i++) { 
    this['prop' + i] = i; 
}

有了點符號，你將不得不單獨分配給每個爲：

this.prop1 = 1; 
this.prop2 = 2; 
... 
this.propN = N;

來源

2016-12-28 21:41:29 GPicazo

謝謝。這是一個代碼片段，並沒有包括類和它的變量。我試圖理解賦值this [col] =並且是否存在另一種形式，例如this.col =在父類中是等價的還是這個[col] =在javascript中設置類變量的正確方法？ – gmaon

我已經更新了答案，以回答哪個問題是正確的。 – GPicazo

您的回答非常感謝！我向上提出了你，但我是新的，所以我想它不會計算它，直到我有更多的聲譽... – gmaon

typescript handler where this [] = value

回答

相關問題