Javascropt中的變量範圍

我在javascript中遇到變量作用域問題。我有以下代碼可以正常工作，但this.myUser的值在.subscribe(...)塊之外時變爲undefined。我不明白爲什麼，因爲它是一個類varibale。這裏是我的代碼：Javascropt中的變量範圍

private myUser: User; 

     login(username: string, password: string): User { 

      this.http.get(this.loginUrl + '?username=' + username + '&password=' + password) 
      .map((response : Response) => response.json()) 
      .subscribe(data => { 
       console.log('data inside', data); 
       this.myUser = data; 
       console.log('user inside', this.myUser); 
       } 
      ); 

      console.log('user outside', this.myUser); 

      return this.myUser; 

     }

下面是從控制檯日誌的結果：我使用angular 4與bootstrap 4

（但我不認爲有任何關於這個問題的影響）。感謝您的任何提示。

編輯我紅下面的鏈接，所以我嘗試添加promise到我的代碼來管理異步調用。在線教程似乎一切都很簡單（太簡單的確，包括Angular官方參考），所以我結束了這樣的事情：

this.http.get(this.loginUrl + '?username=' + username + '&password=' + password) 
     .toPromise() 
     .then(data => { 
      console.log('data inside', data); 
      this.myUser = data.json() as User; 
      console.log('user inside', this.myUser); 
      }) 
     .catch(console.log.bind('Error!'));

但它不會對應用流產生任何影響。我會繼續嘗試，但任何幫助將不勝感激。

來源

2017-08-04 esseara

如果您進行了此更改。

private myUser: User; 

login(username: string, password: string) =() : User => { 

    this.http.get(this.loginUrl + '?username=' + username + '&password=' + password) 
    .map((response : Response) => response.json()) 
    .subscribe(data => { 
    console.log('data inside', data); 
    this.myUser = data; 
    console.log('user inside', this.myUser); 
    } 
); 

    console.log('user outside', this.myUser); 

    return this.myUser; 
}

登錄函數的調用者將沒有範圍對象。在typescript中使用箭頭函數將使用局部變量來持久化此實例以引用包含您的函數的類。

來源

2017-08-04 08:55:20 ngeksyo

我試過你的解決方案，但它似乎完全跳過'this.http.get（...）'函數，因爲它只記錄最後一條語句。 – esseara

的問題是，當你打這條線可觀察到的未完成：

console.log('user outside', this.myUser);

觀測量是異步的。只有在AJAX調用（this.http.get）成功後纔會執行訂閱塊。 console.log語句將在observable創建後立即執行。

來源

2017-08-04 09:02:17 david

此問題已被標記爲可能的重複，除非您認爲它不是重複，否則不需要答案;） – Alex

Javascropt中的變量範圍

回答

相關問題