奧裏利亞transpiler： 「這個」 爲 「null」

Question

我在Aurelia大街的應用程序下面的代碼：

import {digit} from "../util/random" // generates a random digit [0,9] 

export class UnitedStates { 

    zipCode() { 
    return ""+digit(5); 
    }; 

    zipPlus4() { 
    return this.zipCode()+"-"+digit(4); 
    }; 

    ... 

} 

收到錯誤TypeError: Cannot read property 'zipCode' of null上的zipPlus4身體。在開發者工具中檢查發現this是null。

爲什麼thisnull，以及如何解決這一問題？

Answer 1

這是譯者的問題。回想一下，箭頭函數表示法保持詞法this（或更多地爲read here）。所以，當Babel和其他transpiler進入一個新的範圍時，他們維護一個本地的這個變量，以便它可以從任何子範圍訪問。通常，這個變量是_this。

有時候，像DevTools這樣的調試器很難理解源代碼，並且他們報告了一個空值this。原來，這只是在檢查代碼時;運行代碼時，它可以正常工作。

那麼當報告爲空時，如何檢查this的值？通常從控制檯檢查_this。這會給你真正使用的this值。