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中的变量范围

回答

相关问题